15 روند طراحی وب برای تماشای سال 2020


متوسط ​​عمر یک وب سایت سه سال است. و عناصر طراحی – مانند رنگ و تایپوگرافی – غالباً بیشتر از این به روز می شوند. به همین دلیل همگام شدن با روند طراحی وب بسیار مهم است.

انجام این کار به شما امکان می دهد تا امروز به طراحی خود ترفندهای کوچکی بدهید تا فردا به روز نشود. بنابراین به نظر شما کدام روند طراحی وب برای امسال باید مورد توجه باشد؟

این راهنما به شما کمک می کند تا یک طرح طراحی نقطه ای برای سال 2020 ایجاد کنید!

1. عناصر طراحی با هم همپوشانی دارند

روند طراحی وب

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

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

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

روند طراحی وب

آن را امتحان کنید: ویجت کارت راهنمای گردشگری

2. زیبایی شناسی فوق العاده حداقل

روند طراحی وب

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

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

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

روند طراحی وب

آن را امتحان کنید: Vinero تم Portfolio بسیار تمیز و حداقل وردپرس

3. تعامل سه بعدی

روند طراحی وب

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

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

این یک راه خوب برای این است که کاربران بتوانند برای مدت طولانی تری در طراحی بمانند و جلوه ای ماندگار را به وجود آورند. بیشتر از این روند با تصاویر 3D دلخواه استفاده کنید یا با قطعات “کیت” مخلوط کنید و مطابقت داشته باشید تا فقط احساس مناسبی را برای پروژه خود ایجاد کنید.

روند طراحی وب

آن را امتحان کنید: پسران 3D Pixelate

4. تایپوگرافی که شامل برنامه ها و برنامه ها است

روند طراحی وب

ترکیبی از تایپوگرافی پر و رئوس (اغلب در همان نوع) در اثر کامل است.

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

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

روند طراحی وب

آن را امتحان کنید: Typeia Visia Duo (طبیعی و رئوس مطالب)

روند طراحی وب

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

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

روند طراحی وب

آن را امتحان کنید: افزونه پیمایش صاف برای وردپرس

6. خیلی سریف ها

روند طراحی وب

تایپیوگرافی سریف – که زمانی در وب به عنوان “غیرقابل خواندن” خوانده می شد – در همه جا ظاهر می شود. از سری های کوتاه و ساده گرفته تا شرح حروف با نوازش و دم های طولانی تر ، این نوع برای خواندن طراحی شده است.

بیشترین کمک کننده به این روند ممکن است صفحات نمایش با وضوح بالا (و تسلط آنها در بازار) باشد. هیچ تار و تحریفی با این نوع چهره ها وجود ندارد.

سری های تقریباً هر سبکی می توانند به زیبایی کار کنند ، از جمله سبک های مدرن و انتقالی به اسلب. سریها برای متن نمایش و همچنین کپی بدن مناسب هستند.

روند طراحی وب

این را امتحان کنید: خانواده قلم آرون سریف

7. فضای سفید اغراق آمیز

روند طراحی وب

سبک های مینیمال با فضای سفید اغراق آمیز در طرح ها حتی به حداقل می رسند.

یکی از دلایل محبوب بودن فضای سفید این است که می تواند به جلب توجه به قسمت خاصی از طراحی کمک کند – فضای اشغال شده توسط چیزی و نه هیچ چیز.

فضای سفید همچنین دارای زیبایی کلاسیک و زیبایی است که به راحتی می توانید تعداد پروژه ها را تنظیم کنید.

8. میکرو انیمیشن

روند طراحی وب

با تشکر از همه آن دسته از gif های جالب در استوری های اینستاگرام ، وب سایت ها میکرو انیمیشن های بیشتری را در قالب جیف های سبک برچسب ارائه می دهند.

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

روند طراحی وب

آن را امتحان کنید: افزونه روتاتور ساده متن WordPress

9. همه چیز ویدئو

روند طراحی وب

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

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

روند طراحی وب

آن را امتحان کنید: الگوی نمایش پرده ای نمایش عکس / فیلم

10. حباب و شکل های حباب

روند طراحی وب

حباب ، حباب و شکل های دیگر “ارگانیک” جای سبک های هندسی بیشتری دارند که در چند سال گذشته بر طراحی حاکم شده اند. این تغییر شکل بخشی انیمیشن جالب و احساس بخشی است. (پروژه ها کمی سست تر از آنها هستند.)

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

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

روند طراحی وب

این را امتحان کنید: پس زمینه های موج دار

11. تصاویر سه بعدی

روند طراحی وب

این سبک به قدری جذاب است که شرکت های بیشتری در حال راه اندازی این سبک از آثار هنری هستند.

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

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

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

روند طراحی وب

12. تقارن کمتر

روند طراحی وب

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

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

این کار را با متن و رنگ مانند مثال بالا انجام دهید یا از تصاویر و فضای غیر متمرکز مانند تصویر زیر استفاده کنید.

روند طراحی وب

13. نکات مربوط به هوش مصنوعی

روند طراحی وب

کمک های هوش مصنوعی و چت بابات به شکلی متداول است که ممکن است آنها را نادیده بگیرید. اما آنها باهوش تر می شوند و امسال از همیشه شیوع بیشتری پیدا می کنند.

برخی از این رباتها آشکار است ، مانند مورد فوق. برخی دیگر تصاویر “افراد واقعی” و دیگران سبک کارتونی هستند. موضوع مشترک این است که شخصی (یا چیزی) آنجاست که در همه زمان ها به کاربران کمک کند.

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

روند طراحی وب

این کار را امتحان کنید: دستیار WP AI

14. آرمهای پخش شده

روند طراحی وب

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

در هر صورت ، آرم های ساده در همه جا هستند.

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

روند طراحی وب

آن را امتحان کنید: الگوهای لوگو

15. دکمه های بزرگ

روند طراحی وب

برای سهولت در استفاده کاربران تلفن همراه ، دکمه های بزرگ در سبک های سازگار با انگشت شست نیز پیش فرض کلیه نسخه های وب سایت ها هستند. این شامل همه چیز از تماس گرفته تا اقدام به ناوبری است.

همه این موارد را می توان به راحتی با انگشت شست یا انگشت بدون تعامل با عنصر اشتباه به راحتی ضربه زد.

این دکمه ها غالباً در رنگ های مختلف و یا سبک های کارت ارائه می شوند تا بتوانید تشخیص دهید که چه عملی قرار است رخ دهد و چه عناصر با لمس کاری انجام می دهند.

در مثال بالا توجه داشته باشید که هر جعبه یا کارت یک دکمه غول پیکر است. و در نسخه موبایل ، هر کارت در یک پشته عمودی قرار می گیرد.

روند طراحی وب

آن را امتحان کنید: الگوی موبایل Google AMP

نتیجه

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

روند کار را با ابزار طراحی مانند مواردی که در این مقاله ارائه شده است ، سرعت بخشید تا بتوانید بدون نگرانی در روند خود بمانید!



Source link

آموزش طراحی سایت

برچسب ها

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

0 دیدگاه در “15 روند طراحی وب برای تماشای سال 2020”

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *