Уеб дизайн Тенденции за 2018: Пълно ръководство за дизайнери

web-desigДосега 2018 е забележителна година за тенденциите в уеб дизайна. Виждаме, че годините на дизайнерската еволюция най-накрая се оживяват в тенденции като дизайнерски системи и тактилен дизайн, както и забавни и енергични стилове като завръщането на ретро вариантите. Сега повече от всякога е от решаващо значение да се обмисли какво се случва с уеб дизайна и какво ще продължи да се случва в бъдеще.

В тази статия ще обсъждаме 3 тенденции в уеб дизайна, които оказват най-голямо влияние върху 2018 г., като се започне от тази, която се очертава като нова необходимост в уеб дизайна.

  1. Компонентни системи за дизайн

Ако вашата фирма все още не е реализирала дизайнерска система, шансовете и са през следващите няколко години. Според последния от 2017-18 г. доклад за индустрията UX, 67% от анкетираните понастоящем изграждат своите системи за дизайн, ако нямат такива.

Има и добра причина за техния успех. Дизайнерските системи са естествената прогресия на ръководствата за стил и библиотеките на моделите, но с много повече, за да задоволят нуждите на съвременните компании.

Какво представлява дизайнерската система?

Системата за проектиране включва дизайнерски стандарти, документация и – едно от централните й предимства – инструментариум на UI с модели и кодове. Системите за проектиране имат за цел да осигурят последователност във всяка от продуктите на организацията и дори в самите продукти и да използват оптималните дизайнерски решения във всяка ситуация.

Както казва Нейтън Къртис, “дизайнерската система не е проект, а продукт, обслужващ продукти”.

Тъй като някои от тези области могат да се променят, дизайнерската система е “жив документ”, непрекъснато се актуализира, когато се появят нови или по-добри решения.

Какво прави дизайнът на практика? Нека да разгледаме системата за дизайн Polaris, използвана от Shopify. Те разбиват дизайнерската си система в четири области:

Принципи на продукта: Изявления за мисии и подходи към дизайна на продуктите, като поставяне на търговец на първо място и акцент върху достъпността.

Писмено съдържание: Ръководство за стил за цялото писмено съдържание, включително избор на граматика / правопис, глас и тон, както и общи насоки като целеви нива на четене.

Визуални свойства: Всички визуални неща: цвят, типография, указания за изображения, икони, представяне на графики и др.

Компоненти: Нит-пясъчни, покриващи дизайнерски модели, техните правила за използване и бърз код.

Системата за дизайн Polaris на Shopify.

Как да създадете система за проектиране

Можете да създадете своя собствена дизайнерска система, като следвате тези 7 стъпки.

  • Създайте инвентаризация на потребителския интерфейс: Прегледайте всичките си продукти / уеб сайтове и избройте всички използвани дизайнерски модели. Коригирайте всички несъответствия, с които се сблъсквате.
  • Получете подкрепа от организацията: представете своите открития, за да получите всички останали на борда. Той помага да се оцени броят на работните часове за проектиране и инженеринг, които се губят при излишна работа, както и да се посочи колко по-рационални продукти могат да подобрят резултатите от NPS.
  • Установяване на принципите на дизайна: Какви са принципите, които управляват вашата компания? Консолидирайте отговорите в главния списък.
  • Изградете цветовата палитра: Стандартизирайте цветовата си палитра с точни цветови кодове и съгласувайте универсална конвенция за наименуване
  • Изграждане на типографската скала: Фина настройка на размера на шрифта,  височина на линиите и т.н. и установяване на конкретни правила за показване на текст.
  • Внедрете икони и други стилове: Прегледайте първоначалния инвентар на потребителския интерфейс и пренесете избраните икони и дизайнерски решения.
  • Започнете да изграждате първите си модели: Одитирайте библиотеката с шаблони, за да изберете тези, които най-добре отразяват вашата фирма, вашите продукти и вашите клиенти.

