۶ تکنیک جدید در دنیای طراحی وب

تقریبا در هر سال و حتی در هر ماه یک تکنیک جدید برای طراحی ظاهر می‌شود. شخصا خودم یکی از طرفداران تکنیک‌های جدید هستم و دوست دارم حاصل کار خلاقیت دیگران را نیز مشاهده کنم. امروز در این مطلب قصد داریم تا در ارتباط با ۶ تکنیک جدید طراحی وب صحبت کنیم.

۱. ساده و تمیز نگه داشتن همه چیز

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

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

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

صفحه اصلی برند Starship نیز استثنایی است. برگه‌های این صفحه ساده هستند اما می‌توانند حسی از کامل بودن را به شما بدهند. طراحان این وبسایت به خوبی از لایه‌بندی مینیمال استفاده کرده‌اند. در این طرح قسمت‌های متفاوتی که مورد نظر بوده به خوبی نمایش داده‌ شده‌اند. پس‌زمینه‌ها، رنگ‌ها، تایپوگرافی و... همگی دست در دست هم داده‌اند تا وبسایت خیره کننده‌ای را بسازند.

۲. تاکید روی تایپوگرافی

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

نه تنها بزرگ‌ترین، بلکه اساسی‌ترین المانی که روی این صفحه قرار گرفته دقیقا المان تایپوگرافی KUB-RICK است. از طریق این المان، باقی قسمت‌ها نیز شروع به پیدا شدن می‌کنند.

Concrete یک آژانس خلاقانه است و به همین طبع، وبسایت‌ آن‌ها نیز از المان‌ها و تکنیک‌های خلاقانه‌ای استفاده می‌کند. تایپوگرافی که در این وبسایت قرار گرفته به خوبی توانسته نظرات را به خود جلب کند و این دقیقا کاری‌ست که باید انجام شود.

Sean Hobman نیز نمونه‌ای دیگر از استفاده مناسب از تایپوگرافی است. جدای از آنکه این وبسایت از یک نمای خاکستری استفاده می‌کند، تایپوگرافی‌ها همراه با انیمیشن‌های مختلف و البته لایه‌بندی منحصر به فردی نمایش داده می‌شوند.

۳. راحتی در جریان برگه

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

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

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

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

۴. انحراف لایه‌بندی شبکه‌ای

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

قسمت اصلی وبسایت Gauche de la Lune انحراف عمل بالایی را در لایه‌بندی شبکه‌ای بوجود آورده است. با نگاه کردن به این وبسایت در نگاه اول فکر می‌کنید که همه چیز در همه جا وجود دارد، اما بعد از گذشت چند ثانیه متوجه می‌شوید که اینگونه نیست. در حقیقت یک توهم از نامرتب بودن را به مخاطب می‌دهد، در صورتی که همه چیز به دقت در جایی قرار گرفته است.

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

با نگاه به وبسایت Carbon Beauty متوجه می‌شوید که المان‌ها در یک بهم ریختگی قرار گرفته‌اند. شما نمی‌توانید جای چیزی را پیش بینی کنید چرا که از سیستم شبکه‌بندی سنتی استفاده نکرده است. اگر به سمت پایین صفحه اسکرول کنید بیشتر با شکل متفاوت سیستم شبکه‌بندی برخورد خواهید کرد.

۵. انیمیشن‌های خلاقانه، تعاملی و جذاب

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

وبسایت نمونه کار Austin Mayer صفحه اصلی با المان‌های متحرک بسیار زیادی را در خود قرار داده که هر کدام به نحوی جذاب و زیبا هستند. منوها، لینک‌ها و حتی پس زمینه بخشی از این المان‌های متحرک به شمار می‌روند.

وبسایت Jordan Sowers نمونه‌ای دیگر از وبسایت‌های متحرک است. البته در این وبسایت بیشتر از انیمیشن‌هایی استفاده شده که به صورت نامحسوس استفاده می‌شوند. اما در هر صورت تجربه کاری بسیار عالی را برای کاربران به ارمغان آورده است.

وبسایت Cisternerne به خوبی و با استفاده از خلاقیتی منحصر به فرد توانسته که قابلیت‌های متحرک‌سازی را به وبسایت بیاورد. هر چیزی که در این وبسایت می‌توانید مشاهده بکنید، جلوه نرمی دارند و تحرکات در این وبسایت نیز به همین شکل هستند.

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

۶. استفاده خلاقانه از رنگ

در پایان این مقاله قصد نمایش چند مثال را دارم که در آن‌ها به صورتی خلاقانه از رنگ‌ها استفاده شده است.

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

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

شیوه استفاده وبسایت Hang the DJ از رنگ سیاه منحصر به فرد است. همچنین وجود قسمت‌های صورتی و آبی نیز طرح خاصی را به وبسایت داده‌اند. در نهایت این دو رنگ نقش بسیار خوبی را در این وبسایت ایفا کرده‌اند.

تکنیک مورد علاقه شما چیست؟

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

منبع