3 گرایش اساسی طراحی، می 2024

دیروز

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

اگر بر اساس روند وب سایت قضاوت می کنید، طراحان در حال حاضر کاملاً خلاق هستند. مجموعه این ماه دارای بسیاری از عناصر تعاملی منظم با برخی قطعات بزرگتر از حد معمول است که توجه را می طلبد.

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

در اینجا مواردی که در طراحی این ماه ترند شده است:

1. ناوبری یکپارچه

سبک‌های پیمایش چسبنده – که اغلب در یک جعبه در امتداد بالای صفحه لنگر انداخته‌اند – برای مدتی غالب بوده‌اند. (و دلیل خوبی دارد. آنها تقریباً در هر موردی کار می کنند.)

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

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

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

Fervent Digital کاری را انجام می دهد که به ندرت دیده می شود – سمت راست، ناوبری عمودی که در تصویر اصلی ادغام شده است. لمسی از تعامل با دایره شناور گسترده و خطوط نازکی که از مسیریابی متحرک می شوند به شما کمک می کند تا انتخابی برای تعامل داشته باشید. در اسکرول، همه چیز به طور منظم در منوی همبرگر در همان مکان عمومی قرار می گیرد.

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

2. بزرگ، تایپوگرافی تعاملی

ما عاشق نوع بزرگ هستیم (و نمی توانیم دروغ بگوییم)!

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

در اینجا سه ​​نمونه آورده شده است که ما دوست داریم به شما کمک کنیم در مورد اینکه چگونه ممکن است سعی کنید آن را عملی کنید فکر کنید.

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

Full Circle این فرصت را به شما نمی دهد که به چیز دیگری غیر از نوع فکر کنید. حروف بزرگ و سفید روی صفحه متحرک می شوند و پس زمینه رنگارنگ در حرکت ثابت باقی می ماند. همچنین یک انیمیشن اسکرول کوچک برای کمک به تجربه سطح بعدی طراحی وجود دارد.

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

3. سبک های چاپ دیجیتال

Overprint یکی از آن تکنیک های طراحی چاپ است که علاقه بصری زیادی را ارائه می دهد. هنگامی که به صورت آنلاین تکرار می شود، می تواند تأثیر مشابهی داشته باشد.

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

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

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

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

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

نتیجه

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

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