آموزش طراحي بنر تبليغاتي با ابعاد 240×120

فتوشاپ ، آموزش فتوشاپ ، ابزار فتوشاپ ، فيلم آموزش فتوشاپ ، photoshop ، آموزش photoshop ، آموزش رايگان فتوشاپ

آموزش طراحي بنر تبليغاتي با ابعاد 240×120

۴,۱۰۰ بازديد

با يكي ديگر از آموزشهاي طراحي بنر تبليغاتي براي وب سايت ، در خدمت شما بازديد كنندگان عزيز هستم .

آموزش طراحي بنر تبليغاتي با ابعاد 240×120

تمام بنرهايي كه تا به حال آموزش داده ام به صورت افقي و براي Content صفحات وب طراحي شده بود .

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

ابعاد اين بنر به صورت استاندارد 240×120 با فرمت Gif مي باشد . اميدوارم از اين آموزش لذت ببريد .

پيش نياز : آموزش مقدماتي فتوشاپ

فتوشاپ را اجرا كنيد

1. يك صفحه به ابعاد 240×120 ميليمتر با رزوليشن 72 ايجاد كنيد .

 

shoe magic asarayan1

Design-Banner-Tutorial ASARAYAN1

2. بر روي لايه كادر كشيده شده دابل كليك كرده و تنظيمات گزينه Gradient Overlay را تغيير بدهيد  .

Design-Banner-Tutorial ASARAYAN2

Design-Banner-Tutorial_ASARAYAN3

3. بعد از تغيير رنگ پس زمينه ، با ابزار Rounded Rectangle Tool يك كادر ميكشم . درصد رنگي كادر كشيده شده : d7d7d7 | بعد از كشيدن كادر مورد نظر روي لايه آن دابل كليك كرده و تنظيمات پيش فرض گزينه هاي مورد نظر را تغيير بدهيد  .

Design-Banner-Tutorial_ASARAYAN4

Design-Banner-Tutorial_ASARAYAN5

4. يك كادر ديگه همانند كادر بالا ميكشم

Design-Banner-Tutorial_ASARAYAN6

بر روي لايه كادر كشيده شده دابل كليك كرده و تنظيمات پيش فرض را با توجه به تصوير زير تغيير بدهيد

Design-Banner-Tutorial_ASARAYAN7

Design-Banner-Tutorial_ASARAYAN8

Design-Banner-Tutorial_ASARAYAN9

Design-Banner-Tutorial_ASARAYAN10

5. يك دايره كوچك با درصد رنگي c0c1c2 كشيده و روي لايه دايره كشيده شده دابل كليك كنيد و تنظيمات گزينه inner shadow را تغيير بدهيد

Design-Banner-Tutorial_ASARAYAN11

Design-Banner-Tutorial_ASARAYAN12

6. در مرحله بعدي هم سه كادر ديگه ميكشم و سه آيكون كه از اينترنت دانلود كرده ام را در گوشه كادر قرار ميدهم . تنظيمات در تصوير زير مشخص شده است .درصد رنگي كادر كشيده شده برابر است با : d7d7d7

Design-Banner-Tutorial_ASARAYAN13

Design-Banner-Tutorial_ASARAYAN14

Design-Banner-Tutorial_ASARAYAN15 Design-Banner-Tutorial_ASARAYAN16 Design-Banner-Tutorial_ASARAYAN17

7 . نوبت ميرسه به تايپ متن در كادرهايي كه تا اين مرحله كشيده ام . دقت داشته باشيد كه بعد از تايپ متن بايد تمام قسمت هاي مربوط به يك كادر را با هم Marge كنيم . يعني اگر داخل بك كادر يك آيكون با يك متن تايپ شده است ، با انتخاب كليد Ctrl از روي كيبرد هر 3 لايه را انتخاب كنيم و بعد از آن كليدهاي Ctrl+E را از روي كيبرد بفشاريم تا هر سه لايه تبديل به يك لايه شود .

Design-Banner-Tutorial_ASARAYAN18 Design-Banner-Tutorial_ASARAYAN19

