17. موشن + انیمیشن (MOTION & ANIMATION)

استانداردهای موشن و انیمیشن

تعریف حرکت در ابعاد و فیلدهای متعدد برند مبتنی بر سری از عوامل و پارامترها می باشد، لذا در این قسمت به توضیح و تشریح فلسفه، رفتار و دستور زبان بصری حرکت پرداخته شده است .

1 - زبان و اصول حرکت

فلسفه حرکت :

این آیتم نقش مفهومی حرکت را در هویت برند تعریف می‌کند. جنبه های کلیدی آن عبارتند از : لحن احساسی حرکت ، رابطه با شخصیت برند و هدف حرکت در ارتباطات. در برندی همانند هاکوپیان حرکت باید آرام، پالایش شده و سنجیده به نظر برسد و منعکس کننده مهارت برند باشد. همچنین موارد زیر ضروری و مهم به شمار می روند: حرکت باید مینیمال و کنترل‌شده باشد. انتقال‌ها باید روان و سنجیده به نظر برسند. حرکت باید از محتوا پشتیبانی کند نه اینکه بر آن غلبه کند.

اصول آزاد ‌سازی حرکت :

آسان‌سازی نحوه شتاب‌گیری و کاهش سرعت حرکت را تعریف می‌کند. سیستم کاهش سرعت باید کاهش سرعت طبیعی را شبیه‌سازی کند و از حرکت خطی (بیش از حد مکانیکی)، کاهش پرش و کاهش الاستیک.اجتناب کند. در واقع مباحث ease-in و ease-out در هنگام شروع و توقف بسیار مهم محسوب می شوند.

شخصیت حرکت:

پارامترهایی نظیر میزان سیالیت حرکت، وزن، شدت انرژی حرکتی و ریتم تعیین کننده شخصیت حرکت خواهند بود. موارد زیر ضروری و مهم به شمار می روند: سرعت باید کنترل شده و با حفظ ثبات انجام شود. از حرکات بازیگوشانه یا اغراق آمیز پرهیز گردد. از حرکت های جهشی پرهیز گردد. یکنواختی ریتم حرکتی حفظ گردد. نویز بصری نمی باید در فرایند حرکت مشاهده گردد.

منطق جهت حرکت :

این آیتم رفتار جهت‌دار حرکت را تعریف می‌کند.بدین معنا که حرکت باید از مرکز سرچشمه بگیرد یا از سلسله مراتب پیروی کند. سلسله مراتب یعنی پیشروی در راستای افق، گسترش از مرکز و حرکت شعاع گونه . در برایند نهایی این منطق را بیان می کند که جهت حرکت می باید روند مشخص داشته باشد و فرم حرکت نمی باید منطق غیر عادی و خارج از فرم داشته باشد. انتقال‌ها باید روان و سنجیده به نظر برسند. حرکت باید از محتوا پشتیبانی کند نه اینکه بر آن غلبه کند.

تمپوی حرکت (سرعت و زمان‌بندی) :

تمپو تعریف می‌کند که حرکت چقدر سریع یا آهسته اتفاق می‌افتد. در این میان ریتم توالی‌های حرکت و ثبات زمان‌بندی مهم هستند. برای برند هاکوپیان زمان بندی آهسته و سنجیده از الزامات موضوع تمپو هستند.به این معنا که میزان سرعت نمی باید بیش از حد انتظار معمول و نه کمتر باشد.

رفتار انتقال :

نحوه ورود و خروج عناصر به صحنه‌ها را تعریف می‌کند. قانون مهم این است که انتقال‌ها باید ظریف باقی بمانند و از تغییرات بصری ناگهانی جلوگیری کنند. در این میان باید از مواردی چون انتقال‌های چرخشی، برش‌های ناگهانی و حرکت های آشفته اجتناب نمود. در مقابل می توان گزینه هایی چون دیزالو (محو شدن) یا آشکارشدن با حرکت های نرم دیزاین شده در راستای هویت برند را در نظر داشت.

ریتم حرکت:

وزن و فیزیک حرکت:

