logo designMay 3, 202615 min read

راهنمای انیمیشن لوگو: کی حرکت کنیم، چطور حرکت کنیم و چه چیزی را حذف کنیم

راهنمایی کاربردی برای انیمیشن لوگو. چهار حالت حرکتی که هر برند لازم دارد، شش الگوی انیمیشنی که در هر اندازه‌ای دوام می‌آورند، و بریفی که یک لوگوی متحرک قابل استفاده را در دو دور تحویل می‌دهد، نه هفت دور.

By Boone
XLinkedIn
logo animation guide

راهنمای انیمیشن لوگو: کی حرکت کنیم، چطور حرکت کنیم و چه چیزی را حذف کنیم

لوگوی متحرک زیرساخت است، نه سرگرمی

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

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

چهار حالت حرکتی که هر برند لازم دارد

لودر، اینترو، لوپ و ترنزیشن. بیشتر لوگوهای متحرک یکی از این چهارتا هستند و برندهایی که به‌جای یک کلیپ قهرمان یک سیستم تحویل می‌دهند، هر چهار را با یک زبان حرکتی پوشش می‌دهند.

حالتمدتکاربردلوپ؟
لودر۱ تا ۲ ثانیهحالت‌های بارگذاری اپ، نشانگرهای پیشرفتبله
اینترو۲ تا ۴ ثانیهشروع ویدیو، سکانس‌های عرضه محصولخیر
لوپنامحدودپس‌زمینه وب، حضور محیطی برندبله
ترنزیشن۰.۵ تا ۱.۵ ثانیهبین صحنه‌ها، بین حالت‌های محصولبسته به شرایط

هر حالت بودجه زمانی و محیط رندر خودش را دارد. لودری که داخل یک اپ React اجرا می‌شود باید آماده Lottie و سبک باشد. اینترویی که ویدیوی عرضه محصول را باز می‌کند می‌تواند کمی نمایش داشته باشد. تعریف این چهار حالت قبل از شروع هر انیمیشن راهی است که شما را از آن کار سینمایی ۱۲ ثانیه‌ای که کسی نخواسته بود نجات می‌دهد.

تصویرسازی وکسلی از چهار حالت انیمیشن لوگو، یعنی لودر، اینترو، لوپ و ترنزیشن، به‌عنوان بسترهای حرکتی متمایزی که یک سیستم برند باید پوشش دهد
تصویرسازی وکسلی از چهار حالت انیمیشن لوگو، یعنی لودر، اینترو، لوپ و ترنزیشن، به‌عنوان بسترهای حرکتی متمایزی که یک سیستم برند باید پوشش دهد

لودرها اسب‌های کار هستند

لودر انیمیشنی است که کاربران بیشتر از همه می‌بینند و باید کوتاه، لوپ‌شونده و ارزان برای رندر باشد، چون داخل اپی تحویل می‌شود که مشکلات بزرگ‌تری از برند شما دارد. نشان متحرک Stripe مرجع کلاسیک است: هندسه ساده، لوپ زیر دو ثانیه، قابل‌استفاده در ۲۴ پیکسل. هیچ‌کس در Stripe نمی‌خواهد با آن جایزه ببرد. فقط کار می‌کند.

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

زیر ۲ ثانیه نگهش دارید. فایل Lottie را زیر ۵۰ کیلوبایت نگه دارید. قبل از تست در هر اندازه بزرگ‌تر، آن را در ۲۴ و ۴۸ پیکسل تست کنید.

اینترو نسخه سینمایی است و باید کم استفاده شود

اینترو همان شروع سه‌ثانیه‌ای است که روی ویدیوها و عرضه محصول می‌گذارید و تنها جایی است که کمی تئاتر مجاز است. استینگر اینترو Apple Music مرجع خوبی است: مطمئن، هم‌زمان با یک لحظه صوتی و تمام‌شده پیش از آنکه متوجه شروعش شوید.

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

لوپ‌ها برند محیطی هستند

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

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

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

ترنزیشن‌ها بافت پیوندی هستند

انیمیشن ترنزیشن لوگو را بین حالت‌ها، صحنه‌ها یا محصولات جابه‌جا می‌کند و قوی‌ترین سیستم‌های حرکتی همین‌جا زندگی می‌کنند. ساخت مثلث Vercel و اینترو Loom نزدیک به ترنزیشن‌اند: یک لحظه هویتی را بدون برش سخت به یک لحظه محتوایی وصل می‌کنند.

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

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

شش الگوی انیمیشن که در هر اندازه‌ای دوام می‌آورند

Reveal، draw، mask، rig، particle و build. هر لوگوی متحرکی که امروز تحویل می‌شود ترکیبی از همین شش الگوست و بیشتر پروژه‌ها فقط دو یا سه‌تایشان را لازم دارند.

