تور لحظه آخری
امروز : جمعه ، 9 آذر 1403    احادیث و روایات:   
سرگرمی سبک زندگی سینما و تلویزیون فرهنگ و هنر پزشکی و سلامت اجتماع و خانواده تصویری دین و اندیشه ورزش اقتصادی سیاسی حوادث علم و فناوری سایتهای دانلود گوناگون شرکت ها

تبلیغات

تبلیغات متنی

صرافی ارکی چنج

صرافی rkchange

سایبان ماشین

دزدگیر منزل

تشریفات روناک

اجاره سند در شیراز

قیمت فنس

armanekasbokar

armanetejarat

صندوق تضمین

Future Innovate Tech

پی جو مشاغل برتر شیراز

لوله بازکنی تهران

آراد برندینگ

خرید یخچال خارجی

موسسه خیریه

واردات از چین

حمية السكري النوع الثاني

ناب مووی

دانلود فیلم

بانک کتاب

دریافت دیه موتورسیکلت از بیمه

طراحی سایت تهران سایت

irspeedy

درج اگهی ویژه

تعمیرات مک بوک

دانلود فیلم هندی

قیمت فرش

درب فریم لس

زانوبند زاپیامکس

روغن بهران بردبار ۳۲۰

قیمت سرور اچ پی

خرید بلیط هواپیما

بلیط اتوبوس پایانه

قیمت سرور dl380 g10

تعمیرات پکیج کرج

لیست قیمت گوشی شیائومی

خرید فالوور

بهترین وکیل کرج

بهترین وکیل تهران

خرید اکانت تریدینگ ویو

خرید از چین

خرید از چین

تجهیزات کافی شاپ

محصولات فوراور

خرید سرور اچ پی ماهان شبکه

دوربین سیمکارتی چرخشی

همکاری آی نو و گزینه دو

کاشت ابرو طبیعی و‌ سریع

الک آزمایشگاهی

الک آزمایشگاهی

خرید سرور مجازی

قیمت بالابر هیدرولیکی

قیمت بالابر هیدرولیکی

قیمت بالابر هیدرولیکی

لوله و اتصالات آذین

قرص گلوریا

نمایندگی دوو در کرج

خرید نهال سیب

وکیل ایرانی در استانبول

وکیل ایرانی در استانبول

وکیل ایرانی در استانبول

رفع تاری و تشخیص پلاک

پرگابالین

 






آمار وبسایت

 تعداد کل بازدیدها : 1835291569




هواشناسی

نرخ طلا سکه و  ارز

قیمت خودرو

فال حافظ

تعبیر خواب

فال انبیاء

متن قرآن



اضافه به علاقمنديها ارسال اين مطلب به دوستان آرشيو تمام مطالب
archive  refresh

آموزش طراحي Web Layout - سطح متوسط - متن + تصوير -


