شروع با Timeline و Symbols
Graphic، Movie Clip و Classic Tween.
قدم اول: رابط Animate و ساخت سند جدید
Adobe Animate را باز کنید و از منوی File گزینه New را انتخاب کنید. برای شروع، ActionScript 3.0 یا HTML5 Canvas هر دو مناسباند؛ اما اگر هدف شما انتشار در وب است، HTML5 Canvas انعطاف export بهتری دارد و با workflow مدرن Nova Lab همراستاتر است. در پنجره New Document، Width را ۱۹۲۰ و Height را ۱۰۸۰ تنظیم کنید و Frame Rate را روی ۲۴ fps بگذارید — این ترکیب استاندارد فیلم و انیمیشن ۲D است و بعداً در export ویدیو هم مشکلی ایجاد نمیکند.
رابط کاربری Animate سه ناحیه اصلی دارد: Stage در مرکز صفحه جایی است که شکلها را میکشید و انیمیشن را میبینید؛ Timeline در پایین صفحه فریمها و لایهها را نشان میدهد؛ و Library در سمت راست symbols ذخیرهشده را نگه میدارد. Tools Panel در چپ شامل Selection، Brush، Rectangle و Text است. اگر چیدمان بههمریخته به نظر میرسد، از Window > Workspace > Essentials استفاده کنید تا layout استاندارد برگردد.
در Timeline، Layer 1 را به background تغییر نام دهید — naming لایهها از همان ابتدا عادت خوبی است. با دکمه Insert Layer یک لایه جدید به نام object اضافه کنید. هر لایه timeline مستقل خودش را دارد؛ یعنی میتوانید background ثابت بماند در حالی که object حرکت میکند. برای انیمیشنهای پیچیدهتر، سازماندهی لایهها (مثلاً foreground، character، background) تفاوت بین پروژه منظم و آشفته را مشخص میکند.
برای دید دقیقتر، با Ctrl+scroll یا از منوی View > Magnification زوم کنید. Rulers و Grid را از View menu فعال کنید تا alignment دقیقتر شود — مخصوصاً وقتی objectها باید روی خط مشخصی قرار بگیرند. Properties panel (معمولاً سمت راست) وقتی object انتخاب است، رنگ، stroke و موقعیت را نشان میدهد؛ با آن آشنا شوید چون در tween و symbol کار زیادی با آن دارید.
قبل از رسم اولین شکل، یک بار File > Save As بزنید و فایل را با پسوند .fla ذخیره کنید. فایل .fla منبع اصلی پروژه است و هر export بعدی از همین فایل ساخته میشود. در مسیر Adobe Animate Nova Lab، عادت «اول save، بعد animate» از دست دادن کار جلوگیری میکند.
قدم دوم: رسم شکل و تبدیل به Symbol
در لایه object، Oval Tool را انتخاب کنید و یک دایره روی Stage بکشید. در Properties، Fill یک رنگ زنده (مثلاً نارنجی) و Stroke را None یا بدون خط قرار دهید. Object Drawing mode را خاموش بگذارید تا shapes با هم merge شوند — این رفتار طبیعی vector در Animate است و برای beginner سادهتر است.
دایره را با Selection Tool انتخاب کنید و کلید F8 را بزنید (یا Modify > Convert to Symbol). در پنجره Convert to Symbol، نوع Graphic Symbol را انتخاب کنید و نام Ball بگذارید. Registration point را در مرکز (center) نگه دارید — pivot وسط برای حرکت و چرخش طبیعیتر است.
سه نوع symbol اصلی در Animate وجود دارد: Graphic Symbol برای انیمیشن ساده روی timeline اصلی و preview مستقیم؛ Movie Clip برای instance مستقل با timeline داخلی که میتواند loop کند یا nested animation داشته باشد؛ و Button برای حالتهای up، over و down در رابط interactive. در این آموزش با Graphic شروع میکنیم و در قدم بعد Movie Clip را مقایسه میکنیم.
بعد از Convert، symbol در Library ظاهر میشود — آیکون مربعی با نام Ball. اگر symbol را از Library به Stage بکشید، instance جدید ساخته میشود. تغییر در یک instance روی بقیه اثر نمیگذارد مگر اینکه داخل تعریف symbol (با double-click) edit کنید — آن وقت همه instanceها بهروز میشوند.
برای ورود به timeline داخلی symbol، روی instance در Stage double-click کنید. نوار بالای Stage نشان میدهد Scene 1 > Ball — یعنی داخل symbol هستید. با کلیک روی Scene 1 به timeline اصلی برمیگردید. این navigation بین scene و symbol پایه کار با nested animation است.
قدم سوم: Classic Tween روی Timeline
Ball را در فریم ۱ Stage سمت چپ قرار دهید. در timeline، فریم ۳۰ را انتخاب کنید و F6 بزنید (Insert Keyframe) — یک keyframe جدید با همان Ball ساخته میشود. در فریم ۳۰، Ball را به سمت راست Stage ببرید. Animate فقط موقعیت start و end را میداند؛ tween فاصله بین آنها را interpolate میکند.
بین فریم ۱ و ۳۰ در timeline کلیک کنید (نه روی keyframe، روی فضای خاکستری) و Right-click > Create Classic Tween بزنید. خط آبی با فلش روی timeline نشان میدهد tween فعال است. Ctrl+Enter (Test Movie) preview را اجرا میکند — Ball باید از چپ به راست حرکت کند.
اگر حرکت linear و robotic به نظر میرسد، فریم tween را انتخاب کنید و در Properties panel مقدار Ease را تنظیم کنید. Ease In یعنی شروع آهسته و سرعت گرفتن؛ Ease Out یعنی توقف نرم. برای حرکت طبیعیتر، Ease In/Out ترکیب کنید. Motion Guide برای مسیر منحنی: یک لایه guide با خط منحنی بسازید، object را snap to guide کنید و tween روی guide اجرا میشود.
Shape Tween نوع دیگری است که بین دو shape در keyframeهای متوالی morphing میسازد — مثلاً دایره به مربع. Shape Tween فقط روی همان لایه و با shapes ساده (بدون symbol) کار میکند. برای پروژههای character و object معمولاً Classic یا Motion Tween کافی است؛ Shape Tween برای افکتهای morphing و transition خلاقانه به کار میآید.
تفاوت Motion Tween (جدیدتر) با Classic Tween: Motion Tween object-based است و path قابل edit در Stage دارد؛ Classic Tween legacy است اما در tutorials و پروژههای قدیمی زیاد دیده میشود. در یک پروژه یکی را انتخاب کنید و ثابت نگه دارید — مخلوط کردن هر دو گاهی confusion ایجاد میکند.
قدم چهارم: Movie Clip و timeline تو در تو
Ball Graphic را انتخاب کنید و در Properties panel روی Swap یا از Library نسخه Movie Clip بسازید — یا Ball را Convert to Symbol با نوع Movie Clip کنید. تفاوت اصلی: Movie Clip timeline داخلی مستقل دارد که حتی وقتی timeline اصلی متوقف است میتواند animate شود.
روی Ball Movie Clip double-click کنید تا وارد timeline داخلی شوید. در فریم ۱ scale کوچک (مثلاً ۵۰٪) و در فریم ۱۵ scale بزرگ (۱۰۰٪) بگذارید؛ بین آنها Classic Tween scale. Back به Scene 1: Ball روی Stage با Motion Tween حرکت میکند و همزمان داخلش pulse (بزرگ-کوچک) میزند — این قدرت nested animation با Movie Clip است.
یک لایه چشم داخل Ball MC اضافه کنید: دو بیضی سفید و سیاه برای چشم. blink را با ۲ فریم keyframe بسازید — فریم ۱ چشم باز، فریم ۲ چشم بسته، فریم ۳ باز. blink در loop داخل MC اجرا میشود بدون اینکه timeline اصلی را شلوغ کند.
Label فریم برای organization مفید است: Right-click روی frame > Label و نام bounceStart بگذارید. Labelها در ActionScript یا برای هماهنگی تیم reference هستند. حتی بدون code، label کردن key poseها (مثلاً contact، peak، land) workflow را readable میکند.
Graphic Symbol وقتی timeline اصلی loop میشود، با scene sync میماند — یعنی اگر scene ۶۰ فریم loop کند، Graphic هم reset میشود. Movie Clip timeline خودش را دارد و میتواند ۱۵ فریم loop کند در حالی که scene ۶۰ فریم است. برای UI animation، loading spinner، یا character idle، Movie Clip انتخاب درستتر است.
قدم پنجم: Onion Skin و timing
Onion Skin دکمهای زیر timeline است — با فعال کردنش ghost فریمهای قبل و بعد را روی Stage نشان میدهد. Onion Skin Outlines فقط خطوط contour را میکشد، نه fill — برای spacing دستی و pose-to-pose عالی است. وقتی keyframe جدید میگذارید، ghost قبلی کمک میکند فاصله حرکت (spacing) را ببینید.
Frame Rate ۲۴ fps یعنی ۲۴ فریم برابر یک ثانیه.real time. انیمیشن snappy با keyframe کمتر و spacing بزرگتر؛ smooth با فریم بیشتر و spacing کوچکتر. Pose-to-pose workflow: key pose در فریم ۱، ۱۵ و ۳۰ بگذارید، بعد breakdown بین آنها. این روش استاندارد animatorهای حرفهای است.
Hold یعنی duplicate keyframe بدون تغییر — object ثابت میماند چند فریم. ۲ تا ۳ فریم hold قبل از حرکت بزرگ، anticipation میدهد: audience آماده میشود چیزی اتفاق بیفتد. بدون hold، همه چیز یکنواخت و ماشینی به نظر میرسد.
Work Area با drag نوار بالای timeline تنظیم میشود — preview فقط همان بخش اجرا میشود. برای loop test یک segment کوتاه، Work Area سریعتر از play کل timeline است. Combined با Onion Skin، میتوانید یک walk cycle ۸ فریمی را frame-by-frame polish کنید.
اصول timing از physics ساده شروع میشود: object سنگینتر = ease in/out بیشتر؛ object سبک = حرکت تندتر. در تمرین Nova Lab، Ball drop را یک بار linear و یک بار با Ease In heavy animate کنید — تفاوت «سقوط واقعی» و «سقوط robotic» را حس خواهید کرد.
قدم ششم: ذخیره و export اولیه
File > Save As و فایل .fla را با نام مشخص (مثلاً lesson01_ball.fla) ذخیره کنید. همیشه source .fla را نگه دارید — exportها replaceable هستند، .fla منبع irreversible است. Test Movie با Ctrl+Enter SWF یا HTML preview را اجرا میکند بسته به document type.
Publish Settings از File > Publish Settings: برای وب HTML5 Canvas، برای ویدیو QuickTime یا Media Encoder workflow. Responsive scaling در HTML5 به animation اجازه میدهد viewport مختلف را پر کند — در آموزش export وب و ویدیو جزئیات بیشتر میآید.
Library cleanup: unused symbols و bitmaps را Delete کنید. Folder در Library بسازید (مثلاً Characters، Backgrounds، UI) تا symbols سازماندهی شوند. پروژه تمیز = export کوچکتر و همکاری تیمی راحتتر.
قبل از بستن، checklist کوتاه: timeline loop seamless است؟ symbol naming consistent است؟ frame rate ۲۴ ثابت است؟ Ball Movie Clip با timeline داخلی pulse را ذخیره کنید — در آموزش بعد character animation با rig ساده از همین مفاهیم symbol و nested timeline استفاده میکنیم.
تمرین پایانی Nova Lab: یک مربع Graphic با tween position بسازید، سپس همان shape را Movie Clip با rotation داخلی کنید و هر دو را در scene مقایسه کنید. در notebook کوتاه بنویسید Graphic برای چه موقعیتی و Movie Clip برای چه موقعیتی مناسبتر است — این تفاوت پایه تمام پروژههای Animate است.
سوالات متداول
Graphic یا Movie Clip؟
Graphic برای انیمیشن sync با timeline اصلی و preview مستقیم روی stage — مثلاً background element که با scene شروع و تمام میشود. Movie Clip برای loop مستقل، nested animation، و کنترل با ActionScript — مثلاً loading icon، character idle، یا button state. انتخاب بسته به نیاز: sync با scene یا independence.
Classic Tween یا Motion Tween؟
Motion Tween (Animate CC جدید) object-based است و motion path را در Stage edit میکنید. Classic Tween legacy است اما در tutorials و فایلهای قدیمی زیاد است. هر دو معتبر؛ در یک پروژه یکی را ثابت نگه دارید. برای beginner، Classic Tween با keyframe start/end سادهتر شروع است.
چند fps انتخاب کنم؟
۲۴ fps برای film feel و cinematic animation؛ ۳۰ fps برای TV و web روانتر؛ ۱۲ fps برای stylized محدود (مثل motion comic). consistency در کل پروژه مهم است — fps را وسط کار عوض نکنید مگر deliberate artistic choice.
Symbol edit روی همه instance اثر دارد؟
بله. تغییر داخل symbol definition (double-click و edit) همه instanceها را بهروز میکند. برای override روی یک instance تکی از Properties > Color Effect، filter، یا transform جداگانه استفاده کنید. اگر فقط یک instance را permanently متفاوت میخوید، Break Apart (Ctrl+B) symbol را به shape برمیگرداند.