” от Джон Мур Уилямс, ръководител на стратегията за съдържание в Webflow.
Краят на настоящата година е съвсем близо и всеки уеб дизайнер поне веднъж си е задавал въпроса важен въпрос: Какво ще определи уеб дизайна през идващата 2017 г.? Реших да намеря отговора на този въпрос и попитах дизайнерите на WebFlow какви тенденции смятат, че ще доминират през следващите 365 дни. Дадох и свои коментари към техните мисли.
Първо, нека чуем мнението на водещия дизайнер на Webflow Sergie Magdalin.
1. Дизайн, управляван от съдържание
„Подреждането на дизайнерските елементи в рамките на дадена структура трябва да бъде такова, че читателят да може лесно да схване основната идея, без да намалява неговата или нейната нормална скоростчетене”-Херман Цапф
През последните няколко години се наблюдава драматична промяна в мисленето за ролята на дизайна в бизнеса. Преди това дизайнът се разглеждаше като последната стъпка в процеса на създаване на обект: дизайнерът-магьосник идва накрая и поръсва магически прах върху нашия продукт, за да го направи по-добър от конкуренцията.
Беше много интересно да се наблюдават метаморфозите, които се случват с приоритетите на развитие.
И най-красивото в тези метаморфози беше преходът към модел, при който съдържанието отново стои начело на масата. Дизайнерите по целия свят осъзнаха, че потребителите посещават уебсайтове предимно за съдържанието, било то кратки туитове, дълги специализирани статии или най-новите интернет мемета. Крайната роля на дизайна е да представи съдържанието по най-атрактивния, разбираем начин и да получи най-добри резултати от него.
Това е една от причините за преминаването от „скевоморфен“ дизайн (където елементите са изобразени възможно най-подобно на техните двойници в реалния свят) към плосък, минималистичен дизайн. От тези съображения Google създаде Material Design.
Разбира се, както гласи третият закон на Нютон, за всяко действие има еднакво силна реакция. Много дизайнери смятат, че модата на плоския дизайн е „убила“ самия дух на дизайна. Очакваме този дебат да продължи през следващата година, но фокусът ще остане върху съдържанието – основата на всяка дизайнерска работа.
2. Висококачествено взаимодействие между дизайнери и разработчици и дизайнери помежду си
Значението на дизайна при оформянето на бизнеса нараства, така че все повече се набляга на дизайнерите, които работят заедно с техните колеги дизайнери и колеги разработчици.
Тази загриженост за взаимодействието с дизайнерите е възникнала отчасти поради огромния обем мобилни и уеб приложения, които се разработват днес. В допълнение към факта, че такива гигантски корпорации като Google, Facebook, Twitter и LinkedIn изискват титаничната работа на дизайнерски екип с абсолютно различни страни, дизайнерите трябва винаги да са на една и съща страница един с друг. Това означава, че има нужда от по-голяма комуникация по проекта и как най-ефективно сътрудничество.
За да се улесни тази задача, бяха създадени много инструменти, от екипни шаблони и дъски в Team на Webflow до графичен редактор Figma интерфейси, показващи промени в реално време. Сигурен съм, че през 2017 г. тези платформи ще бъдат подобрени и допълнени.
Ако говорим за взаимодействието между дизайнери и разработчици, се обръща много внимание важен процеспрехвърляне на работа. Например, вместо да изпращате тежки и обемисти статични изображенияДизайнерите вече могат да споделят рендирани на живо макети с инструменти като InVision, Marvel, UXPin.
Карсън Милър прецени това в неотдавнашната си статия „Бъдещето на дизайна на предния край“ на TechCrunch:
„Рано или късно инструментите за създаване на дизайни и шаблони за дизайн напълно ще заменят разработката отпред. Можете лесно да създадете висококачествена основа за всяка от вашите рамки, без да се налага да пишете код на ръка.“
3. Опростен процес от дизайнер към разработчик
Инструментите за дизайн и създаване на прототипи, споменати по-горе, ви позволяват да визуализирате различните етапи на сътрудничество чрез визуализации, които варират от анимирани Keynote файлове до напълно функционални уебсайтове. Този метод за споделяне на работен материал намалява времето за реакция в рамките на проекта, като по този начин повишава качеството на дизайна, увеличава скоростта на екипа за разработка и намалява възможността за разочарование от резултата. Освен това подобрява взаимодействието с клиентите. Например за много потребители на WebFlow срещите с клиенти се превърнаха в пълноценни работни срещи, където дизайнерите могат бързо да реализират идеи и всеки може да тества идеите си почти веднага.
Тенденциите в уеб дизайна през следващата година според продуктовия дизайнер Гаджи Хархаров:
4. Голямо, силно заглавие
Тъй като светът на уеб дизайна започва да се фокусира върху съдържанието, става все по-често да виждате вдъхновяващи заглавия на уебсайтове със съвпадащи шрифтове, които са толкова големи и удебелени, колкото съдържанието им.
Партньорите на #MadeInWebflow Heco
Както можете да видите от примерите, „голям“ и „удебелен“ не се отнасят само до описанието на шрифта. по-бързо, ние говорим заче значителна част от началния екран е посветена на просто, но силно и самостоятелно изявление за продукта или услугата. Такова заглавие трябва да съдържа същността и да бъде разбираемо за всеки посетител, като избягва ненужната помпозност (добре, фразата „Проектирайте невъзможното“ може да звучи твърде силно).
В днешната натоварена, претоварена с информация среда, кратки, мощни изявления като тези работят добре за всяка марка.
5. Комплексно маркиране, което идва от основите на графичния дизайн
Ако искаме да предвидим развитието на уеб дизайна (от поне, неговата визуална страна), трябва да се обърнем към историята на развитието на графичния дизайн.
През последните няколко години оформлението на уеб страниците беше ограничено до CSS, но новите модули като Flexbox и CSS мрежа(който ще бъде пуснат през март 2017 г.), ще ви позволи да реализирате най-смелите идеи в уеб маркирането.
Нашите основната задачасега - за да разберете как новите възможности за оформление на мрежата на блоковете трябва да работят в рамката адаптивен дизайн.
Ето няколко примера какво да очаквате (ако приемем, че имате браузър, който поддържа CSS Grid, като Firefox Nightly, Safari Technical Preview или Chrome Canary):
Лаборатория за експериментално оформление Джен Симънс
Обърнете внимание на стила на основния блок - ясна препратка към историята на графичния дизайн.
Решетка по пример
Можете да видите още примери на уебсайта.
6. Още SVG
SVG (мащабируема векторна графика) Векторна графика) То има повече ползиза уеб дизайнери и разработчици от традиционните формати на изображения като JPG, PNG или GIF.
Основните предимства на SVG са описани в самото име на формата - мащабируемост и вектор. За разлика от растерните и пикселните формати, SVG изображенията са съставени от вектори – математически описания на формата на обекта. Това означава, че SVG не зависи от разделителната способност и изображенията в този формат ще изглеждат страхотно на всеки екран и устройство. Няма нужда да се притеснявате, че изображенията върху ретината са замъглени.
Но това не е всичко. SVG е известен и с това, че не изисква изпращане на HTTP заявки. Ако някога сте проверявали скоростта на зареждане на уебсайта си, може би сте забелязали, че тези HTTP заявки наистина могат да забавят сайта ви. При SVG няма такъв проблем.
7. Инструменти за базиран на правила адаптивен дизайн
Отзивчивият дизайн напълно промени начина, по който гледаме на уеб приложенията и ги създаваме.
Но, колкото и да е странно, принципът на работа на дизайнерските програми изобщо не се е променил. Повечето от тези инструменти работят по следния начин: трябва да създавате подобна страница отново и отново за различни устройства и резолюции. В индустрия, която изисква бързо генериране на идеи, бързо развитие и бърз старт, такава загуба на време е просто недопустима.
Очакван нова вълнаинструменти за проектиране (като Figma), базирани на „правила“, които коригират външния вид на сайтовете на различни екрании устройства, като по този начин се намалява броят на повтарящите се дизайнерски действия. Такива инструменти се основават на пространствените връзки на елементите и докато променяме размера на екрана или устройството, те се стремят да поддържат тези връзки, като променят размерите на елементите и подложката между тях.
Между другото, днес има подобни инструменти за оформление на уебсайт не само за дизайнери, но и за обикновени потребители. Например TruVisibility.com - платформата адаптира създадения дизайн точно по определени правила, според които оформлението и размерите на елементите се напасват към размера на екрана. Всичко, което остава, е да направите няколко корекции, за да сте сигурни, че уеб страницата изглежда така, както трябва на устройствата. Потребителят не трябва да създава отново версията за мобилни устройства итова му спестява много време.
Тенденции в дизайна за 2017 г. според Райън Морисън, старши графичен дизайнер.
8. Повече ярки цветове
Когато ерата на минимализма и брутализма започна в уеб дизайна през 2016 г., дизайнерите се опитаха да добавят повече индивидуалност към работата си, без да надхвърлят модните стилове. И има поне няколко случая, в които ярки и смели цветове са използвани много успешно.
Разгледайте новия сайт на Asana с пръскане на цвят:
Нова икона Приложения на Instagramполучи много критики, но този редизайн несъмнено освежи марката:
Всичко, което Stripe изисква, не изисква отделен изглед:
Както можете да видите, това не са само ярки и смели цветове. Градиентите също се завръщат в стил, смесвайки и замъглявайки цветовете в нюанси, напомнящи за обедно небе или пламтящ залез. Това е един вид възраждане на натурализма с ярки цветовеи смели градиенти и аз лично очаквам с нетърпение да видя повече от този вид работа през 2017 г.
Въпреки че може би си струва малко да намалите яркостта? Наблюдаваме те, Асана.
9. Повече акцент върху анимацията
Анимираните елементи се играят дълго време ключова роляв уеб интерфейса и тази тенденция ще продължи и през 2017 г. Всъщност, докато дизайнерите имат достъп до инструменти за разработване на завладяващи анимации, ще видим, че тези ефекти стават по-видими и по-сложни.
Тази тема е особено важна, защото създаването на анимация става все по-лесно всеки ден. На Конференцията за дизайн и съдържание през 2016 г. гуруто на анимацията Вал Хед подчерта, че когато проектират анимирани елементи, дизайнерите трябва да имат предвид целите и нуждите на марката, за да постигнат ефекта, който създателите на съдържание очакват. Ако този съвет бъде взет под внимание, анимацията ще изпълнява задачи, които са значими за марката, а не просто ще предизвика мигрена у потребителя.
10. Необичайни маркировки
2016, както и предишните няколко години, е известна с безкрайните дискусии, че уеб дизайнът или умира, или губи духа си.
Тези, които се опитват да убедят всички, че уеб дизайнът е мъртъв, явно преувеличават. Мнозина продължават да търсят начини да представят съдържание на потребителите по нови начини. Един от най-примамливите начини е да разбиете системата и да игнорирате обичайното оформление на мрежата, продиктувано от правилата на адаптивния дизайн.
Методът на „счупено“ маркиране включва елементи, надхвърлящи щателно подравнената мрежа. Такива техники понякога дори могат да изглеждат неприятни за окото. Например:
Сблъскващи се едни с други текстове и изображения:
Текстове и изображения, разпръснати (привидно) случайно из страницата:
Това беше първата част от превода на статията „18 тенденции в уеб дизайна през 2017 г.“. Съгласни ли сте с мненията на експертите на Webflow? Какъв вид уеб дизайн смятате, че ще бъде на мода през следващата година?
През 2016 г. много компании преработиха уебсайтовете си, намалявайки броя на опциите за навигация. Тази тенденция ще продължи и през 2017 г.
Менютата за заглавки на страници, които преди това включваха 5-7 опции, сега ще предлагат 3-4 опции.
По-малкото опции улесняват търсенето на потребителя необходимата информацияи избягва ситуацията на „парализа на избора“.
Добър пример за нов подход е Ikea. В екранните снимки по-долу можете да сравните старите и нова версияуебсайт на компанията.
Стара версия:
Нова версия, пусната през 2016 г.:
- Отказ от менюто за хамбургери
Менюто за хамбургер не дава на потребителя представа за дълбочината на сайта или приложението. В резултат на това той остава дезориентиран.
Spotify вече изостави менюто за хамбургери в своето приложение. Още компании ще последват примера му през 2017 г.
- Дуотонове
Използването на дуотонове прави дизайна на уебсайта минималистичен и ви позволява да задържите вниманието на потребителя върху основното съобщение или навигация.
През 2017 г. повече от активно използванедуотонове вместо пълноцветен фон.
- Тактилен дизайн
Недостатъкът на паралаксното превъртане е, че забавя скоростта на зареждане на страницата.
През 2016 г. анимацията се разглежда като обещаваща тенденция. Тази година обаче фокусът на разработчиците е върху производителността. От тази гледна точка паралакс скролирането не е най-оптималното решение.
- Смислено действие
Един от основните принципи на материалния дизайн е „смислено действие“. Google вярва в това „действието трябва да бъде смислени и подходящи, служат за привличане на внимание и поддържане на приемственост".
Приложение Tumblr – добър примерприлагане на този принцип. Спечели награда през 2016 г Материален дизайнза анимация.
- Избягвайте стокови изображения с ниско качество
Фирмените уебсайтове трябва да канят потребителите да си взаимодействат и да отразяват ценностите на бизнеса. Вече няма място за некачествено и скучно стокови изображения. Като този:
- По-малко приложения, повече PWA
PWA технология (прогресивна Уеб приложения) позволява на сайта да работи като приложение. Включително офлайн. Вече се използва от такива големи публикации и компании като The Washington Post, Airberlin и Flipkart. Тази година популярността на технологията ще нарасне.
- Google Fonts
Google създаде библиотека с шрифтове с отворен код програмен кодпрез 2010 година. През 2016 г., докато продължава да работи върху материалния дизайн, компанията също така подобри своята услуга Google Fonts. В резултат на това прегледите на шрифтове станаха по-бързи и персонализирането им по-лесно. Разделът „Представени“ съдържа шрифтове, които се съчетават добре с материалния дизайн.
През 2017 г. още повече уеб дизайнери ще работят с Google шрифтове.
- Минимализъм
Тази тенденция съчетава много други тенденции, споменати по-горе. Минимализмът означава акцент върху производителността (скорост) и използваемостта. В рамките на този подход важна роляТипографията, контрастът и пространството играят роля.
Статията е разделена на две основни области: графики в уеб дизайна и самата разработка, като всеки раздел има свои собствени компоненти.
ТЕНДЕНЦИИ В УЕБ ДИЗАЙНА
И така, ще започнем с тенденциите в уеб дизайна от 2017 г. и какво ни очаква през 2018 г. Какви промени са настъпили в графиката, използването на шрифтове, анимация и видео и т.н.
Графичен дизайн
Тенденцията се счита за модерна - плосък дизайн (Плосък дизайн). Използват се векторни графики с добавяне на растерни графики за подчертаване; примери за такива сайтове са дадени по-долу. Минимализъм и отзивчив дизайн, прост и разбираем за потребителите на сайта.
 |
 |
 |
