ورود به اکانت شما

نام کاربری *
رمز عبور *
مرا بخاطر بسپار

ایجاد حساب کاربری

فیلد های ستاره دار را پر کنید.
نام *
نام کاربری *
رمز عبور *
تکرار رمز عبور *
ایمیل *
تکرار ایمیل *
کپچا *
بارگذاری کپچا

آموزش طراحی بنر Gif آسارایان با ابعاد 250×300 ( انیمیشن ) مطلب ویژه

توسط 12 تیر, 1394 3180 0

در صورت مفید بودن این مقاله حتما نظر خودتان را در پایین مطلب برای ما ارسال کنید

AsaRayan Coبخش قبلی دیروز با عنوان "آموزش طراحی بنر Gif آسارایان با ابعاد 250×300 (طراحی)" در سایت فعال شد که بدلیل زیاد شدن تصاویر و توضیحات ، مقاله آموزشی را به دو قسمت طراحی و انیمیشن تقسیم کردم .
اما بخش انیمیشن یا حرکت عناصر در صفحه که یک پویایی به بنر میدهد . سعی کنید هر مرحله ای را که متوجه نشدید کمی استراحت کنید و یک مرحله به قبل باز گردید سپس از دوباره تمرین را آغاز کنید . زیرا درست کردن بنرهای تبلیغاتی کار زمان بری می باشد که اگر بخواهید به صورت پشت سرهم اینکار را انجام بدهید ممکن است در همین ابتدا ، از انجام ادامه آموزش صرفه نظر کنید .

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

1 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

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

برای فعال کردن پنل انیمیشن از منوی Window > Time Line را انتخاب کنید .

2 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

3. پایین صفحه بخش انیمیشن فعال می شود . بر روی کلید Create Frame Animation کلیک کنید تا اولین فریم ایجاد شود .

3 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

4 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

4. اولین فریم ایجاد شده است . به ترتیب و مرحله به مرحله با جزییات کامل توضیح میدهم .
4.1. ابتدا گروه نارنجی یا همان Orange را انتخاب و گروه Dark را غیر فعال کنید . 

5 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

5. گروه نارنجی را با جهت های فلش کیبورد به طرف بیرون کادر سمت راست انتقال بدهید.

6 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

6. زمان را برابر با 0.02 تنظیم کنید . بر روی فلش زمان کلیک کرده و گزینه other را انتخاب کنید . سپس در کادر وارد شده 0.02 را تایپ و اینتر کنید .

7 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

8 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

9 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

 

7. با کلیک بر روی آیکون Duplicate یک فریم جدید با زمان 0.02 ایجاد می شود . در این مرحله از دوباره باید گروه نارنجی را تا 30 درصد کادر پایین بنر به طرف جلو حرکت بدهیم

10 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

8. یکبار دیگر یک فریم و 30 درصد گروه نارنجی به سمت جلو . زمان 0.02

11 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

9. ایجاد یک فریم و گروه نارنجی در وسط کادر با مدت زمان 2.0

12 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

10. ایجاد یک فریم ، گروه نارنجی 50 درصد به سمت چپ برای خروج از کادر با مدت زمان 0.02

13 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

11.ایجاد یک فریم ، گروه نارنجی به طرف بیرون کادر . گروه dark فعال 10 درصد به طرف داخل

14 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

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

 15 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

13. ایجاد یک فریم ، گروه دارک 30 درصد به طرف جلو

16 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

14. ایجاد یک فریم، قرار گرفتن گروه دارک در وسط کادر و تغییر زمان به 2.0

17 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

کار تمام شد . کلیدهای ترکیبی Ctrl+Alt+Shift+S را همزمان بفشارید یا از منوی File > Save For web را انتخاب کنید . فرمت را برابر با Gif  و Animation را برابر با Forver تنظیم کنید تا در پایان حرکت از دوباره انیمیشن آغاز شود . در پایان بنر را ذخیره کرده و در قالب خودتان استفاده کنید .

18 آموزش طراحی بنر Gif آسارایان با ابعاد 250300 انیمیشن

 AsaRayan Co

این مورد را ارزیابی کنید
(1 رای)
آخرین ویرایش در جمعه, 12 تیر 1394 ساعت 08:48
کلیه حقوق متعلق است به فروشگاه آسارایان. طراحی و پشتیبانی: webriz
تک وب دیزاین-قالب فارسی جوملا