۰۹۳۶۴۲۴۵۱۳۸

طراحی بنر سایت در فتوشاپ

مقدمه 

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

ایجاد فایل جدید

فايل جديد با مشخصات زير ايجاد كنيد:

پنجره New

 

نرسیم مستطیل

لايه جديدي ايجاد كنيد. ابزار Rounded Rectangle را انتخاب كنيد. اندازه شعاع را ۱۵ پيكسل انتخاب كنيد. براي وارد كردن اندازه دقيقفلش كنار شكل را همانند تصوير زير باز كنيد:

پنجره shape

عرض را ۷۶۰ وارد كرده و ارتفاع را خالي رها كنيد. رنگ روزمينه را ۹۹۰۰۰۰ را انتخاب كنيد. هنگام رسم شكل عرض ثابت مي­ماند اما ارتفاع بستگي به اندازه دلخواه خودمان دارد. شكل را رسم كنيد. براي ايجاد انحنا در قسمت پايين شكل از ابزار Pen استفاده مي­شود. همانند شكل زير با نگه داشتن كليد Shift‌ مسير زير را رسم كنيد:

مستطیل با گوشه های گرد

اكنون ابزار Add anchor point tool را انتخاب كنيد. روي نواحي كه مي­خواهيد انحنا ايجاد كنيد كليك كنيد. كليد Ctrl را نگه داشته و نقاط لنگر را تغيير دهيد تا مسيري به شكل منحني ايجاد شود. دوباره ابزار Pen  را انتخاب كنيد و از انتهاي مسير شروع به ترسيم مسير تا خط ابتدا نماييد. همانند تصوير زير:

درج لنگر

اعمال نور به بنر

روي مسير كليك راست كرده و Male Selection را انتخاب كنيد. ميزان Feather بايد صفر باشد. Ok را كليك كنيد. كليد Delete را بزنيد تا قسمت انتخابي پاك شود. مي­توانيد با كليد جهتي مكان انتخاب را تغيير داده و دوباره ناحيه را با Delete پاك كنيد. فرمان Deselect‌ را اجرا كنيد تا ناحيه­اي نباشد.كليد Ctrl‌ را نگه داشته و روي لايه كليك كنيد تا شكل ترسيم شده انتخاب گردد. فرمان Contract Selection را از منوي Select و زير منوي Modify اجرا كنيد. عدد ۲ را وارد كرده و Ok‌ را كليك كنيد تا ناحيه انتخابي ۲ پيكسل كوچكتر شود. لايه جديدي ايجاد كرده و ابزار Gradient‌ را انتخاب كنيد. رنگ روزمينه را سفيد انتخاب كنيد. گزينه دوم را از نوار موارد اختياري انتخاب كنيد. از بالا به پايين بكشيد تا به صورت يك ناحيه Highlight‌ به نظر برسد. فرمان Deselect‌ را اجرا كنيد. شكل به صورت زير تغيير مي­يابد:

رنگ آمیزی بنر

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

Image–>Adjustment–>Brightness/Contrast

اعداد را به شكل زير تغيير دهيد.

پنجره Brightness/Contrast

اين كار باعث مي­شود كه قسمت پائين شكل داراي يك Border باشد. فرمان Deselect‌ را اجرا كنيد. تصوير به شكل زير تغيير مي­يابد:

تغییر بنر

اضافه کردن متن بنر

ابزار Type را انتخاب كرده و روي تصوير كليك كنيد و متن مورد نظر خود را تايپ كنيد. در اين پروژه متن ۱۰۰ ROMANTIC IDEAS‌ وارد شده است. بهتر است تمام حروف را بزرگ تايپ كنيد. عنوان ROMANTIC را BOLD كنيد. فاصله بين حروف را با استفاده از پالت كاراكتر كمتر كنيد. متن ديگري تايپ كرده و اندازه آنرا كوچكتر كنيد و مكان آنرا پايين متن ديگر قرار دهيد. لايه متن را انتخاب و Layer Style را اجرا كنيد. گزينه Outer Glow  را انتخاب كرده و تغييراتي به شكل دلخواه روي متن اعمال كنيد. اگر تغييرات مد نظر نبود كليك Alt‌ را نگه داشته، دكمه Cancel‌ به Reset تغيير نام مي­يابد. روي آن كليك كنيد. تغييرات را انجام داده و روي متن اعمال كنيد. روي لايه متن كليك راست كرده و Copy Layer Style‌ را اجرا كنيد. روي لايه متن ديگر كليك راست كرده و Paste Layer Style را انتخاب نماييد. تصوير تا كنون به شكل زير تغيير يافته است:

