ساختن انیمیشن دو بعدی

[ آخرین بازنگری ۳۱ مرداد ۱۳۹۰ ] [ نسخه چاپی ]

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

آموزش ساخت تصویر متحرک (انیمیشن) در فتوشاپ
نکته ی مهمی که در این درس باید حتما رعایت کنید این هست که برای هر عنصری که ایجاد میکنید باید یک لایه جدید ایجاد کنید.چون اصل ساخت انیمیشن در فتوشاپ بر پایه مخفی کردن و ظاهر کردن لایه هاست.
خوب فتوشاپ عزیز! رو صدا بزنید و یک بوم در ابعاد 200 در 200 پیکسل ایجاد کنید.
با ابتکار خودتون و با استفاده از ابزار قلمو (Brush Tool) یک آدمک ایجاد کنید (دقت کنید همونطوری که گفتم این آدمک رو در لایه جدیدی ایجاد کنید).

ساخت یک آدمک در فتوشاپ

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

از آدمک یک کپی تهیه کنید

همین روند رو برای سایر لایه ها هم انجام میدیم ( بازهم تاکید میکنم برای هر آدمک و یا هر تغییری باید یک لایه جدید ایجاد کنید).این کار رو ادامه میدیم تا جایی که تمام فریم های مورد نظر رو ایجاد کنیم.در این انیمیشن لایه های ما به صورت زیر هستند:

تمام لایه های تصویر متحرک

و تمام لایه ها هم اینطوری هستند:

تمام لایه ها انیمیشن

احتمالا این مطالب برای شما جالب هستند

طراحی بنر تبلیغاتی ساده
پر کردن نوشته با تصویر در فتوشاپ
سیاه و سفید کردن قسمتی از یک عکس
نوشتن متن به صورت موجدار در فتوشاپ
آموزش برداشتن کپی رایت عکس ( واترمارک ) در فتوشاپ
آموزش جلوه بزرگنمایی با ذره بین در فتوشاپ
تغییر رنگ قسمتی از متن با تغییر رنگ زمینه در فتوشاپ
افکت تصویر پولاروید در فتوشاپ

گفتگو پیرامون ساختن انیمیشن دو بعدی

(منتشر شده: 58 | در انتظار تایید: 0)
هادی

سلام
واقعا وبسایت عالی دارین
من میخوام بدونم چگونه میتونم انیمیشنی رو ککه درست کردم رو براتون به نمایش بگذارم تا نظر بدید در مورد
اخه اولین بارمه
در مورد اساسین / assassin درست کردم
جالب شده انگار

پاسخ دهید
عصرعلم

در پاسخ به هادی

سلام
میتونید در سایتهای آپلود، آپلود کنید و لینکش را در بخش دیدگاه ها یا در شبکه های اجتماعی بگذارید تا دوستان علاقه مند مشاهده کنند و نظر بدهند.

پاسخ دهید
زهرا

عاااااااااااااااااااااااااااااااااااااااااااالی بود.من تازه باهاتون آشنا شدم حرررررررررف ندارید

پاسخ دهید
شهلا

فتوشاپ من هم جدید هست cs6 هست، منم گزینه animation رو پیدا نمیکردم اما با خودم گفتم حتما اسمش در ورزن های جدید تغییر کرده و درست فکر کرده بودم 🙂 ،دوستان عزیز مثل سمانه جان که این مشکلو دارن ، دنبال گزینه Timelineبگردید.

پاسخ دهید
شهلا

به دوستانی که فتوشاپشون جدیده اما گزینه animation رو نداره بگم ، منم همین مشکلو داشتم ، با cs6 کار میکنم ، بجای انیمیشن گزینه Timeline رو انتخاب کنید.

پاسخ دهید
عصرعلم

در پاسخ به amir

سلام
نسخه ی فتوشاپتون چیه؟

پاسخ دهید
سمانه

فتوشاپ من جدیده و در قسمت ویندو چیزی به نام انیمیشن ننوشته من باید چی کارکنم؟؟؟؟؟؟