الگومناسب برایشکست می‌خورد رویپیچیدگی
Revealهر نشانیهیچ‌چیز؛ الگوی همگانی استکم
Drawهندسه خطی، نشان‌های آیکونیوردمارک‌های توپرکم تا متوسط
Maskوردمارک‌ها، نشان‌های پیچیدهآیکون‌های ساده تک‌عنصریمتوسط
Rigنشان‌های شخصیتی، لوگوهای چندقسمتینشان‌های هندسی تخت و سادهزیاد
Particleلحظه‌های پریمیوم برند، اینتروهای صفحه بزرگاندازه‌های کوچک، لودرهازیاد
Buildلوگوهای چندعنصری، نشان‌های چیده‌شدهنشان‌های تک‌عنصریمتوسط تا زیاد

الگو را بر اساس هندسه نشان انتخاب کنید، نه بر اساس چیزی که در پورتفولیو چشمگیر به نظر می‌رسد. یک انیمیشن draw روی وردمارک توپر شبیه خطای رندر است. یک rig روی یک نشان هندسی تخت سه برابر چیزی که نتیجه‌اش ارزش دارد هزینه دارد.

تصویرسازی وکسلی از شش الگوی انیمیشن لوگو، یعنی reveal، draw، mask، rig، particle و build، به‌صورت نگاشت‌شده بر اساس پیچیدگی و کاربرد
تصویرسازی وکسلی از شش الگوی انیمیشن لوگو، یعنی reveal، draw، mask، rig، particle و build، به‌صورت نگاشت‌شده بر اساس پیچیدگی و کاربرد

انیمیشن‌های Reveal ورودشان را حق خودشان می‌کنند

Reveal ساده‌ترین الگوست: لوگو وارد می‌شود و می‌نشیند و تمام هنر در منحنی ایزینگ و لحظه توقف است. Reveal اسلک مرجع محکمی است. نشان با یک منحنی ease-out که عمدی به نظر می‌رسد و نه پیش‌فرض، محو و بزرگ می‌شود و سر جایش می‌نشیند. در هر اندازه و هر بستری کار می‌کند و تقریباً هیچ هزینه‌ای ندارد.

شکل شکست reveal استفاده از ایزینگ خطی یا ease پیش‌فرض است. منحنی‌های ease پیش‌فرض مکانیکی حس می‌شوند. یک ease-out سفارشی با کمی overshoot ملایم زنده به نظر می‌رسد. تفاوتش دو نقطه کنترلی Bezier است و تفاوت بین reveal‌ای که طراحی‌شده حس می‌شود و reveal‌ای که از یک قالب اکسپورت شده.

انیمیشن‌های Draw ساختار را نشان می‌دهند

انیمیشن draw خطوط لوگو را پشت سر هم دنبال می‌کند و برای نشان‌هایی با هندسه خطی قوی جواب می‌دهد و روی وردمارک‌های توپر می‌میرد. این الگو نشان می‌دهد نشان چطور ساخته شده و این فقط وقتی کار می‌کند که نشان از خطوطی ساخته شده باشد که ارزش نشان دادن دارند.

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

قبل از بریف انیمیشن draw بررسی کنید که نشان شما استروک زنده دارد یا روی شکل‌های پر ساخته شده. شکل‌های پر را می‌شود با روکش استروک شبیه‌سازی کرد، اما نتیجه معمولاً جعلی به نظر می‌رسد. اگر نشان تماماً پر است، به‌جایش از mask استفاده کنید.

انیمیشن‌های Mask حرکت تحریریه‌ای هستند

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

انیمیشن‌های mask مستقل از فرمت‌اند. در Lottie، WebM و ویدیو به یک اندازه خوب کار می‌کنند، چون پیچیدگی در مسیر شکل mask است، نه در ساختار وکتور نشان. این آن‌ها را قابل‌حمل‌ترین الگو در تولید می‌کند.

شکل شکست، پاک‌کردن کند است. maskای که نشان را در بیش از یک ثانیه آشکار کند شبیه ترنزیشن اسلاید است. دریچه را سریع نگه دارید و بیشتر بودجه شخصیت را به ایزینگ بدهید.

Rig، Particle و Build الگوهای سنگین هستند

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

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

بودجه الگوهای سنگین را فقط وقتی بگذارید که لودر و reveal کار می‌کنند. آن دو ۹۰ درصد کاربرد تولیدی را پوشش می‌دهند. الگوهای سنگین لایه روی کارند، نه پایه.