ریتم، نحوه جریان توالی‌های حرکتی را در طول زمان تعریف می‌کند. بدین معنی که حرکت ها می باید شامل مکث‌های ظریف برای حفظ تعادل بصری باشند. دو موضوع از مهمترین ملاحظات ریتم به شمار می روند : مکث بین حرکت ها و انتقال‌های هماهنگ.

احساس فیزیکی حرکت را تعریف می‌کند. به عنوان مثال اشیاء باید قبل از توقف کند شوند و یا حرکت باید از توقف‌های ناگهانی اجتناب کند. در این میان پارامترهایی همانند اینرسی، شبیه‌سازی جاذبه، مقاومت و الاستیسیته مهم به شمار می روند.

2 - حرکات انتقالی

انتقال صفحه :

انتقال صفحه، نحوه تغییر کل صفحه یا صفحات را تعریف می‌کند. در تعریفی دیگر آنها به حفظ تداوم بصری بین مراحل ناوبری کمک می‌کنند. از معمول ترین تکنیک های انتقال می توان به fade شدن صفحه، اسلاید شدن از یک جهت خاص و یا استفاده از ماسک اشاره کرد. قوانین معمول در این راستا و برای برندی نظیر هاکوپیان چنین است: انتقال‌ها باید روان و ظریف به نظر برسند. از جلوه‌های بیش از حد چشمگیر خودداری شود. و مهمترین نکته : انتقال‌ها نباید ناوبری را به تاخیر بیندازند. بدین معنا که حرکت های انتقالی هرگز نباید توانایی کاربر را برای رسیدن به صفحه یا محتوای بعدی کند کنند؛ به عبارت دیگر، رابط کاربری باید فوراً به عملکرد کاربر پاسخ دهد و حرکت فقط باید تغییر بصری را روان کند، نه اینکه آن را مسدود کند. از معمول ترین تایم بندی ها در این مورد می توان به ۳۰۰-۵۰۰ میلی‌ثانیه اشاره کرد.

این بخش نحوه حرکت، ظاهر شدن و پاسخ عناصر رابط کاربری به اقدامات کاربر را تعریف می‌کند. این قوانین تضمین می‌کنند که حرکت در وب‌سایت‌ها، برنامه‌ها و پلتفرم‌های دیجیتال به طور مداوم با زبان حرکتی برند رفتار کند.

پله های اجرایی :

نحوه برخورد مخاطب با لایه های بصری در فضای انیمیشن و موشن گرافیک به صورت سکانسی و نه به صورت همزمان( simultaneously )می باید انجام و در نظر گرفته شود. در این صورت میزان خوانش پذیری و فضای دیداری لایه های تصویری به حداکثر رسیده و توجه لازم برای مخاطب را فراهم می کند.

انتقال کامپوننت:

انتقال‌های کامپوننت نحوه نمایش یا تغییر حالت عناصر رابط کاربری را تعریف می‌کنند. اصول کلی حاکم بر انتقال صفحات تا حد قابل توجهی بر انتقال کامپوننت ها نیز صادق است ( حفظ تداوم بصری – عدم مسدود شدن فضای بصری )؛ ضمن اینکه این گزینه نیز حائز اهمیت است که کامپوننت ها باید با شفافیت، وضوح و انتقال موقعیت های ظریف متحرک شوند. در واقع انتقال کامپوننت ها باید : توجه را هدایت کنند. سلسله مراتب را روشن کنند. و از گیج کردن کاربر خودداری کنند. باز شدن منوها، لیست ها و منوهای کشویی مثال هایی از کامپوننت ها هستند.

تعاملات دکمه ها :

دکمه‌ها رایج‌ترین عناصر تعاملی هستند و همینطور پرکاربردترین. اصول تعامل برای این عنصر بصری می تواند گزینه های زیر را شامل شود: بازخورد باید فوری باشد. حرکت باید کوتاه و ظریف باشد. تعاملات باید پاسخگو باشند. همچنین حرکت فشردن دکمه ترجیحا باید در بازه زمانی ۱۵۰ تا ۲۰۰ میلی‌ثانیه رخ دهد.