Векторни изображения
Използването на вектора в уебсайтовете се увеличава; той има ниско тегло, което означава зареждане в ходпо-бързо. Тъй като векторът може да се разтяга и компресира по желание, вашите графики винаги ще изглеждат страхотно на екрана на всяко устройство при всяка резолюция. За векторни изображенияизползвайте формат SVG (Scalable Vector Graphics). Мнозинство векторни редакториви позволяват да записвате в този формат и няма нужда от специфичен софтуер.
Безцветни - призрачни копчета
Преминаването към минимализъм повлия и на дизайна на бутоните. Използването на този тип бутони в дизайна на уебсайтове се увеличава. Такива бутони не претоварват сайта и изглеждат оригинални. Нашият уебсайт също използва такива бутони в долната част на блока със статии.
 |
 |
 |
Кликнете върху изображението, за да го увеличите
Стилна 3D графика
3D графиките също набират скорост през новата година. 3D композициите се съчетават добре с плоския дизайн и го допълват, придавайки му повече дълбочина и подчертавайки модерността.
Кликнете върху изображението, за да го увеличите
Анимация, видео и интерактивни обекти
Уебсайтовете започнаха да използват живи снимки и фонове, това определено привлича вниманието и придава на сайта известна динамика. Увеличава се и използването на видео и всякакви анимации за взаимодействие с потребителите.
Сложни мрежи
Още в края на 2016 г. се появи тенденция за уебсайтове, използващи динамични, сложни мрежи с авангарден дизайн.
Геометрия в различни форми
Използване геометрични форми различни видовеза текст, информационни подчертани блокове и фонове. Правоъгълниците и квадратите са чудесни за подчертаване на важни неща.
 |
 |
 |