موشن آی‌دی می‌خواهید که به‌جای یک کلیپ قهرمان، به‌صورت یک سیستم تحویل شود؟ Brainy را استخدام کنید تا یک سیستم لوگوی متحرک طراحی کند که با Lottie، WebM و MP4 اجرا می‌شود، با لنگر فریم ثابت و راهنمای تمپویی که هنرمندان حرکت واقعاً بتوانند دنبالش کنند.


فریم ثابت مهم‌ترین فریم است

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

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

فریم ثابت را قبل از انیمیشن طراحی کنید. انیمیشن باید به آن فریم برسد، نه این‌که اتفاقی روی آن تمام شود. هر لوپ باید از آن شروع و روی آن تمام شود. هر reveal باید روی آن بنشیند. هر اینترو باید روی آن ببندد.

تمپو، ایزینگ و طول سه دکمه‌اند

تمپو، ایزینگ و طول تعیین می‌کنند که انیمیشن شبیه یک برند حس شود یا یک دمو. بیشتر لوگوهای متحرک بد به این دلیل بدند که یکی از این سه خراب است.

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

ایزینگ منحنی شتاب است. ease پیش‌فرض جواب تنبلانه است. برندی که با ease-out سفارشی حرکت کند طراحی‌شده حس می‌شود. برندی که با spring ease حرکت کند بازیگوش. ایزینگ را با شخصیت برند همان‌طور هماهنگ کنید که تایپ‌فیس را با صدای برند هماهنگ می‌کنید.

طول سخت‌ترین دکمه برای درست‌کردن است، چون همه زمان بیشتر می‌خواهند. لودرها: زیر ۲ ثانیه. Revealها: زیر ۱.۵ ثانیه. اینتروها: زیر ۳ ثانیه. ترنزیشن‌ها: زیر ۱ ثانیه. اگر انیمیشن برای رساندن چیزی بیش از این زمان لازم دارد، نشان خودش به‌اندازه کافی کار نمی‌کند.

فرمت و تحویل تعیین می‌کنند کجا می‌شود منتشرش کرد

لوگوی متحرکی که فقط با MP4 تحویل شود نیمه‌کاره است. خروجی‌های مهم Lottie، WebM، MP4 و فریم قهرمان ثابت به‌شکل PNG شفاف هستند.

فرمتکاربردمزایامعایب
Lottie (JSON)اپ، وب، تعاملیفایل کوچک، مقیاس‌پذیر، قابل برنامه‌نویسینیاز به پایپ‌لاین After Effects
WebMویدیوی وب، پخش خودکار مرورگرپس‌زمینه شفاف، پشتیبانی گستردهضعف در Safari های قدیمی
MP4تولید ویدیو، شبکه‌های اجتماعیسازگاری همگانیبدون شفافیت، فایل‌های بزرگ‌تر
SVG + CSSانیمیشن‌های ساده وبکد خالص، بدون دارایی باینریمحدود به ویژگی‌های قابل انیمیت با CSS
GIFایمیل، Slack، بسترهای قدیمیفال‌بک همگانیکیفیت پایین، فایل بزرگ، بدون آلفا

فریم قهرمان ثابت باید یک PNG شفاف در 2x باشد. این همان فال‌بکی است که هر مهندسی وقتی انیمیشن بارگذاری نمی‌شود سراغش می‌رود و اگر در بسته تحویل نباشد، از روی ویدیو اسکرین‌شات گرفته می‌شود و به‌صورت JPEG فشرده می‌افتد. نگذارید این اتفاق بیفتد.

بریف حرکت یک‌صفحه‌ای

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


بریف حرکت: انیمیشن لوگوی [نام برند]

فیلدورودی
نام برند
فایل لوگوی ثابت(لینک به وکتور نهایی، همه نسخه‌ها)
حالت‌های موردنیازLoader / Intro / Loop / Transition
الگوی ترجیحیReveal / Draw / Mask / Rig / Particle / Build
حداکثر طول: لودر__ ثانیه
حداکثر طول: اینترو__ ثانیه
حداکثر طول: لوپ__ ثانیه
حداکثر طول: ترنزیشن__ ثانیه
شخصیت تمپوسریع / متوسط / کند + برند مرجع
شخصیت ایزینگمکانیکی / نرم / فنری / سفارشی + کلیپ مرجع
توصیف فریم ثابت(لوگو در سکون کامل چطور باید به نظر برسد)
حالت‌های رنگی موردنیازروشن / تیره / تک‌رنگ / هر سه
فرمت‌های تحویل موردنیازLottie / WebM / MP4 / GIF / SVG+CSS / Still PNG
اندازه‌های بوم موردنیاز(مثلاً 400x400 برای لودر، 1920x1080 برای اینترو)
جفت‌سازی صوتیبله / خیر + کلیپ مرجع در صورت بله
انیمیشن‌های مرجع(لینک ۲ تا ۳ کلیپ که حس را دقیق می‌گیرند)
چه چیزی نباید باشد(الگوها، سرعت‌ها یا حس‌های مشخصی که با برند جور نیستند)
دورهای بازبینی توافق‌شده2

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