شروع كار با پنل انيميشن

8. پنل انيميشن را از مسير Window = > Animation فعال كنيد تا كادر تنظيمات آن در پايين صفحه ظاهر شود .

Flash Banner ASARAYAN2

Flash Banner ASARAYAN3

 

9. در پايين صفحه كادر انيميشن را مشاهده مي كنيد . اين پنل تشكيل شده است از : قسمت فريم ها  / قسمت Forever و قسمت Playes Animation

Flash Banner ASARAYAN4

10. انيميشن بنر به اين صورت هست كه از آيكون آسا رايان بالاي صفحه 4 كپي گرفته مي شود . به تصوير زير دقت كنيد .

Design-Banner-Tutorial_ASARAYAN20

11. بعد از گرفتن كپي از لايه اول ابتدا لايه شماره 1 (1 از چهار ) را انتخاب كنيد و فيلتر Blur > Motion Blur را با تنظيمات مشخص شده بر روي لايه اول اعمال كنيد .

Design-Banner-Tutorial_ASARAYAN21

Design-Banner-Tutorial_ASARAYAN22

مرحله 11 را براي 2 لايه باقيمانده هم تكرار ميكنم اما با تنظيمات ديگر . دقت داشته باشيد كه در هر مرحله بايد لايه قبلي را غير فعال كنيد تا تغييرات را بدرستي مشاهده كنيد

Design-Banner-Tutorial_ASARAYAN23

Design-Banner-Tutorial_ASARAYAN24

لايه چهارم بايد بدون تغيير باشد

12. بعد از ايجاد لايه ها يك فريم جديد ايجاد ميكنم و لايه اول را (مرحله 11) را فعال ميكنم . زمانش را برابر با 0.2 قرار ميدم .اين مرحله را تا چهارمين لايه تكرار ميكنم  .

Design-Banner-Tutorial_ASARAYAN25

Design-Banner-Tutorial_ASARAYAN26

Design-Banner-Tutorial_ASARAYAN27

Design-Banner-Tutorial_ASARAYAN28

13. نوبت ميرسه به كادر دوم . اول بايد لايه كادر دوم را فعال كنيم و با حركت ماوس به بالاي صفحه انتقالش بديم تا طي دو مرحله كم كم به جاي خودش منتقلش كنيم . براي انجام اينكار به تصوير زير دقت كنيد . براي هر مرحله هم بايد يك فريم ايجاد كنيم .

Design-Banner-Tutorial_ASARAYAN29

Design-Banner-Tutorial_ASARAYAN30

14. خوب نوبت ميرسه به سه كادر پايين صفحه . اين سه كادر بايد با هر فريم فعال بشن و بعد از فعال شدن طي دو مرحله از سمت چپ كادر خارج بشن  . به تصوير زير دقت كنيد

Design-Banner-Tutorial_ASARAYAN31

Design-Banner-Tutorial_ASARAYAN32

Design-Banner-Tutorial_ASARAYAN33

15. حالا بايد 3 كادر پايين صفحه را با هم انتخاب كنيم و يك فريم جديد در فتوشاپ ايجاد و كمي 3 كادر را به طرف چپ حركت بديم . opacity را هم برابر با 50 درصد قرار ميدهم . زمانها را تغيير دادم  از روي تايم لاين تنظيم كنيد

Design-Banner-Tutorial_ASARAYAN34

Design-Banner-Tutorial_ASARAYAN35

16. نوبت ميرسه به كادر وسط صفحه . اين كادر را هم طي 2 مرحله از بالاي صفحه خارج ميكنم

Design-Banner-Tutorial_ASARAYAN36

Design-Banner-Tutorial_ASARAYAN37

Design-Banner-Tutorial_ASARAYAN38

 

منبع: http://www.learning.asarayan.com/education/software-training/toturial-photoshop.html

تا كنون نظري ثبت نشده است
ارسال نظر آزاد است، اما اگر قبلا در رویا بلاگ ثبت نام کرده اید می توانید ابتدا وارد شوید.