آموزشهای گروهی: <شماره 4> : کلیات و جزئیات طراحی صفحات وب در فتوشاپ

sadismi_10

Member
مصطفی جان
فکر کنم این موضوع خیلی دیگه جای بحث داشته باشه
به نظر من تا الان چیز زیادی در موردش گفته نشده
 

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
خوب ما هم منتظریم اگر شما مطلبی به ذهنت میرسه مطرح کن.
 

sadismi_10

Member
عزیزم
من ادعایی ندارم
مطمئنا در برابر اساتید هم هیچی بارم نیست
ولی احساس میکنم مطالب بیشتری در مورد طراحی قالب وجود داره
مثلا شکل های مختلف ترکیب بندی
اصول رنگ شناسی(یه مقدار توضیح داده شده)
آموزش های مختلف و متنوع(به منظور آشنایی بیشتر با طراحی قالب)
و ..............
 

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
خوب همینی هم که موضوعاتی رو که به ذهنت میرسیده گفتی خیلی خوبه. ممنون
poze.gif
 

sadismi_10

Member
ساخت دکمه ی گرافیکی

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

یک داکیومنت جدید ایجاد کنید و با ابزار انتخاب مستطیلی یک کادر به اندازه نویگیشن بار رسم کنید . یک گرادیانت دو رنگه با دو رنگ

8DF858

و

78D54B
درست کنید . و آن را از بالا به پایین در حالیکه شیفت را نگه داشته اید ، بکشید .

gradiant.jpg


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

Ctrl + +

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

Pencil

در اطراف نویگیشن بار یک خط سیاه به ضخامت یک پیکسل رسم کنید . و دوباره همین کار را با سفید انجا دهید یعنی یک خط به ضخامت یک پیکسل با رنگ سفید اطراف نویگیشن بار رسم کنید .

border.jpg


برای خطوط جدا کننده هم یک لایه جدید ایجاد نموده با استفاده از ابزار خط و رنگ سفید و ضخامت یک پیکسل یک خط عمودی رسم کنید و این تنظیمات را در مورد لایه به کار برید .

bevel.jpg


و برای سایر خطوط جدا کننده هم همین لایه را دوپلیکیت نموده به مکان مناسب انتقال دهید تا اینکه همه خطوط جدا کننده ایجاد شوند .

dividers.jpg

برای ایجاد درخشش هم نیمه بالایی نویگیشن بار را با ابزار انتخاب مستطیلی شکل انتخاب کنید . یک لایه جدید درست کنید و اپاسیتی لایه جدید را به 28 ببرید و با

Paint buket

یا سطل رنگ محل انتخاب شده را سفید کنید .

shine.jpg


و در آخر هم برچسبهای نویگیشن بار را با استایل دلخواه بنویسید .

greennavmyversion.jpg

یا علی
منبع

http://www.pstutz.com
 

mostafa_az

Well-Known Member
دستت درد نکنه آقا . جالب بود . اما اینا مربوط میشه به طراحی های صفحه نه اسلایس کردن . ما توی این تاپیک بحثمون این نیست که چی طراحی کنیم . ما بحثمون اینه که از طراحی هامون چطور تو صفحات استفاده کنیم .

مخلصیم
مصطفی
 

sadismi_10

Member
خب مصطفی جان
اسلایس که کار زیادی نداره
اگه به عنوان تاپیک دقت کنی نوشته:
آموزشهای گروهی: <شماره 4> : کلیات و جزئیات طراحی صفحات وب در فتوشاپ
فکر میکنم طرز طراحی و آموزش های مربوط به اون هم جزو این بحث باشه
 

sadismi_10

Member
ببخشید
گفتید اساتید من جزوشون نیستم ولی میتونم نظر بدم
اولا قسمت منوها رو خیلی شلوغ کردی
بعدشم از رنگ هایی استفاده کردی که زیاد با هم جور نیستن
لوگوی بالای سایتت هم جای کار بیشتری داره
البته این نظر شخصی منه
 

mohsenshahab

