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

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

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

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

آموزش طراحی بنر گیف 250×300 (حرکت) مطلب ویژه

توسط 27 تیر, 1394 3870 0

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

AsaRayan Coدر بخش اول طراحی بنر را آموزش داده ام . حالا نوبت میرسد به بخش انیمیشن یا حرکت . حرکت به این شکل می باشد که ابتدا پیغام کادر قرمز رنگ در چند حرکت به طرف بیرون کادر رفته سپس 6 کادر زرد رنگ که مربوط به پیغام های بنر می باشد کم کم به وسط صفحه اضافه می شود .

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

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

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

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

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

1 آموزش طراحی بنر گیف 250300 حرکت

4. لایه طوسی همراه با متن داخل آن + 4 دایره رنگی باید تبدیل به یک لایه شوید . با پایین نگه داشتن کلید Ctrl لایه ها را انتخاب و کلیدهای Ctrl+E را از روی کیبورد انتخاب کنید .

2 آموزش طراحی بنر گیف 250300 حرکت

5. حالا لایه قرمز رنگ را غیر فعال میکنم و 6 کادر نارنجی را فعال میکنم . 6 کادر هم باید همراه با متن داخلش تبدیل به 6 لایه مجزا شود (کادر نارنجی + متن)

3 آموزش طراحی بنر گیف 250300 حرکت

4 آموزش طراحی بنر گیف 250300 حرکت

6. کار با لایه ها تمام شد . برویم سراغ حرکت لایه ها . اولین فریم ایجاد شده است . به ترتیب و مرحله به مرحله با جزییات کامل توضیح میدهم .زمان فریم اول را برابر با 3 تنظیم کنید . بر روی فلش زمان کلیک کرده و گزینه other را انتخاب کنید . سپس در کادر وارد شده 3 را تایپ و اینتر کنید .

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

5 آموزش طراحی بنر گیف 250300 حرکت

7. حالا یک فریم جدید ایجاد کنید . زمان آن را برابر با صفر قرار بدهید . سپس لایه قرمز را 50 درصد به طرف بیرون کادر حرکت بدهید

6 آموزش طراحی بنر گیف 250300 حرکت

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

7 آموزش طراحی بنر گیف 250300 حرکت

9. در این مرحله لایه متن با قابلیت های را در 5 فریم با مدت زمان 0.02 فعال کنید . ابتدا باید یک فریم ایجاد ، لایه با قابلیت های را با 20 درصد Opacity  فعال کنیم . سپس یک لایه دیگر Opacity برابر با 40 . این مرحله تا Opacity برابر با 100 قرار بگیرد باید تکرار شود .

8 آموزش طراحی بنر گیف 250300 حرکت

9 آموزش طراحی بنر گیف 250300 حرکت

10 آموزش طراحی بنر گیف 250300 حرکت

10 . حالا نوبت به 6 کادر نارنجی میرسد . مدت زمان 6 کادر برابر با 0.01 می باشد .
10.1. روش حرکت به این شکل می باشد که ابتدا یک فریم ایجاد می کنید . سپس 50 درصد کادر در طرح اصلی قرار می گیرید . سپس یک فریم دیگر و کادر در جای اصلی قرار می گیرید
اینکار برای هر شش لایه باید تکرار شود .
مدت زمان فریم آخر باید برابر با 5 تنظیم شود.

11 آموزش طراحی بنر گیف 250300 حرکت

12 آموزش طراحی بنر گیف 250300 حرکت

13 آموزش طراحی بنر گیف 250300 حرکت

14 آموزش طراحی بنر گیف 250300 حرکت

15 آموزش طراحی بنر گیف 250300 حرکت

16 آموزش طراحی بنر گیف 250300 حرکت

17 آموزش طراحی بنر گیف 250300 حرکت

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

18 آموزش طراحی بنر گیف 250300 حرکت

AsaRayan Co

 

 

این مورد را ارزیابی کنید
(3 رای‌ها)
آخرین ویرایش در شنبه, 27 تیر 1394 ساعت 11:30
کلیه حقوق متعلق است به فروشگاه آسارایان. طراحی و پشتیبانی: webriz
تک وب دیزاین-قالب فارسی جوملا