رفتارهایی که می توان برای حالت های مختلف در نظر داشت: حالت : Hover - رفتار : تغییر جزئی رنگ یا ارتفاع حالت : Press - رفتار : کاهش سریع مقیاس ( ابعاد) حالت : Loading - رفتار : به صورت چرخشی یا نشانگر پیشرفت

فیدبک ( بازخورد) :

ارائه بازخورد شفاف و واضح طی فیدبک از ضروریات حوزه موشن می باشد. به عنوان مثال :

• فرم های عضویت : خط راهنمای لودینگ
• آپلود فایل : نحوه پیشرفت آپلودینگ

تعاملات فرم:

فرم‌ها نیز برای برقراری ارتباط با بازخورد سیستم به حرکت نیاز دارند. اصل کلیدی در این خصوص این است که حرکت باید به کاربران در درک پاسخ‌های سیستم کمک کند؛ به این معنا که کاربر در تعامل با فرم می باید از طریق حرکت های موجود فیدبک قابل انتظار داشته باشد. برخی از نمونه ها می توانند اینطور بیان شوند: اعلان وضعیت خطا در فرم : - ایجاد لرزش یا تغییر رنگ حالت تایپینگ در فرم : - فیدبک مکان نما اعلان وضعیت موفق در فرم : - تصحیح رنگ دکمه بر اساس رنگ های سمانتیک

3 - لوگو موشن

اینترو :

نحوه نمایش اولیه لوگو در محیط‌های متحرک را تعریف می‌کند، بنابراین محدوده مدت زمان در اینجا اهمیت پیدا می کند. پارامتر زمانی معمول، مناسب و در خور در این مورد می تواند گزینه های ذیل باشد: رسانه‌های اجتماعی: 0.8-1.5 ثانیه مقدمه وب‌سایت: 1-2 ثانیه برندسازی ویدیویی: 1.5-2.5 ثانیه آیتم بعدی که پس از اینترو مطرح می شود موضوع جهت حرکت است. اینکه لوگو در مرحله اینترو به چه صورت و از کدام جهت می باید حضور پیدا کند. گزینه هایی چون حرکت افقی، محوریت حضور بر مبنای دیزالو، گسترش مرکزی و یا بالا به پایین از نمونه های این موضوع هستند. اما آنچه که می تواند برای برند هاکوپیان مناسب باشد تکنیک دیزالو به همراه حرکت افقی است. با این احتساب شتاب حرکت قابل کنترل بوده و شروع نرم برای حضور برند معنا پیدا می کند؛ به عبارتی حضور پالایش شده می تواند مورد توجه قرار گیرد.

لوگو موشن در ویدیو، رابط‌های دیجیتال، تبلیغات و رسانه‌های اجتماعی حضور موثر دارد. بنابراین می باید الزامات مربوط به آن نیز به صورت قاعده مند طی دستورالعمل هایی در نظر گرفته شود.

سکون :

فیلد سکون در لوگو موشن به زمانی اطلاق می گردد که لوگو برای مدت طولانی‌تری قابل مشاهده باشد.در این حالت برای حفظ جذابیت بصری و جلوگیری از حواس‌پرتی مخاطب می باید حرکات ظریف و آرامی به لوگو اعمال کرد. حرکاتی چون ضربان ظریف، حرکت تنفسی یا چرخش آهسته می تواند به کار گرفته شود.

در خصوص برند هاکوپیان حرکات ظریفی چون حرکات نبض گونه یا اعمال استروک های بسیار ظریف در محیط کلی لوگو و یا حرکاتی از این دست که ظرافت موضوع را پایدار نگاه دارند پیشنهاد می شود.

اوترو :

نحوه خروج لوگو از قاب را تعریف می‌کند. از آنجا که پایان لوگو باید منطق حرکت مقدمه را منعکس کند بنابراین مصداق های تکنیکال در حوزه اینترو در این آیتم نیز کاربردپذیر است. تنها نکته مورد توجه در اوترو این است که مدت زمان خروج معمولا کمی کوتاه تر از اینترو در نظر گرفته می شود.