واضح آرشیو وب فارسی:سایت ریسک: آموزش طراحي Web Layout - سطح متوسط - متن + تصوير Depp 20 شهريور 1388, 13:22سلام به شما ميخوام اولين پستم رو با يك آمــــوزش شروع كنم اميدوارم مفيد واقع بشه.ابتدا توضيحاتي رو راجع به آموزش ميدم پس تا آخر آموزش با من همراه باشيد. -------------- نويسنده آموزش: Richard Carpenter ترجمه شده توسط خودم برنامه استفاده شده:Adobe Photoshop CS3 سطح آموزش: متوسط (ميشه گفت اندكي پيشرفته) زمان مورد نياز: حداقل 1 ساعت- حداكثر 2 ساعت منبع:psdtuts --------------- مرحله اول: ابتدا يك سند در اندازه 1200 در 1160 پيكسل با پس زمينه سفيد ايـجاد كنيد. بعد براي دقت بيشتر در طراحي احتياج به دو تا Guide (راهنما) داريم كه طبق اندازه مورد نظر بايد فاصله بين اين دو تا راهــنما 850 پيكسل باشه. بدين منظور براي ايجاد راهنماي اول به منويView > New Guide رفـته و در اندازه 175 پيكسل Guide را به حالت عمودي ايجاد كنيد. () براي ايجاد راهنماي دوم مجددا به منوي فوق رفته و اين بار در اندازه 1025 پيكسل در حالت عمودي راهنما را ايجاد كنيد. () اكنون ما دو تا راهنما ايجاد كرديم. بايد توجه داشته باشيد كه دقيقا بايد فضاي بين اين دو راهنما 850 پيكسل باشه. مرحله دوم: حالا زمان پر كردن رنگ پس زمينه طرحه.ابتدا رنگForeground را بر رويFFFFFF# و رنگ Background را بر روي e1e1e1# ست كنيد.بعد بايد يك طيف رنگي ايجاد كنيم با ابزار Gradient Tool يك طيف رنگي از رنـــگهاي فوق در نوع Radial ايجاد كنيد. () بطوريكه مكان شروع اون از بالا در وسط صفحه و رنگ اون تا ميانه طرح را بگيره همانند تصوير زير: () مرحله سوم: ابزار Type Tool را انتخاب كنيد بعد متن مورد نظر خودتون رو كه ميتونه نام وب ســـايت شما باشه را در رنگ دلخواه در گوشه چپ در كنار Guide سمت چپ بنويسيد. در اين آموزش از رنگ #ff008a استفاده شده . () مرحله چهارم: حالا براي قرار دادن مكان كاوش در مطالب (جستجو) وبسايت بايد اون رو طراحـي كنيم براي طراحي مكان جستجو در همان سطح احتياج به دو تا مستطيل نسبتا كوچك داريم. براي ايجاد آن دو مـيتونيد از ابزارهاي Rectangular Marquee Tool همچنين Rectangle Tool استفاده كنيد. () طبق تنظيمات زير اونها را ايجاد كنيد. تنظيمات استايل فيلد درج متن : () () () تنظيمات استايل دكمه جستجو: () () () مرحله پنجم: بالاخره بعد از انتخاب نوع ابزار و افزوده شدن متن و مكان جستجو در زمينه. کليات مسئله باید چیزی مثل تصوير زير دربياد. () مرحله ششم: ابزار Rounded Rectangle Tool را انتخاب كنيد و مقادير Radius را 15 پيكسل گذاشته و با تغيير از حالت Shape به Paths مستطيلي را از ابتدا Guide سمت چپ تا Guide سمت راست ايجاد كنيد. بعد بر روي آن راسـت كليك كنيد و Make Selection را انتخاب كنيد و توجه داشته باشيد كه اندازه اين مــستطيل بيشتر از 215 پيكسل نشه. () () مرحله هفتم: در حالي كه حالت انتخاب فعاله.ابزار Gradient Tool را انتـخاب كنيد و بـعد از ست كردن رنـــگهاي fefefe# براي Foreground و رنـگ e1e1e1# بــراي Background طيف رنگي از نــــوع Radial از بــــالاي مكان انتخابي تا پايـين ايــجاد كنيد بصورتي كه سـطح بالاتر كمي روشنتر باشه. () مرحله هشتم: بعد از افزودن طيف رنگي تنظيمات زير را بر روي لايه اعمال كنيد. () () () مرحله نهم: سپس كليد Ctrl را نگه داريد و روي اين لايه كليك كنيد تا دوباره به حالت انتخاب در آيد بعد ما براي ادامه كارمون بر روي اين لايه بايد مـكاني در وسط اين مستطيل ايجاد شـده را به حالت انتخاب در آوريم . به منوي Select > Modify > Contract رفته و در قسمت Contract By عدد 15 را تايپ كرده و تاييد نماييد. () مرحله دهم: لايه جديدي ايجاد كنيد و مكان انتخاب شده را با رنگ دلخواه پر كنيد سپس با زدن كليد هاي Ctrl + D اون رو از حالت انتخاب خارج كنيد. () مرحله يازدهم: اكنون تنظيمات زير را بر روي اين لايه اعمال كنيد. () () () مرحله دوازدهم: سپس بايد افكتي منــاسب بـراي اين قـسمت ايجاد كنيم. اين افكت به دلخواه اسـت و ميتوانيد از براش نيز استفاده كنيد. (من در اين آموزش به اين شكل عمل كردم در حقيقت ميتونيد در اين فسمت با ساخت يه براش ساده هم آشنا بشيد) ابتدا سند جديدي در اندازه 600 در 600 پيكسل بدون پس زمينه ايجاد بكنيد و با ابزار Elliptical Marquee tool دايره اي بزرگ در وسط آن ترسيم كنيد. () ادامه آموزش در پست بعدي... Depp 20 شهريور 1388, 16:00ادامه آموزش: بعــد از ايجاد دايــره بايد كـمي تغـييرات را روي استايل اين لايه اعـمال بشه.پـس تنظيمات زير رو اعمال كنيد. بعد از انجام تنظيمات اين لايه به منوي Edit > Define Brush بريد و اون رو بصورت براش با نام مناسب ذخــــيره كنيد.ابزار Brush Tool را انـتخـاب كنيد و براش مـورد نــظر را برگزينيد Master Diameter را روي 50 پيكسل قرار بديد. بعد به قسمت Brush Options بريد تا تنظيماتي را بر روي اين براش اعمال كنيم. مرحله سيزدهم: براش شما آماده و قابل استفاده است.ابتدا بالاي لايه مستطيل دوم كه چندي پيش بر روي اون كار كرديم لايه اي جديد ايجاد كنيد و با ست كردن رنگ دلـخواه كه من در اين آموزش از رنگ سفيد ffffff# براي براش استفاده كردم بـه آرامي در سه لايـه متفاوت اين براش را بر روي كار بياريد سپس بــراي جلــوه دادن بيشتر لايه هاي فوق بايد كمي از لايه هاي زيرين را مات كنيم بدين منظور از فيلتر Guassian Blur استفاده ميكنيم.به منويFilter > Blur > Gaussian Blur بريد و Radius را 3 پيكسل انتخاب كنيد و بعد تايـيد كنيد. (اين مرحله بصورت دلخواهه و شما ميتونيد از براش مورد نظر خود و طبق سليقه خود اين مكان رو طراحي كنيد.همچنين ميتوانيد از تصوير هم استفاده كنيد.) در آخر بايد به اين صورت در بياد: ميتونيد متنتون رو هم بهش اضافه كنيدكه بطور مثال مثل تصوير زير ميشه: مرحله چهاردهم: حالا نوبت طراحي Navigation وب سايـته. ابـزار Rounded Rectangle tool را انتخاب كنيد و با قرار دادن مقدار 10 پيكسل براي Radius و در حـالت Paths مستطيلي به ارتفاع 54 پيكسل از كنار Guide سمت چپ تا Guide سمت راست رسم كنيد.حالا بر روي اون راست كليك كنيد و Make Selection رو انتخاب كنيد .ميبينيد كه بصورت انتخاب در مياد.اونو با رنگي دلخواه پر كرده از حالت سلكت خارج كنيد حالا تنظيمات زير رو بر روي استايل اين لايه اعمال كنيد: مرحله پانزدهم: حالا بايد بر روي اين Navigation تعدادي پيوند ايجاد كنيم پـيوند هاي مورد نظر ميتونه همچون صفحه اصلي ، گالري ، پروژه ها ، ارتباط با ما و... باشه.بين اين پيوند ها هم ميتونين بوسيله نقطه يا خط كه بسته به سليقه شما داره جدا كرد .(در اين آموزش از نقطه استفاده شده كه با رنگ #ff008a پر شده). مرحله شانزدهم: بعد از اينكه كار طراحي قسمت Navigation به پايان رسيد نوبت به طراحي قسمت بعديه.براي طراحي اين قسمت هم ما دوبــاره به ابزار Rounded Rectangle tool روي مياريم.اين ابزار را انتخاب كنيد مقدار Radius را 10 پيكسل برگزيده و مستطيلي با ابعاد335 پيكسل پهنا و 196 پيكسل ارتفاع رسم كنيد.مكان اين قسمت هم در اين آموزش از كنار Guide سمت چپ شروع ميشه. مرحله هفدهم: حالا تظيمات زير رو بر روي استايل اين لايه اعمال كنيد. مرحله هجدهم:حالا ميخواهيم به اين قسمت كمي افكت بديم.ابزار Polygonal Lasso tool رو انتخاب كنيد.بعد گوشه سمت راست اين قسمت رو به صورت مثلث شكل به حالت انتخاب دربياريد. مرحله نوزدهم: حالا با Ctrl + X اونو كات كنيد بعد دوباره با Ctrl + V پيست كنيد.بعد بايد اونو 180 درجه چرخش بديد به منوي Edit > Transform > Rotate 180 بريد و چرخش رو ايجاد كنيد.(ميتونيد اين قسمت رو هم دست نخورده باقي بگذاريد.) مرحله بيستم: حالا ميتونيد عنوان و متن اين قسمت هم اضافه كنيد. اگر كمي بيشتر وقت بگذاريد ميتونيد با كمي ابتكار Web Layout هاي زيبايي طراحي كنيد.اگر از اول آموزش توجه كرده باشيد متوجه ميشويد كه طراحي و رنگ بندي ها و تمام قسمتها هم دست خودتونه و ميتونيد كم يا اضافه يا تغييرش بديد. اميدوارم اين آموزش مورد استفاده شما قرار گرفته باشه. GFX Master 20 شهريور 1388, 16:55آموزش فوق العاده عالی ای بود! واقعا ممنون. فقط اگر کسی بتونه تبدیل به pdf بکنه ممنون میشم. موفق باشی دوست عزیز. L-B 20 شهريور 1388, 17:21من انجام دادم ... فقط الان سرعتم کمه واسه .. هم افطار رو تموم کردم میزارم واسه آپ /// L-B 20 شهريور 1388, 17:22راستی سارا من یک اموزشی از شب مهتابی زده بودم توش یک پی دی اف از کارم گزاشته بودم /.خواستی اونم استفاده کن ... :wink: L-B 20 شهريور 1388, 20:11اینم لینک : Zip | 1.5 mb L-B 20 شهريور 1388, 20:12راستی یادم رفت بگم ببخشید برای دیرکرد ! :دی :) GFX Master 20 شهريور 1388, 21:46وااای مرسی الیاس جان. دستت درد نکنه واقعا. من یکی که این آموزش رو خیلی دوست دارم. میذارمش توی تاپیک مخصوصش. مرسی بازم.




این صفحه را در گوگل محبوب کنید

[ارسال شده از: سایت ریسک]
[مشاهده در: www.ri3k.eu]
[تعداد بازديد از اين مطلب: 624]

bt

اضافه شدن مطلب/حذف مطلب







-


گوناگون

پربازدیدترینها
طراحی وب>


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