ممنون

پاسخ دهید
ترنج

به نظرم خيلي كامل و خوب نبود و من نتونستم انجامش بدم ولي بازم ممنون .

پاسخ دهید
قضایی

مرسی منتظر توضیحاتتون هستم
با تشکر فراوان

پاسخ دهید
الهام قضایی

با سلام و خسته نباشید
انیمیشنی که من طراحی کردم داخل محیط فتوشاپ play میکنم مشکلی نداره ولی وقتی save می کنم و play می کنم نشون نمیده ( قابل به ذکر است save طبق آموزش شما انجام دادم)

پاسخ دهید
ناشناس

سلام مرسی از آموزش خوبتون
انیمیشنی که من طراحی کردم داخل محیط فتوشاپ وقتی play می کنم مشکل نداره ولی وقتی save می کنم play می کنم 4 ثانیه اولو نشون میده

پاسخ دهید
عصرعلم

در پاسخ به ناشناس

سلام
اگر امکانش هست فایل لایه باز فتوشاپ را برای من ارسال کنید (به همراه فایل نهایی) تا بررسی کنم.
info[at]AsreElm[dot]com

پاسخ دهید
مصطفی

اشاره به نکته خوبی کردید … انیمیشن در فتوشاپ
برای سرگرمی یا درک مفهوم انیمیشن بد نیست
باید بگم فتوشاپ در قسمت time line ابزار خوبی برای شروع کار انیمیشن داره که شما میتونستید به اون هم اشاره کنید سبکی که شما گفتید یه جورایی میشه گفت دستیه و وقتی دارید با کامپیوتر طراحی میکنید باید از روش cut out استفاده کنید. به کسانی که علاقه مندن، کار با افتر افکت رو پیشنهاد میکنم که خیلی قوی تر از فتوشاپ میشه باهاش انیمیشن ساخت که یادگیریش هم سخت نیست.

پاسخ دهید
مهدی حسامی

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

پاسخ دهید
بهاره

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

پاسخ دهید
عصرعلم

در پاسخ به بهاره

شما لطف دارید، خواهش میکنم
در صورت تمایل میتونید به طور مستقیم از طریق ایمیل هم با ما در ارتباط باشید:

info[at]AsreElm.com

پاسخ دهید
بهاره

آموزش برنامه ای که معرفی کردیددر سایت هست؟ کار باهاش راحته؟

پاسخ دهید
عصرعلم

در پاسخ به بهاره

خیر متاسفانه، آموزشش رو در سایت نداریم
کار با فتوشاپ راحت تره به نسبت Illustrator

پاسخ دهید
بهاره

ممنون که سریع پاسخ دادید
ساخت لوگو رو قبلأ گفتید؟ کجای سایت هست؟!

پاسخ دهید
عصرعلم

در پاسخ به بهاره

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

» طراحی لوگوی پپسی در فتوشاپ

پاسخ دهید
بهاره

واقعأ خوب بود،من ساخت لوگو،ساخت فاکتور و امثال اینارو میخوام یاد بگیرم،چون سایت شما خیلی ساده و کامل توضیح میده ممنون میشم یاد بدید!!!اگه میشه ایمیل کنید !
چه جوری +1 بدم به سایتتون؟؟؟؟؟!!!!!

پاسخ دهید
عصرعلم

در پاسخ به بهاره

+1 رو برداشتیم چون باعث میشه سرعت بارگزاری سایت کم بشه، ولی میتونید در صفحه ی Google Plus سایت یا فیسبوک با ما همراه باشید.
انشالله به زودی ساخت فاکتور و سربرگ رو هم آموزش میدیم (البته تا قبل از عید فطر این امکان برای ما فراهم نیست). بعد از عید انشالله آموزش در سایت منتشر خواهد شد.

پاسخ دهید
اب

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

پاسخ دهید
ناشناس

ممنون. عالی بود.