سوالات متداول

یک انیمیشن لوگو باید چقدر طول بکشد؟

بستگی به حالت دارد. لودرها باید در کمتر از ۲ ثانیه لوپ شوند. Revealها باید در کمتر از ۱.۵ ثانیه بنشینند. اینتروها می‌توانند تا ۳ ثانیه باشند. ترنزیشن‌ها باید در کمتر از ۱ ثانیه تمام شوند. رایج‌ترین اشتباه بریف کردن یک طول واحد برای همه حالت‌هاست که به یک لودر ۳ ثانیه‌ای ختم می‌شود که حس یک تولید کامل می‌دهد.

آیا فایل Lottie لازم دارم یا MP4 کافی است؟

هر دو را لازم دارید. MP4 برای تولید ویدیو و شبکه‌های اجتماعی است. Lottie برای اپ و وب است، جایی که پس‌زمینه شفاف، حجم کم فایل و کنترل برنامه‌نویسی می‌خواهید. اگر توسعه‌دهنده شما چیزی در React، Next.js یا موبایل نیتیو می‌سازد، Lottie لازم دارد. تحویل فقط MP4 نشانه این است که هنرمند حرکت قبلاً انیمیشن تولیدی تحویل نداده است.

آیا هر لوگویی را می‌شود انیمیت کرد یا اول باید بازطراحی کنم؟

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

یک لوگوی متحرک خوب چقدر هزینه دارد؟

یک لودر و reveal با Lottie به‌اضافه WebM از یک طراح حرکت ماهر: ۸۰۰ تا ۲٬۵۰۰ دلار بسته به پیچیدگی و دورها. یک سیستم کامل چهارحالته با همه فرمت‌ها و راهنمای تمپو: ۳٬۰۰۰ تا ۸٬۰۰۰ دلار. هر چیزی که شامل rig، particle یا جفت‌سازی صوتی باشد بالاتر از این است. اگر کسی برای انیمیشن لوگو ۱۵۰ دلار قیمت می‌دهد، دارد یک قالب با رنگ‌های شما را به شما می‌فروشد.

آیا لوگوی متحرک باید با لحظه صوتی برند هم‌زمان باشد؟

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

بدون دانستن اصطلاحات حرکت، منحنی ایزینگ را چطور بریف کنم؟

کلیپ‌های مرجع سریع‌ترین راه‌اند. دو یا سه انیمیشن که حسشان درست است پیدا کنید و در بریف لینک بدهید. بعد آنچه مشترک دارند را توصیف کنید: «فنری و کمی بازیگوش»، «مکانیکی با توقف سخت»، «نرم و مطمئن». واژگان ایزینگ نادقیق است؛ کلیپ‌های مرجع نادقیق نیستند. اگر می‌خواهید دقیق شوید، از نوتیشن cubic-bezier استفاده کنید و قبل از فرستادن به هنرمند در مدت واقعی انیمیشن تستش کنید.

فایل Lottie چیست و چرا توسعه‌دهنده من آن را می‌خواهد؟

Lottie یک فرمت انیمیشن متن‌باز است که انیمیشن‌های After Effects را به‌صورت JSON کدگذاری می‌کند. فایل کوچک است (معمولاً ۵ تا ۵۰ کیلوبایت)، بدون افت کیفیت به هر رزولوشنی مقیاس می‌گیرد و می‌شود از کد کنترلش کرد: پخش، توقف و اسکراب. این استاندارد انیمیشن لوگو در اپ و وب است، چون تنها فرمتی است که شفافیت، مقیاس‌پذیری و تعامل را در یک بسته هندل می‌کند.

لوگوی متحرک به‌عنوان سیستم، نه دارایی

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

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

سیستم را بسازید. فریم ثابت را تحویل بدهید. ایزینگ را درست کنید. بقیه‌اش تولید است.


موشن آی‌دی می‌خواهید که به‌صورت یک سیستم تحویل شود؟ Brainy را استخدام کنید تا یک سیستم لوگوی متحرک ساخته‌شده برای تولید طراحی کند: Lottie، WebM، MP4، یک لنگر فریم ثابت تمیز و راهنمای تمپویی که به هنرمندان حرکت چیزی واقعی برای کار کردن بدهد.

Want a motion ID that ships as a system instead of a single hero clip? Brainy designs animated logo systems that run as Lottie, WebM, and MP4 with a still-frame anchor and a tempo guide motion artists can actually follow.

Get Started

More from Brainy Papers

Keep reading