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

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

مرورگر در مقابل فتوشاپ !

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

یک راست در مرورگرها طراحی کنید !


این وضعیت در سازمان هایی که طراحان وبشان به کدنویسی مسلط هستند وجود دارد، طراحی در PSD راحت و ساده تر از طراحی در مرورگر است، اما طراحان وب فکر میکنند اگر در مرورگر طراحی کنند میتوانند خیلی زیباتر انیمیشن ها و المنت های رسپانسیو خود را به نمایش بگذارند.
مزایا :
  • فریمورک هایی مانند Bootstrap و Foundation انجام این پروسه را سریع تر میکنند، البته به نظر من ابتدا لازم است چندبار خودتان همه ی کدها را بنویسید تا هنگامی که از این فریمورک ها استفاده میکنید درک کنید که در پشت صحنه ی آنها چه اتفاقی در حال رخ دادن است.
  • اگر یک شرکت دارید، یادگرفتن کدنویسی front-end طراحان وبتان باعث میشود که سرعت انجام کارهایتان بالاتر برود، برای مثال میتوانید توسعه دهندگان وبتان را از HTML و CSS نویسی فارغ کنید و تنها وظیفه ی آنها توسعه ی طرح هایی باشد که به دستشان میرسد.
معایب :
  • اگر تازه شروع به طراحی در مرورگر کرده اید ممکن است این روند برایتان کمی طولانی شود مخصوصا برای طراحان وبی که به کدنویسی آشنایی ندارند، البته برای اینکه دستتان در کدنویسی روان شود میتوانید چند صفحه ی ساده طراحی کنید تا با اصول کد نویسی سمت کلاینت آشنا شوید.
  • این کار ممکن است توانایی طراحانتان در طراحی را کاهش دهد، اینکه یک طراح وب مسلط به کد باشد خیلی خوب است اما به این نکته نیز توجه کنید افرادی که رو یک کار خاص تمرکز میکنند میتوانند آن کار را به بهترین نحو ممکن انجام دهند و این کار باعث میشود تمرکز طراحانتان بر روی طرح هایشان کمی کاهش یابد.

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


نرم افزارهای تحت desktop مانند Photoshop و یا حتی SAAS ( Software as a Service ) هایی مثل UXPin ابزارهایی هستند که طراحان بتوانند توسط آنها طراحی کنند، البته بعضی از طراحانی که به کدنویسی مسلط هستند عقیده دارند که اگر المنت ها را قبل از کدنویسی در یک محیط دیگر مانند فتوشاپ طراحی کنند باعث بهتر شدن روند طراحی میشود.
مزایا :
  • اپلیکیشن های طراحی و ویرایش عکس مانند فتوشاپ ابزارهای بسیار مناسبی هستند برای اینکه یک طراح زیبا بکشید، هرچند با استفاده از مداد و یک برگه کاغذ نیز میتوانید طرح های سریع و زیبایی بکشید و خیلی سریع یک خروجی تولید کنید.
  • بهتر است ابتدا خروجی هایی که از این ابزارها بدست می آورید را به مدیران کسب و کارتان نشان بدهید، در این صورت برای تغییر آن دردسر کمتری خواهید کشید، اگر در مرورگر طراحی کنید و سپس مجبور شوید لایه بندی را عوض کنید خیلی دردسر بیشتری خواهید داشت.
معایب :
  • ایجاد یک طراح رسپانسیو در فتوشاپ نمیتواند طریقه عملکر آن طرح در مرورگر را به خوبی نشان بدهد، البته بهتر است مدیا کوئری هایی که در صفحه استفاده میکنید را با چشم تشخیص دهید تا اینکه بخواهید با ابزارهای آماده این کار را انجام دهید، زیرا در لحظه ای که مشغول کدنویسی هستید از طرح رسپانسیو خود فیدبک های زنده میگیرید در صورتی که اگر در فتوشاپ بخواهید یک طرح رسپانسیو بزنید فیدبک زنده نمیگیرید و همچنین دیگر لازم نیست چندین طرح تکراری در فتوشاپ ایجاد کنید و فقط کافیست در مرورگر المنت های مخصوص را پنهان و آشکار کنید.
  • گاهی محدودیت های اجرایی در فتوشاپ نادیده گرفته میشوند، برای مثال، یک بار من یک طرح ارسال ایمیل زیبا در فتوشاپ طراحی کردم و هنگامی که خواستم آن را به صورت رسپانسیو در مرورگر نشان دهم به مشکلات بسیار زیادی برخورد کردم و در نهایت مجبور شدم یک طرح زشت و نامناسب برای قسمت ارتباط با ما به صورت مستقیم در مرورگر طراحی کنم، بنابراین هنگامی که در فتوشاپ طراحی میکنید حواستان به محدودیت هایی که ممکن است در کد ایجاد کند باشد.

نتیجه گیری

من به شخصه حتی هنگامی که در حال طراحی در مرورگر هستم از نرم افزارهایی مثل فتوشاپ استفاده میکنم، شما چگونه کار میکنید ؟ کامنت بگذارید و بگویید.
 

محمد یه دانشجوی فناوری اطلاعات هست که از سال 92 فعالیتش رو شروع کرد، در حال حاضر در زمینه ی برنامه نویسی تحت وب و اندروید و شبکه های ارتباطی سیسکو فعالیت میکنه .

نظرات و سوالات کاربران

ارسال پاسخ ekade.ir
ekade.ir
شنبه ۱۰ بهمن ۱۳۹۴ ۱۶:۵۱
خیلی خوب بود.
ممنون و موفق باشید