سایت آکادمی رادیب

آموزش طراحی قالب PSD سایت در فتوشاپ لایه باز

آموزش طراحی قالب PSD سایت در فتوشاپ لایه باز

آموزش طراحی قالب PSD سایت در فتوشاپ لایه باز
هادی قربانی
زمان انتشار دوره : ۱۳۹۷/۹/۱۸

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

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

دست آورد های هادی قربانی

- مدیر و موسس جامعه وبدونی

- مدیر و موسس وبدونی مارکت

- مدیر و موسسه کمپ تاتس سایت آموزش انلاین

- راه اندازی بیش از 5 هزار سایت

- پشتیبانی بیش از 4 هزار سایت مختلف

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

- تاسیس سایت دیجی وردپرس یکی از مراجع حرفه ای وردپرس در ایران

- ارائه بیش از هزاران مقاله در زمینه های مختلف

- تسلط به زبان HTML و HTML5

- تسلط به CSS و CSS3

- تسلط به زبان php

- تسلط به جی کوئری و آجاکس

- تسلط در طراحی قالب های وردپرس

- تسلط در طراحی سیستم های حرفه ای تحت وب

- ارائه آموزش خصوصی به بیش از 1000 نفر

- سئو و بهینه سازی چنیدن وب سایت بزرگ و کوچک

- آشنایی کامل و تسلط به ابزار ها و سیستم های مختلف گوگل

- مشاوره سئو به بیش از هزار سایت و کسب و کار های اینترنتی

- مشاوره راه اندازی کسب و کار اینترنتی

- و بسیاری موارد دیگه که اگه بنویسم تموم نمیشه ... :)

مواردی که دوس دارم دائما باهاشون سر و کله بزنم:

- توسعه دهنده وب 

- طراحی وب سایت های حرفه ای 

- وردپرس ( یه زمونی هم خورد و خوراک و خواب و همه چیم شده بود وردپرس )

- سئو ( زمینه ای هست که تخصص زیادی بدست آوردم و تسلط کامل دارم بهش )

- فریم ورک سیمفونی ( در عرض 1 ماه بهش مسلط شدم سیستم قدرتمندی هست )

- برنامه نویسی به زبان های مختلف

- تبدیل جامعه وبدونی به بزرگترین برند کسب و کار اینترنتی و کار آفرینی

- تبدیل کمپ تاتس به بزرگترین بزند آموزش انلاین در ایران و خاورمیانه

- تبدیل وبدونی مارکت به بزرگترین و برند و بازار فایل های دیجیتال

- و ...

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

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

هر طراحی باید با طراحی قالب Psd در محیط فتوشاپ آشنا باشد و بعد از طراحی کامل آن به صورت پی اس دی شروع به کدنویسی آن کند.

در کنار این دوره 5 قالب psd به صورت هدیه و کاملا رایگان در اختیار شما قرار داده خواهد شد. طرح های هدیه جزو قالب های محبوب و حرفه ای جهان می باشد.

فیلم آموزش طراحی PSD سایت به صورت لایه باز

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

طراحی قالب pad

بعد از مشاهده فیلم آموزش طراحی psd سایت می توانید :

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

پیشنهاد مرتبط: دوره آموزش زبان برنامه نویسی html

چرا قبل از کدنویسی باید قالب PSD بسازیم

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

آموزش طراحی قالب psd

دلایل ساخت قالب سایت به صورت PSD

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

شاید برای شما هم پیش آمده باشد که وقتی شروع به طراحی قالب می کنید هیچ طرحی به ذهنتان نمیرسد. و دائما کدها را با آزمون خطا به طرح های مختلف تبدیل می کنید. طرح psd سایت که قبل از کدنویسی ساخته می شود, تا 60 درصد سرعت کدنویسی شما را افزایش خواهد داد و دیگر نیازی نخواهد بود با آزمون و خطا پیش بروید.

مزایای استفاده از PSD در طراحی سایت

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

آموزش طراحی قالب psd سایت

تفاوت این دوره با دوره های مشابه موجود

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

کاربردهای فایل psd سایت

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

قالب psd سایت

شرکت ها و افراد زیادی برای طراحی سایت فرصت طراحی قالب psd را ندارند. از این رو در بین قالب های آماده دنبال طرح دلخواه خود میگردند. از این رو شما می توانید با یادگیری طراحی قالب psd برای سایت یک کسب و کار اینترنتی ایده آل برای خود راه اندازی کنید. برای این کار شما می توانید در سایتی مثل سایت تم کده در بخش قالب psd سایت طرح های طراحی شده خود را برای فروش به صورت عمومی قرار دهید.

چرا طراحان بزرگ اقدام به طراحی قالب psd می کنند

