مدهای طراحی گرافیکی وب سایت در سال 1397

نوشته شده توسط طراح سایت مهندس زنگی

آدرس کوتاه این مقاله: http://darkoob.co.ir/?p=777

مدهای طراحی گرافیکی وب سایت در سال 1397
5 (100%) 2 vote[s]

حتما شنیدید که میگن “چیزهای قدیمی دوباره مد میشن”، اینطور که بوش میاد طراحی وب سایت در سال 97 قراره یه چیزهایی رو از گذشته دوباره مد کنه از طراحی فلت گرفته تا چیزهایی که همین اواخر اومده بودند. مینیمالیسم و سادگی همچنان باقی میمونن اما انتظار داریم در کنار اینها شاهد بازگشت چند تا از مدهای قدیمی هم باشیم. ترکیب مدهای جدید و قدیمی ظاهر بروز شده ای به سایت میده.
اگه دوست دارید با مد روز پیش برید میتونید یکمی از طراحی هایی رو که خیلی جدیدند ولی مدت کمی مهمون سایتها هستند رو به سایتتون اضافه کنید. برای این کار 10 مد طراحی گرافیکی زیر رو در وب سایتتون اعمال کنید تا مشتریهاتونو شگفت زده کنید:

1- لوگوهای واکنشگرا (ریسپانسیو)
2- گرادینت
3- عمق بیشتر (همراه با طراحی نیمه فلت)
4- طیف های دو رنگی
5- پالتها و الگوهای الهام گرفته از دهه 60 و 70
6- حرکت: انیمیشن و گیف
7- تایپوگرافی برجسته (بُلد)
8- تصاویر و هنرهای گرافیکی سفارشی شده
9- عکسهای واقعی
10- محصولاتی با جزئیات بالا

1- لوگوهای واکنشگرا (ریسپانسیو)

10 سال از وقتی که طراحی واکنشگرا ظهور کرد و انقلابی تو صنعت وب به پا شد میگذره و حالا دیگه به یکی از استانداردهای صنعت وب تبدیل شده. ظهور سریع وبگردی با موبایل (و دستگاه های مختلف با اندازه های متنوع نمایشگر) مشکلات کارایی مهمی رو برای وب سایتهای قدیمی بوجود آورد. طراح ها و توسعه دهنده ها برای سازگار کردن طراحی سایتها با دستگاه های کاربرها روشهای مختلفی رو امتحان کردند تا شاید بشه کاری کرد که یه وب سایت با همه دستگاه ها مطابقت داشته باشه و روی همشون کار کنه. این تلاشها زمینه ای شد برای اونچه که امروز به اسم “طراحی واکنشگرا” یا ریسپانسیو میشناسیم.
یه ایده ای هم این وسط مطرح شد که لوگو با توجه به نیازهای کاربر تغییر کنه، اما استقبالی نشد و همینطوری باقی موند…تا امروز. بعضی از شرکتها لوگوشونو به سبک مدرن تغییر دادند و نسخه های قدیمی رو ساده تر کردند. قدم بعدی هم قاعدتا اینه که طراحی لوگو واکنشگرا بشه تا با نیازهای امروز مردم مطابقت داشته باشه.
برای اینکه مطلب براتون ملموس تر باشه میتونید سیر تغییرات لوگوی شرکتهای کوکاکولا، نایک، چنل و دیزنی رو ببینید.

2- گرادینت

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

3- عمق بیشتر (همراه با طراحی نیمه فلت)

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

4- طیف های دو رنگی

طیف های دو رنگی از خیلی وقت پیش تو طراحی های کاغذی دیده میشد. حتما شما هم دیدید؛ یه سمت صفحه به یک رنگ هست و در سمت مخالف یک رنگ دیگه، این دو رنگ در وسط صفحه که به هم میرسند کم کم در هم ادغام میشن و یه تصویر دو رنگ رو به وجود میارن. این روش زمینه ای که سابقا در کارهای چاپی استفاده میشد، الآن در دنیای دیجتیال جانی تازه پیدا کرده. ساخت تصاویری با طیف دو رنگ به کمک نرم افزارها حتی ساده تر هم شده و میتونه متنوع تر از قبل به صورت تک رنگی، سه رنگی، چهار رنگی و حتی به صورت طیف های جعلی (تصاویر رنگ شده) هم ساخته بشه.
طراح ها با استفاده از این روش میتونن با رنگهای محدودی ترکیب هایی زیبا و دلربا به طراحی نیمه فلت بدن.
با رنگهای برجسته و امکانات خوبی که اپلیکیشن ها در اختیارمون میذارن، پیش بینی میکنیم که طیف های دورنگی به یکی از داغ ترین مدهای سال 97 تبدیل بشن.

5- پالتها و الگوهای الهام گرفته از دهه 60 و 70

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

6- حرکت: انیمیشن و گیف

اگه خواننده مطالب دارکوب بوده باشید حتما اسم میکرواینتراکشن ها رو شنیدید. میکرواینتراکشن ها در واقع انیمیشن های کوچیکی هستند که برای ارتباط بهتر با کاربرها طراحی میشن و به کاربر کمک میکنند تا بهتر بتونه در سایت کارهایی رو که میخواد انجام بده. میکرواینتراکشن ها جزء بهترین روشهای تجربه کاربری به حساب میان.
میکرواینتراکشن ها رو همه جا میتونید ببینید، حتی شاید ندونید ولی وقتی عکس های اینستاگرام رو لایک میکنید یا اونها رو به چپ میکشید هم با میکرواینتراکشن ها سر و کار دارید. میکرواینتراکشن ها باعث میشن کاربر حس کنه داره تو رابط کاربری دست میبره، چون با هر اقدامی که در سایت انجام میده یه بازخوردی میگیره، مثلا وقتی عکس اینستاگرام رو لایک میکنید علامت قلب رو میبینید. توجه به جزئیات میتونه طراحیتونو یه سطح بالاتر ببره.
حالا بریم سراغ انیمیشن های بزرگتر، گیف ها و SVG ها ابزار مفیدی برای ارتباط برقرار کردن و تولید محتوا برای کاربرها هستند و اونها رو بیشتر با سایت درگیر میکنند. فایل های گیف قدمت بیشتری دارند و از خیلی وقت پیش حضور داشتند و حالا هم خودشونو با دنیای مدرن تطبیق دادند. این نوع انیمیشن ها میتونن تبلیغات، خبرنامه های ایمیلی، تصاویر، آیکون ها و لوگوها رو جذاب تر کنند. لوگوهایی که به صورت گیف انیمیشنی شدند دارند کم کم مد میشن و دلیلش هم واضحه: چون ماهرانه، زیرکانه و فوق العاده جذابند.
اگه به این موضوع علاقه دارید، پیشنهاد میکنم مطلب “انیمیشن در طراحی رابط کاربری” رو هم بخونید.

7- تایپوگرافی برجسته (بُلد)

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

8- تصاویر و هنرهای گرافیکی سفارشی شده

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

9- عکسهای واقعی

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

10- وینتاژ با جزئیات

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

حالا برای طراحی در سال 97 آماده اید

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



دارکوب نام تجاری ثبت شده. دارای مجوز از سازمان نظام صنفی رایانه ای و وزارت فرهنگ و ارشاد اسلامی. رتبه چهار شورای عالی انفورماتیک کشور.

آموزشگاه طراحی وب سایت و سئو دارکوب با مجوز رسمی از سازمان فنی و حرفه ای تاسیس شد.

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