Active Member
سلام
البته من پرسیدم که میشه یه چیزهایی هم درباره image readyگفت چون اون هم بالاخره دستش با فتوشاپ تو یه کاسه هستش ولی کسی از ما استقبال نکرد
حتما ظرف امروز و فردا اموزش ساخت وب گالری رو میذارم
 

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
مشکل خاصی نداره ما کلا داریم درباره فتوشاپ و نحوه استفاده از اون در وب صحبت میکنیم حالا بقول شما I.r هم برادر P.s هست پس میشه درباره اونم صحبت کرد.
 

mostafa_az

Well-Known Member
سارا جان دستت درد نکنه اما اگه یه توضیحم دربارشون برای من بی سواد میزاشتی بد نبود تا یه چیزی بفهمم از اینا . :wink:

مخلصیم
مصطفی
 

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
درباره چیا توضیح بدم؟ IR و PS؟ خوب ایناهمون Image Ready و Photoshop هستن دیگه!!!
sla.gif
 

mostafa_az

Well-Known Member
با تو نبودم که سارا .
272.gif
با سارا بودم .
286.gif
ها ؟ اینا که هر دوتا ساران که
24.gif
169.gif
. آها . با اون مدل گونجیشکش بودم .
242.gif


مخلصیم
مصطفی
 

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
از این به بعد مدل سارا رو مشخص کن. گنجشک یا غیرگنجشک!
fly2.gif
 
والله تا اونجا که من می دونم و سر در آوردم اینا ترکیب رنگهای مختلف رو در کنار هم نشون میده. یعنی مثلا اگه رنگ سبز رو دوست داشتی ترکیب سبز رو با رنگای دیگه نشون میده.حالا شما این ترکیبات رو نگاه می کنی از هر کدوم بیشتر خوشت اومد تو کارت ازشون استفاده می کنی . مثل رنگ پس زمینه و منوها و هدر و ...

حالا شایدم اینجوری نباشه ها . من ولی اینجوری برداشت کردم. جالب بود برام.

به دلیل تعدد سارا ها منو همون گنجشک صدا کنی گمونم بهتر باشه.

تا بعد...
 

mohsenshahab

Active Member
سلام ببخشید که یه 3-2 روز دیر این مقاله رو میذارم چون من اصلا اصفهان نبودم.امیدوارم به حساب بدقولی نذارین
الان میخوام در مورد وب فتو گالری ها در فتوشاپ صحبت کنم و سعی میکنم به مرور چند مقاله هم در مورد قدرتimage readyدر ساخت انیمیشنهای کم حجم و ساخت صفحات وب بنویسم(به امید ان روز:lol: )
وب فتو گالری
وب فتو گالری مبحثیه که من نه تا الان اموزشش رو دز هیچ کتاب اموزشی دیدم و نه هیچ استادی رو دیدم که درس بده و نه هیچ سایت فارسی رو دیدم که از این امکان فوق العاده فتوشاپ استفاده کنن

خب شروع میکنیم
اول یه کانواس جدید(صفحه)باز میکنیم.
حالا به file/automate/web photo gallery

webphotogallery1.gif


حالا پنجره web photo gallery باز میشه
در قسمت style ما میتونیم نوع وب گالری رو انتخاب کنیم(حتی چند تا وب گالری فلش خیلی عالی داره که با کمک اکشن اسکریپت وxmlنوشته شده)
در قسمت email شما email مورد نظرتون رو وارد کنین
در قسمت browsشما باید پوشه ای که عکسهای مربوط به وب فتو گالری هست رو انتخاب کنین
در قسمتdestinationشما باید ادرس مکانی که قراره وب فتو گالری تو اونجا قرار بگیره رو انتخاب کنین

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

GFX Master

مدیر انجمن گرافیک دو بعدی ومسئول فروشگاه
اقا محسن به مورد بسیار خوبی اشاره کردی شاید کمتر کسی هم تا حالا این امکان رو دیده باشه ولی خوب برای سایتهایی که نمیخوان حجم صفحاتشون خیلی بالا بره مناسبه.
 

danial_psv1

Member
خب مثل اینکه اینجا جایی برای تازه کارها نیست.
اما من هنوز به خودم امیدوارم.
این یکی از کارهای منه.

Banner.jpg


امید وارم بپسندید.
فقط اگر براتون امکان داره اشکالتش رو (که می دونم خیلی زیاده) تذکر بدین
ممنون
 

جدیدترین ارسال ها

بالا