Тенденциите в уеб-дизайна идват и си отиват. Някои се задържат за малко по-голям период от време, други се превръщат в нещо ново, а трети – изчезват завинаги.
Какво е приготвила за нас следващата година? Екипът на awwwards.com са изброили основните тенденции в уеб-дизайна и в днешната ни статия ще Ви запознаем с техните съображения.
Веднага Ви предупреждаваме да не очаквате някаква революция. Основните тенденции, които задават тона от 2015 г., ще продължат да доминират.
В последно време сме свидетели на нарастващата популярност на адаптивния дизайн. И това не е просто каприз на дизайнерите – така се случват обстоятелства, че трябва да се направи всичко за да може сайтът да изглежда оптимално добре на мобилните устройства.
Другите тенденции плавно се появяват от основните и най-важни елементи. Нека ги разгледаме в детайли.
Разпространението на UI шаблоните
Един от страничните ефекти на адаптивния дизайн е, че всички уеб-сайтове започнаха да си приличат един с друг. Но за това е виновен не само респонсив дизайнът. Към това също така положи ръка и изграждането на WordPress базираните сайтове и бързо разрастващия се пазар на готовите шаблони.
Но това не е непременно нещо лошо. Всъщност, начинът, по който използваме Интернет се промени и това доведе до тази популярност на шаблоните, които се проектират с общ потребителски интерфейс. Няма реална причина за изобретяване на велосипеда. Шаблонният интерфейс трябва да се дава на потребителите с добър опит, да бъде прост и разбираем.
Ето няколко модела, с които трябва да сте запознати:
– хамбургер-меню. Този модел е много критикуван, но широкото приложение прави функцията му лесно разпознаваема от потребителите.
— регистрацията на акаунт днес се извършва по два начина: или с помощта на бутона за регистрация, или чрез социалните мрежи. Тези два варианта са удобни и лесно разбираеми от потребителите, избавяйки ги от излишни и объркващи действия.
— безкрайното скролиране. Разположението на всички важни елементи в горната част вече е неактуално. Освен това, почти всички са свикнали със скролинга, благодарение на мобилните устройства. Техниката работи особено добре при сайтовете, които искат да привлекат потребители чрез истории, така че и вие все още можете да имитирате сайт с много страници, разделяйки страницата на зони.
– Карт-дизайн. Появявайки се за първи път в Pinterest, карт-шаблоните незабавно се разпространиха в Интернет. Всичко се дължи на това, че картите позволяват бързото и лесно сканиране на информацията и намирането на нужното. Всяка карта представлява единна концепция. Такъв дизайн позволява много по-лесното организиране на съдържанието за оптимално изобразяване върху различните устройства.
— големи фонови изображения. HD изображенията са едни от най-бързите начини, за грабване вниманието на потребителя. Благодарение на достиженията в пропускателната способност и компресирането на данните, потребителите няма да страдат от бавното зареждане.
Както виждате, всички тези тенденции, които видяхме през миналата година, остават актуални.
Да продължим по-нататък.
Богата анимация
Анимацията се използва все повече и повече, а това прави потребителския опит по-интерактивен и интересен.
Въпреки това, не можете просто да я използвате навсякъде, където поискате. Анимацията трябва да се използва за определени цели, а не просто за украшение.
Анимацията може да се разглежда от гледна точка на две групи:
Мащабна анимация. Тя се използва като основен инструмент за взаимодействие, има голямо влияние върху потребителите и включва в себе си ефекти, като паралакс-превъртане и изскачащи прозорци.
Малки анимации. Те включват в себе си броячи, ховър-инструменти, зареждащи барове и не изискват никаква потребителска манипулация.
Ние ще опишем 7 от най-популярните методи за анимация:
— анимация при зареждане. Тя се използва за да се ободри времето за изчакване до зареждането на страницата. Като цяло, този тип анимации са популярни в страниците с плосък дизайн, изпълнени в минималистичен стил.
Правете нещата по-прости и не използвайте допълнителен звук (въпреки, че е модерно в последно време). Не забравяйте, че тези детайли трябва да отговарят на цветовата палитра и общия стил на вашия сайт.
– навигация и меню (НЕ скролинг).
Скритото меню става все по-популярно, особено в онези случаи, когато може да се използва, за да се спести място на екрана.
— hover-анимации – широко се използват за създаване на обратна връзка, когато курсора на мишката е върху обекта.
— галерии и слайдшоу – това е ефективен начин да се демонстрират няколко изображения, без да се налага потребителя да прави презареждания.
– анимация на движението. Очите ни, естествено се обръщат към движението, което го прави идеалното средство за привличане на вниманието на потребителя. Движението също може да помогне и при визуалната йерархия, добавяйки интерес и интрига.
— превъртане. Плавното превъртане зависи от анимацията и дава допълнителен контрол на потребителя, който може да определи темпото, с което се разгръща съдържанието на сайта.
— фонова анимация (видео). Обикновеният анимиран фон може да бъде добавен в дизайна на сайта, но трябва да го използвате в умерени количества, тъй като в противен случай може много да отвлича вниманието на потребителя.
Микровзаимодействия
Микровзаимодействията постоянно са около нас, като се започне с изключването на алармата на телефона сутрин.
Всяка от тях е направена без задна мисъл. Напълно вероятно е да сте започнали деня си с микровзаимодействие. Изключвайки алармата на мобилния си телефон, вие сте ангажирани с потребителския интерфейс само за момент. Това все повече и повече се прилага в програмите и устройствата, които използваме.
Микровзаимодействията трябва да се случват естествено и почти незабележимо за потребителя. Те са важна част от почти всеки цифров дизайн. Вие на практика не можете да създадете уеб сайт или мобилно приложение, което не включва някакъв елемент, с който потребителя трябва да си взаимодейства.
Материалният дизайн: богата алтернатива на плоския дизайн
Целта на материалния дизайн е да се създаде чист и модерен дизайн, който се фокусира върху UX.
Със своя минималистичен изглед, материалният дизайн има много общо с другата нарастваща тенденция – плоската конструкция. Но той използва дълбочина и сянка, което го прави по-интересен и богат.
Досега сме виждали, че повечето „материални“ проекти ограничават дизайна до приложението. През тази година материалният дизайн ще се прилага навсякъде в сайтовете.
Респонсив дизайн
Респонсив уеб дизайнът стана изключително популярен в последните години, благодарение на нарастващото използване на мобилен Интернет.
Може с увереност да се каже, че респонсив дизайн няма да ходи никъде в близко бъдеще, тъй като той е сравнително прост и евтин за бизнеса начин, за да изгради напълно функционален мобилен сайт.
Респонсив уеб дизайн отлично се сработва с картовите и плоски конструкции.
Плоският дизайн остава и през тази година
Плоският дизайн е много популярен в последно време и прекрасно се съчетава с другите тенденции, като минимализмът, респонсив и материален уеб дизайн.
Гледайки напред, може да се предположи, че вероятно през 2016 година ще видим следните тенденции в плоския дизайн. На преден план:
Дългите сенки. Те допринасят за по-голямата дълбочина в плоския дизайн.
Ярките цветови схеми. Популярните шаблони карат много дизайнери да започнат да използват по-ярки цветове в своите проекти.
Проста типография. Простите шрифтове правят текста по-четлив и разбираем в плоския дизайн.
Призрачни бутони. Те остават функционални, съвсем без да нарушават цялостния стил.
Минимализмът дава възможност за създаване на лаконичен интерфейс и премахване на всичко излишно.
Вместо заключение
Както виждате, следващата година няма да ни донесе почти нищо ново. Същите тенденции, които наблюдавахме през последните няколко години, остават в сила. Може би се наблюдават някои нови форми – но основните трендове остават същите.