Кликнете върху изображението, за да го увеличите
Модни цветове
Тук кой какво харесва и какво по дефиниция е подходящо за всеки проект. Единственото, което може да се каже е, че цветовете стават по-живи. В комбинация и добър контраст е по-удобно за потребителя да навигира в сайта и да възприема информация.
Безусловна адаптация
Вече няма нужда да казваме, че уебсайтовете трябва да бъдат направени удобни за мобилни устройства. Адаптирането е абсолютен фактор за съвременния уеб сайт. Много е важно да обмислите дизайна мобилна версия, така че всички важни елементи да са на една ръка разстояние от потребителя и той интуитивно да разбира навигацията на сайта.
Споровете не стихват дали е по-добре да се сложи икона или надпис. Резултати от тестове на 240 000 потребители на мобилни устройства.
Мобилни алтернативи на менюто
Ако в сайта няма много секции, тогава е по-добре да използвате раздели като меню или да добавите бутон към тях в края в падащо допълнително меню.
Гъвкаво динамично меню
Решението се крие в меню, което се настройва спрямо ширината на екрана, показвайки възможно най-много раздели и скривайки това, което не е включено в „Още“.
ТЕНДЕНЦИИ В УЕБ РАЗРАБОТКАТА
Обмислен дизайн
В разработването на дизайн на уебсайт трябва да участват не само Графичен дизайнер, както и специалисти по промоция и маркетинг. Местоположението на всеки елемент има свое предназначение, за комфортен престой на потребителя.
По-добре е по-малко текст!
Текстовата част на сайта трябва да е максимално стегната и да разкрива предложената тема. Моля, добавете го, ако е възможно технически подробности, като: цени, характеристики и др.
CMS рейтинг
Винаги можете да видите най-новата оценка. Какъвто и вариант да изберете, имайте предвид, че според официални изявления от търсачките, не фундаментална разликана какво се основава вашият сайт? Всеки двигател или рамка ще трябва да бъде модифициран за най-добра функционалноствашият проект.
Нека да разберем какво означава да бъдеш популярен, модерен и модерен в уеб дизайна през 2017 г. За да направите това, нека разгледаме основните тенденции в уеб дизайна. Повечето от тях се скитат от година на година и вече са се превърнали в неразделна част от съвременното изграждане на уебсайтове. Това е особено свързано с развитието мобилни технологии, комуникационни канали и подобрения на устройството. Например тенденция като мобилността на уебсайтове стана задължителна. Комерсиализацията на Интернет също диктува своите строги условия към дизайнерите и уеб разработчиците. В същото време някои тенденции отслабват и стават по-малко популярни, но все още остават доста активни. Появяват се и модни хобита, характерни за кратък период. Например миналата година това бяха икони с дълга сянкаизобразени предмети. Тази година геометричните модели станаха популярни, ние също ще ги разгледаме. Така че, нека го вземем по ред.
1. Мобилен, отзивчив дизайн
Днес, може би, най-важната и задължителна тенденция. Сайтът трябва да изглежда еднакво добре на всички резолюции на монитори, лаптопи, екрани мобилни смартфонии таблетки. Търсачките, между другото, много внимателно следят колко добре е адаптиран сайтът различни устройства, и въз основа на това определят мястото си в резултатите от търсенето. 
2. Активна типография
Това е една от най-популярните тенденции вече няколко години. Големите шрифтове и типографията на сайта имат два компонента. Първо, естетически – красивите линии, извивки и надписи сами по себе си са декорация и декоративен елемент. И второ, това е функционалност - използване голям шрифтможете недвусмислено и категорично да предадете основната идея на посетителя. 
3. Широкоекранно видео
Видеото на цял екран на фона на сайта несъмнено веднага привлича вниманието ни. Това добро посрещанеда заинтересува посетителя. Съвременно развитиетехнологията улеснява вграждането на видео в уебсайт, което означава, че дизайнерите все повече ще използват тази техника. Има обаче едно предупреждение: гледането на видеото е интересно само първия път; втория и третия път става скучно. Следователно тази техника е ефективна само за нови посетители.
5. Синемаграфи
Добра алтернатива на широкоекранното видео и страхотни снимкина фона. Синемаграфите са снимки, в които се появяват малки, повтарящи се движения. Те обикновено се представят в gif формати дават на зрителя илюзията, че гледа видеоклип. Повече за cinemagraphs с голяма сумапримери могат да бъдат намерени в селекцията 
6. Плосък дизайн
Друга силна тенденция последните години. Уебсайтовете, проектирани в плосък цвят, обикновено са чисти и ясни. Но в напоследък, се появи нов тип плосък дизайн - Semi flat. Това е, когато целият дизайн е направен в плосък цвят и само един елемент има сянка, градиент или текстура. По правило този елемент е бутон, на който се придава обем или изпъкналост, за да привлече вниманието на посетителите.
7. Микровзаимодействие на сайта
В днешно време много внимание в уеб дизайна се обръща на микровзаимодействието на функционалността и дизайна на сайта с посетителя. Същността на която е, че посетителят може ясно да види резултата от действието си в сайта, било то корекция потребителски настройки, следване на връзка, потвърждаване на операция, взаимодействие с активни икони, бутони, превключватели, броячи и други елементи.
8. Анимация на обекти
Възможностите на съвременните html5 и css3 ви позволяват да използвате голям арсенал визуални ефектиНа линия. Това прави взаимодействието със страницата по-интересно и вълнуващо за посетителя. Така че през новата година ще видим и най-неочакваните интерактивни микродвижения на обекти, обикновено реагиращи на движение на мишката. Може би ще видим примери за по-сложна анимация.
9. Живи цветови схеми
Популярните модерни цветове от 2017 г. предпочитат яркостта и наситеността. Интересни оригинални нюанси на червено, горчица, жълто, изумрудено, наситено синьо, както и червено, лилаво и шоколад ще помогнат на вашия сайт да се открои и да придобие свой уникален стил. 
10. Превъртане на сайта
Тъй като скролирането на сайта е идеално за мобилни устройства, присъствието му ще бъде значително през 2017 г. Единственото нещо е, че превъртането не оставя място за взаимодействие с потребителя и следователно има известна умора от безкрайно зареждане на съдържание. Може би тенденцията ще се обърне към комбинация от прости контролни елементи с превъртане.
11. Паралакс ефект
Паралаксът е промяна във видимата позиция на обект спрямо отдалечен фон. В уеб дизайна този ефект се използва при превъртане на сайт, когато обектите и фонът се превъртат с на различни скорости, което води до илюзията за триизмерност. Тенденцията е доста стабилна, така че ще видим сайтове с паралакс повече от веднъж.
12. Модулен дизайн
Модулният дизайн или интерфейсът на картата, състоящ се от самостоятелни блокове със значение, е популярен от известно време. Тази тенденция е много добра за мобилни устройства, тъй като блоковете се подреждат добре за всяка резолюция на екрана. Но на големите сайтове те изглеждат доста еднакви и са трудни за йерархизиране и структуриране.
13. Едностранични страници
Едностранични сайтове, целеви страници, целевите страници са станали неразделна част модерен интернет. Можете да прочетете повече за това какво е целева страница в статията и. През 2017 целевите страници ще поставят по-голям акцент върху бутон, призоваващ към действие – поръчка, обаждане, регистрация и т.н. Всичко останало, което отвлича вниманието на потенциалния посетител, ще бъде отрязано.
14. Графична реклама
Бих искал също да отбележа едно нещо, което си спомням за изминалата година и най-вероятно тенденцията ще продължи през 2017 г. Поради комерсиализацията на Runet и растежа на онлайн търговията, търсенето на графични рекламни материали за реклама и промоция се увеличи значително - банери, тийзъри, картички, флаери. 
15. Автоматизация на типични процеси
всичко стандартни решенияи процедурите на уебсайта постепенно се заменят с автоматизирани процеси, което елиминира необходимостта от комуникация със служба за поддръжка или онлайн консултанти. Поради това популярността нараства различни приложенияи разширения. Сега можете да закупите продукт или услуга, да направите поръчка, да запазите час, да запазите места, да преведете пари, да попълните формуляр или да направите тест - всичко това може да стане онлайн с няколко клика на мишката.
16. Инфографика
Графичното представяне под формата на инфографика все още е популярно и търсено. Текстов съпровод красива картинаили икона заедно със стилни дизайнерски елементи правят инфографиката естетически привлекателна. Сравнителните инфографики са особено визуално ясни и интересни – като какво се е случило, какво се е случило, да, не, плюсове и минуси, какво трябва и какво не трябва и т.н. Можете също да използвате инфографика, за да разкажете история стъпка по стъпка или да представите ярко скучна статистика. 
17. Хамбургер меню
Менюто за хамбургер е визуална икона от три хоризонтални ивици, обикновено в горната част на ъгъла на сайта, при щракване се отваря или се изплъзва отстрани пълно меню. Много експерти прогнозират, че тази тенденция ще избледнее, поради факта, че повечето неопитни потребители просто не разбират предназначението на тази икона. Ето защо уеб дизайнерите са склонни да предпочитат опростената навигация. Но въпреки това ще видим менюто за хамбургери повече от веднъж на новосъздадени сайтове.
18. Икони
Иконите, като начин за представяне на информация и инструмент за визуализация, са били и остават една от най-популярните и любими тенденции сред дизайнерите. Достатъчно е да поставите съответните тематични икони близо до блоковете с текст - и сега целият текст придобива логическа и визуална подреденост и структура. И така, през следващата година продължаваме активно да използваме икони.
19. Подреждане на писма
Натрупването на букви е текст в квадрат. По същество това е пример за сложно творческо решение - трябва да си представите дълъг текств обема на малко пространство. В същото време трябва да изглежда красиво и оригинално. Тази година също е модерно. 
20. Празен бутон
Поради спестяване на място и пространство на мобилни устройстваПреди време се появи празен бутон - голям надпис с квадратна линия около думата. Такъв бутон дава преглед на фона зад бутона и в същото време запазва функционалността си на пълноценен бутон. Освен това, като елемент от дизайна, такъв бутон изглежда стилен и спретнат.
21. Избягвайте стокови снимки
Някои експерти са забелязали, че дизайнерите започват да изоставят стоковите снимки. Тъй като модерни устройствави позволяват бързо и ефикасно да направите сами снимка, след което можете да избегнете безличността и еднообразието на запасите и да направите своя собствена уникална снимка и да създадете свой собствен уникален дизайн.
22. Необичайни ъгли на снимката
Намирането на интересни ъгли в снимките стана достъпно за всеки собственик на смартфон с камера. В това отношение креативността при създаването на снимки е извън класациите и можем да украсим сайта с уникална картина с необичаен ъгъл на гледане или перспектива. 
23. Въртележка
Плъзгачът с въртележка, който влезе в дизайна преди няколко години, все още е популярен и уместен при проектирането на уебсайтове. С помощта на широк плъзгач е удобно да завъртите основните новини, както и да присъствате текущи промоции, колекции и друга подходяща информация, която посетителят вижда веднага след като влезе в сайта.
24. Самостоятелно възпроизвеждане на аудио и видео
Но тази тенденция е здравей от 2000-те години. Спомням си, че тогава беше модерно да пускаш звук, когато посетиш уебсайт. И този за мнозина. Не мога да кажа, че аудио съпроводът ми харесва, но може би умерената употреба ще бъде ненатрапчива. Е, самовъзпроизвеждащото се видео е по-скоро знак на почит към рекламата, според мен. Е, плюс желанието да задържите вниманието на посетителя в емисията. Не е най-приятната тенденция, но комерсиално необходима.
25. Геометрични модели
Е, ще завършим нашия преглед с краткосрочна модна тенденция под формата на различни геометрични дизайни и шарки. Те станаха неочаквано популярни в края на миналата година. Е, още един начин да направите дизайна на уебсайта си изпъкващ и уникален. 
Инфографика „Тенденции в уеб дизайна 2017“
Предлагам ви инфографика, която ясно представя всички тенденции и тенденции в уеб дизайна. Изтеглете снимката в голям размерМожете да следвате тази връзка в DeviantArt. Страница на DeviantArt ще се отвори в нов прозорец. Там щракнете върху думата Изтегляне вдясно от снимката и запазете снимката на вашия компютър.
Посветен на уеб дизайна и дигиталните тенденции през 2018 г. Олга е член на журито на Awwwards и всеки ден преглежда стотици нови сайтове, разработени от агенции и дизайнери от цял свят. Това й позволява да бъде в крак с най-новите разработки и тенденции в уеб разработката и дизайна.
Статията описва основните послания на лекцията и пълна версияможете да го намерите на линка.
Интерактивен свитък
Нашият курсор е обозначен със стрелка. Той или се превръща в пръст за щракване и може да се появят курсори. Сега курсорът може да бъде елемент. Преходът към страницата е маркиран под него. Елементите отдолу могат да се променят или да взаимодействат с курсора.
Уебсайтът Volcan е любим пример. Диамантеният курсор става намек за това, което ви очаква, когато щракнете. Има интерактивен елемент. В резултат на това курсорът не е необходим, неговата роля се играе.
Пример за интерактивен свитък на уебсайта на Volcano
Нова тема за битки между UI/UX дизайнери – колко удобна е? Но ако обмислите всичко правилно, може да се получи добре.
SVG маски
С тяхна помощ можете да правите пространствени преходи. Те не са трудни за разработване, но дават свобода на работа на дизайнерите. Уебсайтът на Рич Браун използва кръст като преход. Но може да бъде всякаква форма.
Ако използвате Photoshop, можете да направите това, като просто изрежете дупка в слоя с маска. Или чрез застъпване на 6 квадрата. За нашия клиент направихме преход от екран на екран, използвайки това нещо. Отварянето на изображение от формуляр също е SVG маска. Но ако погледнете оформлението, то изглежда като статична картина.
Платно
Това вече е трудно. Определено се нуждаете от някой с разбиране на математическите аспекти на процеса. Някои неща могат да се заемат от библиотеките. Но SVG няма синхронизация с курсора. И ето го.
Уеб сайтът Climachill от Adidas, например.
Преобразуването с буква е Canvas. Преливането на градиенти е Canvas. И това е популярно от няколко години, но скоро няма да остарее. Тъй като тежи малко и е 2D графика, която е трудна за копиране. Подходящо за тези, които искат много „уау“ на уебсайта си.
3D+WEBGL
Посоката ще се развива. Когато правиш дори малък, но качествен клип за 1 минута, това означава минимум 10 човека в екипа. Когато е в 3D - това е 1 дизайнер. И webgl е +1 разработчик. 3D може да бъде класически, като на уебсайта Globekit. Изглежда фантастично, уникално. Въпреки че се състои от общо 6 слайда.
Но отново: трябва да внимавате с приложението. Един такъв ефект е напълно достатъчен, за да направи сайта ярък, но не крещящ.
VR
През март 2017 г. се появи първият уебсайт във VR. Има повече от тях. Наскоро направихме първата VR писта на футболен стадион. Човек си слага маска и му се струва, че е на състезателна писта.
Устройство за виртуални състезания от Audi.
Наскоро спорихме дали VR ще се наложи. Да, има бъдеще, защото стана по-лесно да се прави. Ще направим портфолио във VR, така че да можете да го прелиствате, като завъртите главата си, а когато фиксирате погледа си, отидете на работа.
AR
Страхотно е, че сега можете да правите без приложение. Отивате на връзка в браузъра си и трябва да имате маркер, който да прочете някои неща. Показвате този маркер и той завършва с рисуването на това, което искате. Тоест първо правиш дизайн в 3D, показваш му го и той довършва добавената реалност. Можете да го персонализирате за себе си.
PWA е функционалност на браузъра, която е подобна на приложение. Добавя се като икона и изглежда като приложение. Всъщност той се отваря в браузъра и ви позволява да изпращате известия до потребителя, да го записвате чрез формуляр и да получавате съдържание офлайн.
Рамка
Това е готова библиотека, където можете да намерите всички неща за AR и VR. Можете да видите как работят, да ги наблюдавате в действие.
Затова съветвам всички уеб дизайнери да завършат обучението си в 3D. Това ще направи вашия сайт много по-жизнен.
Дръжте ги под око. Те не стоят на едно място. Има такова нещо като Google експерименти. Освободете си няколко часа, за да разгледате цялата красота. Google провежда много експерименти, в които включва разработчици и агенции. Последният е използването на големи данни.
И наскоро Awwwards започна да си сътрудничи с Google. Това означава, че сега ще се наблегне на мобилните сайтове. Технологията ще започне да се оптимизира, за да стане по-лека. Google започва да се интересува все повече от мобилната мрежа.
WebVj
Много нов трик. Страницата е изградена въз основа на данни. Има един японец, Масатацу Накамура, който е особено сериозен за това. Графиките му са направени изцяло от програмист, а не от дизайнери. Той прави много за Google Experiments.
Пример за графика на Масатацу Накамура, направена с помощта на WebVJ
Трендосики
Най-задаваният въпрос е „Какъв цвят/шрифт/десен ще бъде модерен през следващата година?“ Наричам това „тенденции“.
Вече е невъзможно да се идентифицира един актуален набор от шрифтове или цветова схема. Нещо като пастелни цветовезапочват да възприемат тенденция. Но след това гледате тези ярки, експлозивни сайтове и разбирате, че не.
Бих ви посъветвал да разиграете представянето на компонента, като използвате шаблони във всеки случай. Така съдържанието ще изглежда по-скъпо и интересно. Редовният полупрозрачен и лек модел вече ще даде статус на вашия сайт. Наклонени линии, счупени елементи - това не е толкова трудно и не изисква участието на разработчик.