درج متن روی بنر

درج تصویر بنر

تصوير مربوط به گلبرگها را باز كرده و آن را انتخاب كنيد. فرمان Copy‌ را اجرا كرده و به فايل اصلي بازگرديد. لايه Layer1 را با نگه داشتن كليد Ctrl انتخاب كنيد. از منوي Edit  فرمان Paste Into‌ را اجرا كنيد. فرمان Free Transform‌ را اجرا كرده و اندازه را تغيير دهيد و مكان آن را نيز تغيير دهيد. تغييرات به شكل زير مي­باشد:

قرار دادن عکس در بنر

اكنون Blending Mode همين لايه را بر روي Overlay قرار دهيد. مي­توانيد حالتهاي مختلف را آزمايش كنيد. اكنون فايل Flowers‌ را از پوشه پروژه باز كنيد. كل تصوير را انتخاب كنيد و فرمان Copy را اجرا نماييد. كليد Ctrl را نگه داشته و روي Layer1‌ كليك كنيد تا ناحيه مربوط به شكل انتخاب شود. روي لايه مربوط به تصاوير گلبرگ كليك كنيد. از منوي Edit‌ فرمان Paste Into‌ را اجرا نماييد. اندازه تصوير را با Free Transform تغيير دهيد و مكان آنرا روي تصوير تنظيم كنيد. Blending Mode‌ را روي Luminosity‌ قرار دهيد. همانطور كه در تصوير زير مشاهده مي­كنيد سمت چپ تصوير يك خط عمودي ديده مي­شود كه مي­خواهيم آنرا پاك كنيم:

درج عکس در بنر

 

ویرایش بنر

با فرمان Paste Into يك ماسك روي لايه ايجاد مي­شود. ماسك را انتخاب كرده و ابزار Brush‌ را با رنگ مشكي انتخاب كنيد. ميزان Hardness‌ را روي صفر قرار دهيد. روي خط عمودي بكشيد. تصوير به شكل زير تغيير مي­يابد:

ویرایش عکس بنر

ناحيه مربوط به حاشيه زيرين با تصوير گل از بين رفته است. روي لايه Layer1 همراه با نگه داشتن كليد Ctrl‌ كليك كنيد. با كليد جهتي ناحيه انتخابي را بالاتر ببريد. فرمان Inverse‌ را از منوي Select اجرا كنيد. اكنون لايه مربوط به تصوير گل را انتخاب كرده و كليد Delete را فشار دهيد. روي لايه گلبرگ نيز كليك كرده و Delete را فشار دهيد. تصوير به شكل زير تغيير مي­يابد:

ویرایش بنر

هر تصوير ديگري كه مي­خواهيد مي­توانيد به فايل اضافه كنيد. اما بايد اندازه و مكان آنرا تغيير دهيد. Blending Mode‌ را تغيير دهيد و تمامي نكاتي كه در اين پروژه استفاده شده است را با دقت انجام دهيد. اكنون بايد تمامي فضاي اضافي دور تصوير را حذف كنيم. زيرا اين تصوير قرار است در صفحه وب به عنوان سر صفحه استفاده شود. به همين دليل فايل اصلي را بزرگتر از اندازه معمول ايجاد كرديم. از منوي Image فرمان Trim… را اجرا كنيد. گزينه Top Left Pixel Color را انتخاب كرده و Ok را كليك كنيد تمام فضاي اضافي حذف خواهد شود. از منوي File  فرمان Save For Web‌ را انتخاب كنيد.

 

ارسال دیدگاه