پاسخ دهید
بهتاش

عالی بود ممنون رفیق

پاسخ دهید
مهتاب

خیلی عالی بود،مختصر و مفید.ممنون

پاسخ دهید
پوریا باباعلی

سلام ممنون ولی من brush toolsرا پیدا نمیکنم

پاسخ دهید
سجاد

در پاسخ به پوریا باباعلی

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

پاسخ دهید
امیر

سلام خیلی ممنون واقعا استفاده کردم.

پاسخ دهید
sadegh

اگر می شود انیمیشن 3 بعدی را توضیح دهید

پاسخ دهید
سجاد

در پاسخ به sadegh

اگر منظور شما انیمیشنهای 3D هست که در تلویزیون مشاهده میکنید ، اونها توسط فتوشاپ تهیه نمیشوند و توسط نرم افزارهایی مثل Maya ، Blender و از این قبیل درست میشوند.

پاسخ دهید
mohamadee

سلام ؛
متشکرم اگر امکانش هست کتابهای ساخت انیمیشین را بصورت pdfبه این ایمیل ارسال فرمایید .
با تشکر از طرف یک دوست قدیمی

پاسخ دهید
سجاد

در پاسخ به mohamadee

سلام
اگر پیدا کردم براتون در قالب یک مطلب در سایت آپلود خواهم کرد.
موفق باشید

پاسخ دهید
محمد

سلام.
من از فتوشاپ آنلاین سایت http://www.450.ir/photoshop
استفاده میکنم ولی این تو منوی window نداره!
چیکار کنم؟
ممنون

پاسخ دهید
سجاد

در پاسخ به محمد

سلام دوست عزیز ، در این زمینه با سایت ارائه دهنده ی این خدمات تماس بگیرید.
موفق باشید

پاسخ دهید
روژیار

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

پاسخ دهید
امیر

سلام من فتوشاپ cs 5 رو دارم اما گزینه animation رو نداره

پاسخ دهید
سلام !

ممنون دوست من ! واقعا عالی بود و خیلی از مشکلات من رو حل کرد. 🙂

پاسخ دهید
علیرضا

مطلبتون خیلی ساده و کاربردی و در کل باحال بود.ادامه بدید همینطور

پاسخ دهید
آسان شارژ

سلام
خسته نباشید
دستتون درد نکنه
انشالله همیشه موفق باشید
AsanSharj.com

پاسخ دهید
سئو

سلام
مطلبتون جالب بود
موفق باشید
یا حق

پاسخ دهید
Nikooo

سپاس و درود
يه چيزی امروز ياد گرفتيم
…. آی حالا انيميشن بسازُم مو… 🙂

پاسخ دهید
z

Aaaaaaaaaali Bood KHODA Kheyretoon Bede.

پاسخ دهید
ali

سلام فتوشاپ من گزینه ی ایمیشن نداره

پاسخ دهید
سجاد

در پاسخ به ali

فکر میکنم از نسخه cs2 به بعد این گزینه به فتوشاپ اضافه شده و در حال حاضر نسخه cs5 در بازار موجود هست.

پاسخ دهید
eslam

در پاسخ به ali

با سلام
پس از انتخاب Window ابتدا از پايين ليست باز شده گزينه Show All Menu Items را انتخاب كن

پاسخ دهید
سجاد

در پاسخ به eslam

سلام ، خیلی ممنون به خاطر توضیحتون .

پاسخ دهید
فراهانی

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

پاسخ دهید
موسی فراهانی

اگه دوست داشتید لینک سایت ما رو بزارید و یه امتیاز پلاس وان هم به ما بدید
http://www.aminhozur.com

پاسخ دهید
ابی

در پاسخ به سجاد

واقعا مختصر و مفید یود
مرسی عالیه

پاسخ دهید
موسی فراهانی

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

پاسخ دهید

مرام‌نامه‌ی ارسال دیدگاه را رعایت کرده‌ام! (»نمایش مرام‌نامه)