Имайте предвид, че дизайнерската система никога не е напълно завършена. Актуализирайте периодично и внимавайте за области, които могат да бъдат подобрени

  1. Полигонални форми и геометрични слоеве

Една от най-различаващите се тенденции в дизайна на 2018 г. се фокусира върху геометрични теми, по-специално върху полигонални и многослойни форми. Вероятно вие ще разпознаете този стил, когато го видите, но за задаване на точна дефиниция върху него,това е многоъгълник като всяка затворена форма е с прави линии, обикновено с 3-5 страни. Тази тенденция включва всеки плаващ триъгълник и квадрат, които виждате, но и оригинални форми, които отговарят на определението.

Стилът се съсредоточава основно около геометрията, с форми (регулярни и неправилни) или основни геометрични модели (решетки, равнини). Нека да разделим нейните специфични компоненти:

Обикновена геометрия

Вместо да запълва целия екран, много компании като ESPN избират по- прости и обикновени форми. Това може да донесе други по-фини ползи; например, наклонените форми на ESPN над влиянието върху естествения визуален поток създават по-динамичен екран като цяло.

Смели линии, за да привлечете внимание

Линиите също са геометрия, така че подчертаването им също се вписва в този стил. Когато се използват правилно, големите и смели линии могат визуално да променят екран или да привлекат вниманието към допълнителното изображение.

Когато използвате дебели линии, искате да обърнете внимание както на цветовете, така и на точките на пресичане. Цветът определя къде се обръща вниманието на потребителя, независимо дали привлича вниманието към линиите или далеч от тях. Точките на пресичане по своята същност стават фокусни точки, затова ги използвайте във ваша полза.

 

Ако не искате да се ангажирате с пълна геометрична естетика, можете да използвате тази тенденция за подробности. Полигоните и геометричните слоеве са визуално интересни при всякакви размери, така че те правят страхотни вторични графики или икони на бутони.

  1. Тактилен дизайн

Тактилният дизайн има интересен произход: той се развива от принципите на материалния дизайн, но в същото време модернизира старите тенденции в скуоморфизма от началото на 2010 г.

Накратко, “Тактилен дизайн” прави обектите да изглеждат истински в цифровото пространство. Според думите на ръководството на Google за материален дизайн “материалът се основава на тактилна реалност, вдъхновен от изучаването на хартия и мастило, но технологично напреднал и отворен към въображението и магията”.

Докосващият се дизайн е трудно да се отреже с думи, но като геометричните тенденции, вие ще го познаете, когато го видите. Нека да разгледаме нейните общи компоненти:

Без граници

Подобно на реалния свят няма граници или прозорци; всичко е взето в цялост. Някои елементи -особено текстът – преминават от един елемент или екран към следващ. За да работи това, дизайнерите се възползват добре от пространството, за да могат потребителите да знаят какво могат да кликват и до къде ще ги отведат. Ето защо често виждате достатъчно негативно пространство (бяло пространство).

Многослойният дизайн

Точно като материалния дизайн, тактилният дизайн включва няколко слоя, за да създаде по-реалистичен вид. Това означава, че много от сенките за разпръскване разграничават слоевете и внушават малко повече реализъм.

Целенасочено движение и анимация

“Тактилен Дизайн” предпочита смислено движение в по-сложни анимации само за забавление. Преместването на елементи и анимирането на прехода не само подобрява визуалните ефекти, но и служи за цел и подобрява използваемостта.

Детайлна фотография

Отново поради важността на реализма, „Тактилния дизайн“  използва изключително детайлна фотография, смес от HD качество и близки ъгли. Това е двойно полезно за сайтовете за електронна търговия, тъй като подробните снимки дават на купувачите по-добро разбиране за това, което купуват.

За мен и блога

BEKYAROV.NET има повече от 10 години професионален опит в изработката на уеб сайтове и оптимизация за търсачки.

Запитване за оферта

Направете запитване за изработка на уеб сайта, аз ще се свържа с вас, само в рамките на 2 часа!

Още публикации от блога

Виж всички