اگر با طراحان بزرگ در جهان آشنا باشید. حتما میدانید که در کنار قالب هایی که ارائه می کنند نسخه psd قالب کدنویسی شده را نیز به مشتریان ارائه میدهند. مثلا در زمینه قالب های وردپرس , قالبی مثل BeTheme را در نظر بگیرید. یا قالب sahifa که یک قالب مجله خبری وردپرس می باشد. طراحان این قالب های قدرتمند و حرفه ای فایل psd طرح خود را که قبل از کدنویسی درست کرده اند , داخل پکیج قالب به مشتریان ارائه میدهند. و حتی برخی نسخه psd قالب خود را به صورت مجزا به فروش میرسانند.

این حرکت طراحان بزرگ باعث حرفه ای تر دیده شدن آنها می شود. فرض کنید شما سفارش طراحی یک قالب سایت را از یک مشتری دارید. وقتی طرح psd را قبل از کدنویسی به مشتری خود نمایش دهید شما را بسیار حرفه ای جلوه خواهد داد. این مورد یکی از راز های بزرگ طراحان بزرگ در جهان می باشد.

ساخت قالب psd در فتوشاپ لایه باز

آیا بدون فایل psd سایت می توانید قالب طراحی کرد

بله, صد در صد می توان بدون طرح اولیه و بدون قالب psd شروع به کدنویسی و طراحی قالب html کرد. اما مدت زمانی که شما می توانید بدون طرح اولیه اقدام به طراحی کنید به جرات می توان گفت 3 الی 4 برابر خواهد بود. برای مثال اگر شما با طرح psd که قبل از کدنویسی آماده کرده اید شروع به کدنویسی کنید. ممکن است در عرض 3/4 روز پروژه را به پایان برسانید. اما بدون طرح اولیه بی شک حداقل 15 الی 20 روز طراحی شما طول خواهید کشید.

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

0 دیدگاه برای این آموزش ثبت شده است

آواتار
برای ثبت دیدگاه باید شوید.

هادی قربانی این آیتم را پشتیبانی میکند

دارای پشتیبانی

حداقل و حداکثر زمان پاسخگویی 1 الی 2 روز کاری میباشد.

توجه داشته باشید

راه ارتباطی برای پشتیبانی محصولات از طریق سیستم تیکتینگ آکادمی رادیب می باشد

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

  • پاسخگویی به سوالات قبل از خرید در بخش دیدگاهها
  • پاسخگویی به سوالات و مشکلات بعد از خرید از طریق تیکت
  • تنها مواردی که مربوط به محصول خریداری شده است شامل پشتیبانی می باشد
  • ارائه بروزرسانی های رایگان در صورت وجود

مواردی که شامل پشتیبانی نمی شود:

  • آموزش اختصاصی مباحث.
  • آموزش های جانبی مربوط به دوره خریداری شده.

شرایط و قوانین را حتما مطالعه کنید.

  • 1

    فصل اول ( مقدمه دوره طراحی قالب psd )

    • معرفی دوره

    • دلایل طراحی قالب در فتوشاپ

    • کاربردهای قالب psd طراحی شده در فتوشاپ

    • بررسی قالبی که قرار هست در این دوره طراحی بشه

    • انتخاب یک قالب مدرن و فوق حرفه ای برای طراحی

    • کسب درآمد از طریق فایل های psd سایت

    • بازار کار فروش قالب های psd فتوشاپ

    • روش های کسب درامد از قالب های psd فتوشاپ

    • چرا قبل از کدنویسی باید قالب psd طراحی کنیم ؟

  • 2

    فصل دوم (اجرا فتوشاپ و شروع طراحی قالب)

    • اجرای نرم افزار فتوشاپ

    • معرفی برخی ابزارهای کاربردی فتوشاپ برای طراحی

    • کاربردهای ابزارهای مختلف فتوشاپ

    • ایجاد صفحه قالب در فتوشاپ

    • بررسی سایز صفحه قالب در فتوشاپ

    • تنظیم سایز قالب به صورت استاندارد

    • مشخص کردن هدف از طراحی psd

    • اصول اولیه ایجاد چهار چوب قالب psd فتوشاپ

  • 3

    فصل سوم ( شروع به چیدن صفحه قالب )

    • آموزش لایه ها

    • لایه بندی کردن کارها در فتوشاپ

    • گروه بندی کردن کارها در فتوشاپ

    • ساخت هدر قالب psd در فتوشاپ

    • ایجاد تصویر پس زمینه برای هدر سایت

    • ایجاد منو های قالب psd

    • قرار دادن تصویر اسلایدر در قالب psd

    • ایجاد بخش توضیحاتی درباره خدمات سایت در قالب psd

    • قرار دادن لوگو در قالب

    • استفاده از آیکون ها در طراحی قالب فتوشاپ

    • ساخت بخش انیمیشن نمایش ویدیو در قالب

    • ساخت دکمه های ورود و عضویت در سایت

    • پایان فصل سوم و اتمام هدر سایت

  • 4

    فصل چهارم ( خلق ایده های خلاقانه و مدرن )

    • نحوه ایجاد طرح های خلاقانه در قالب psd

    • استفاده از وکتورها در قالب psd

    • تنظیم تصویر ویکتور و ترنسپرنت برای پس زمینه

    • شروع طراحی بخش محصولات زیر هدر

    • نحوه طراحی باکس محصولات در قالب psd

    • آموزش ایجاد افکت در فتوشاپ برای قالب psd

    • بخش بخش کردن صفحه قالب در فتوشاپ

    • بلاک بندی قسمت های مختلف در فتوشاپ

    • ایجاد بخش درباره ما همراه با تصویر

    • ایجاد و خلق افکت مدرن برای بخش درباره ما

    • قرار دادن تصویر و نوشته در بخش درباره ما

    • ایجاد دکمه در قالب psd

    • نحوه طراحی انواع دکمه و باتن در فتوشاپ

  • 5

    فصل پنجم ( ایجاد عناصر زیبا و کاربر پسند )

    • ساخت بخش شمارنده در سایت

    • ایجاد افکت برای بخش شمارنده

    • انواع طراحی بخش شمارنده در قالب های psd

    • طراح و افکت های متنوع برای عنصر شمارنده

    • ساخت بخش آخرین فیلم های سایت

    • ایجاد افکت برای بخش آخرین فیلم های سایت

    • قرار دادن تصویر خلاقانه برای بخش آخرین فیلم ها

    • ایجاد پس زمینه مدرن و ترنسپرنت برای زیبایی بیشتر

    • ساخت بخش جدول های قیمت

    • ایجاد جدول قیمت به صورت خلاقانه و مدرن

    • ایجاد سایه برای المان ها و عناصر داخل صفحات

    • ایجاد دکمه برای جدول ها و سوییچ بین جدول ها

    • اعمال افکت های لازم روی این بخش

    • پایان این بخش

  • 6

    فصل ششم ( طراحی بخش تماس با ما صفحه اصلی )

    • طراحی بخش ارتباط با ما در صفحه اصلی قالب

    • ایجاد افکت های لازم برای این بخش

    • قرار دادن تصویر وکتوری در این قسمت

    • قرار دادن اطلاعات تماس در قالب psd

    • طراحی بخش فوتر سایت

    • اعمال افکت و پس زمینه برای فوتر سایت

    • تنظیم ناحیه فوتر

    • ایجاد ستون برای بخش ابزارکها در فوتر

    • قرار دادن عناصر لازم در فوتر سایت

    • ساخت بخش قرار دادن متن کپی رایت در فوتر

    • قرار دادن شبکه های اجتماعی در فوتر سایت

    • پایان طراحی صفحه اصلی سایت

  • 7

    فصل هفتم ( ساخت برگه آرشیو, تماس , درباره , تعمیر )

    • ایجاد صفحه جدید برای طراحی صفحه آرشیو psd

    • ساخت هدر برای صفحه آرشیو در فتوشاپ

    • ایجاد بخش هدر و عنوان برای صفحه آرشیو

    • طراحی و خلق افکت برای هدر صفحات سایت psd

    • قرار دادن محصولات در صفحه آرشیو قالب psd

    • ساخت بخش صفحه بندی قالب در فتوشاپ

    • ایجاد برگه تماس با ما

    • ساخت فرم تماس حرفه ای برای صفحه تماس با ما

    • قرار دادن نقشه گوگل مپ در صفحه تماس با ما

    • قرار دادن اطلاعات تماس در قالب psd فتوشاپ

    • قرار دادن تصویر در صفحه تماس با ما

    • طراحی صفحه درباره ما

    • ایجاد بخش درباره ما در قالب psd

    • ساخت صفحه ادامه مطلب محصولات

    • ایجاد بخش تصویر برای قالب psd

    • قرار دادن اطلاعات محصولات و مطالب در سینگل

    • طراحی بخش محتوای قالب

    • طراحی عناصر داخل محتوا

    • طراحی فوتر محتوا

    • طراحی بخش اشتراک گذاری مطالب

    • طراحی بخش برچسب های در ادامه مطلب

    • طراحی بخش نظرات و ارسال دیدگاه

    • ایجاد فرم ارسال دیدگاه

    • نمایش نظرات ارسالی در قالب psd

    • طراحی ستون کناری قالب psd

    • ساخت ابزارک های ستون کناری در فتوشاپ

    • پایان فصل هفتم

    • ایجاد فرم عضویت در سایت

    • ایجاد فرم ورود به سایت

    • ایجاد منوی پنل کاربردی در هدر

  • 8

    فصل هشتم ( خروجی گرفتن از قالب psd فتوشاپ )

    • روش های خروجی گرفتن از قالب psd فتوشاپ

    • خروجی jpg / png از قالب پی اس دی فتوشاپ

    • گرفتن خروجی psd در فتوشاپ

    • نحوه ذخیره کردن قالب psd در فتوشاپ برای وب

    • اصول ذخیره سازی قالب psd برای کدنویسی

    • ذخیره سازی قیمت های مختلف به صورت جدا

    • تکه تکه کردن بخش های مختلف قالب psd فتوشاپ

    • ذخیره کردن تکه های مورد نیاز برای کدنویسی قالب

    • سخن پایانی

توسط
توسط
توسط
توسط
توسط