محدودیت ها :

مطمئنا می باید در مورد برند هاکوپیان از یک سری از حرکات پرهیز کرد. نمونه مواردی که می باید از آنها اجتناب کرد عبارتند از : چرخش/کج کردن - کشش/اعوجاج - تناژ غیرحرفه‌ای - انتقال فضای منفی به عبارتی لوگو هرگز نباید در طول حضور خود بچرخد، اعوجاج پیدا کند یا کشیده شود.

قواعد ساخت :

ساخت لوگو موشن باید از ساختار هندسی لوگو پیروی کند. این موضوع به حفظ ارتباطات بصری و هماهنگی آنها تکیه دارد. همچنین هیچ آیتم و عنصر بصری دیگر نمی تواند وارد فضای ساخت لوگو گردد، این موضوع از درهم‌ریختگی حرکت جلوگیری می‌کند. نکته مهم دیگر در این راستا مقیاس حرکتی است؛ تعیین مقیاس حرکت و تعریف درست آن در طراحی لوگو موشن از حرکات و جلوه های اغراق آمیز جلوگیری می کند. در نهایت آنچه که باید به آن توجه کرد حفظ استانداردهای ساخت می باشد؛ به عنوان مثال نرخ فریم: 24 یا 30 فریم در ثانیه می باید در خروجی نهایی به منظور تطابق با زیرساخت ها در نظر گرفته شود و همینطور دیگر پارامترهای تکنیکال: به عنوان مثال ارائه درست از فرمت MP4 یا دیگر فرمت های لازم برای مدیاهای متنوع.

تطبیق رفتار :

بدین معنی که لوگو موشن می باید حرکت تطبیقی در پلتفرم های مختلف داشته باشد، به عنوان مثال در شبکه های اجتماعی می باید هویتfaster introداشته ولی در ارائه ها slower reveal باشد. همچنین نکاتی چون انیمیشن‌های موبایل باید ۲۰٪ سریع‌تر از انیمیشن‌های دسکتاپ باشند نیز می باید مورد توجه قرار گیرند.

4 - قواعد صدا

شخصیت صوتی برند :

شخصیت صوتی برند بر اساس ماتریس محصول پارامترهای ذیل را باید دارا باشد:

• شاخه Essential : مینیمال، نرم و کاربردی
• شاخه Elevated : کنترل شده، واضح و بالانس شده
• شاخه Prestige: غنی، عمیق و سینماتیک
• شاخه Maison: هنری، کانسپچوال

این بخش پارامترهای مربوط به sound و اتمسفر و فضا ی صدا را ارائه می دهد. این استانداردها طیفی از موارد را شامل می شود که در ادامه به آنها می پردازیم:

تعریف کلان : در واقع صدا لایه هویتی غیرآشکار محسوب می شود. این لایه هویتی باید پالایش شده، سمت و سوی مردانگی و در نهایت جاودانگی را نیز در نهان خود داشته باشد.

موسیقی :

سبک های موسیقی در برند هاکوپیان می باید و می توانند در فضاهای زیر حضور داشته باشند :

• نئوکلاسیک : ( پیانو)
• مینیمال الکترونیک ( تمپو در سطح زیرین )
• Ambient

در عین حال می باید از موارد زیر اجتناب کرد :

• Pop commercial
• Beats سنگین و تند

لوگو موشن (sound) :

اصلی ترین هدف از ارائه صدا بر روی لوگو موشن : تشخیص بدون نویز و هماهنگی ریتمیک حرکت با صدای در نظر گرفته شده است.

ویژگی‌ها: • Duration: 2–1 seconds • Tone:

• low frequency
• warm • پایان با:
• subtle tone

ساند افکت:

ساندافکت ها نیز مشتمل بر حد و مرزهایی هستند:

باید: • Subtle • Material-based • Short and precise مثال: • پارچه soft fabric movement • کلیک muted click نباید: • cartoonish • exaggerated • loud