Тренды веб-дизайна в 2017 году: анимация, боты и нестандартная сетка

О том, как изменится дизайн, рассказали веб-дизайнеры сервиса Webflow. Этот проект предназначен для проектирования сайтов с нуля. Фото: zoommyapp.com (CC0).
О том, как изменится дизайн, рассказали веб-дизайнеры сервиса Webflow. Этот проект предназначен для проектирования сайтов с нуля. Фото: zoommyapp.com (CC0).

В 2017 году веб-дизай­не­ры будут тес­но сотруд­ни­чать с раз­ра­бот­чи­ка­ми, созда­вать боль­ше ботов и попы­та­ют­ся встро­ить в сай­ты тех­но­ло­гию вир­ту­аль­ной реаль­но­сти. Такие выво­ды сле­ду­ют из ста­тьи гла­вы отде­ла кон­тент-стра­те­гии про­ек­та Webflow Джо­на Уильям­са (John Moore Williams) о трен­дах веб-дизай­на в 2017 году. Кор­ре­спон­дент Теп­ли­цы пере­вел ста­тью и выбрал основ­ные тези­сы.

О том, как изме­нит­ся дизайн, рас­ска­за­ли веб-дизай­не­ры сер­ви­са Webflow. Этот про­ект пред­на­зна­чен для про­ек­ти­ро­ва­ния сай­тов с нуля.

1. Содер­жа­ние важ­нее фор­мы. Дизай­не­ры поня­ли, что люди посе­ща­ют сай­ты из-за их содер­жа­ния, а не из-за того, как они выгля­дят. Про­ис­хо­дит пере­ход к мини­ма­лиз­му. Дизай­не­ры счи­та­ют, что оформ­ле­ние сай­та, его эле­мен­ты долж­ны поз­во­лить чита­те­лю сосре­до­то­чить­ся на сооб­ще­нии без замед­ле­ния ско­ро­сти чте­ния.

2. Тес­ное сотруд­ни­че­ство меж­ду дизай­не­ра­ми и раз­ра­бот­чи­ка­ми. Сов­мест­ная рабо­та будет нуж­на из-за необ­хо­ди­мо­сти созда­вать мобиль­ные при­ло­же­ния для сай­тов. Такие плат­фор­мы как Google, Facebook, Twitter и LinkedIn тре­бу­ют от коман­ды про­ект­ной рабо­ты и более эффек­тив­ных спо­со­бов реше­ния для того, что­бы поль­зо­ва­тель остал­ся на их стра­ни­це. Экс­пер­ты счи­та­ют, что буду­щее за сов­мест­ным про­ек­ти­ро­ва­ни­ем.

3. Шрифт – основ­ной эле­мент дизай­на. Исполь­зо­вать боль­шой и замет­ный шрифт нача­ли уже дав­но. Эта тен­ден­ция про­дол­жит­ся и в 2017 году. Все это вли­я­ние темы мини­ма­лиз­ма. Попу­ля­рен будет жир­ный, брос­кий шрифт, зача­стую заме­ня­ю­щий ими­д­же­вые глав­ные стра­ни­цы. Шриф­ты ста­ли круп­нее и из-за того, что при­шлось опти­ми­зи­ро­вать сайт под мобиль­ные экра­ны. И они про­сто-напро­сто вытес­ни­ли дру­гие эле­мен­ты.

zhirnyj-shrift

4. Новые воз­мож­но­сти в гра­фи­че­ском дизайне. В послед­ние несколь­ко лет веб-дизай­не­ры были сосре­до­то­че­ны на тех­ни­ке CSS-дизай­на. Но уже в мар­те 2017 года в Chrome и Firefox будет под­дер­жи­вать CSS Grid. Это поз­во­лит делать более выра­зи­тель­ные маке­ты. Поэто­му мож­но опре­де­лен­но гово­рить об эво­лю­ции гра­фи­че­ско­го дизай­на.

5. Попу­ляр­ность SVG-фай­лов. Эта мас­шта­би­ру­е­мая век­тор­ная гра­фи­ка пред­став­ля­ет для веб-дизай­не­ров и раз­ра­бот­чи­ков боль­шие пре­иму­ще­ства, чем тра­ди­ци­он­ные изоб­ра­же­ния в фор­ма­те JPG, PNG, GIF. У SVG мно­го плю­сов: фай­лы быст­ро загру­жа­ют­ся, они адап­тив­ны и интер­ак­тив­ны, а еще их лег­ко изме­нить.

6. Яркий мини­ма­ли­стич­ный цвет. В 2016 году дизай­не­ры иска­ли такую фор­му, кото­рая при­даст про­ек­ту инди­ви­ду­аль­но­сти. Они при­шли к выво­ду, что нуж­но исполь­зо­вать яркие и сме­лые цве­та. Реди­зайн неко­то­рых про­ек­тов при­вел к ожив­ле­нию брен­да. Взять, к при­ме­ру, сер­вис Asana или Instagram, кото­рые замет­но пре­об­ра­зи­лись при реди­зайне. Доста­точ­но попу­ляр­ны ста­ли гра­ди­ен­ты. Так что тен­ден­ция к ярким одно­тон­ным изоб­ра­же­ни­ям сохра­нит­ся и в 2017 году.

7. Попу­ляр­ность Flexbox. Это удоб­ный и функ­ци­о­наль­ный модуль под назва­ни­ем «CSS Flexible Box Layout Module». Он реша­ет огром­ное коли­че­ство задач: все бло­ки лег­ко дела­ют­ся «рези­но­вы­ми», что сле­ду­ет уже из назва­ния «flex». Эле­мен­ты могут сжи­мать­ся и рас­тя­ги­вать­ся по задан­ным пра­ви­лам, зани­мая нуж­ное про­стран­ство. Осва­и­ва­ет­ся доволь­но быст­ро и поз­во­ля­ет исполь­зо­вать эффек­тив­ный спо­соб верст­ки.

8. Боль­ше вни­ма­ния на созда­ние ани­ма­ций. Ани­ма­ция уже дав­но игра­ет клю­че­вую роль в интер­фей­сах. Все боль­ше появ­ля­ет­ся визу­аль­ных инстру­мен­тов, с помо­щью кото­рых мож­но лег­ко создать ани­ма­цию. Попу­ляр­ны­ми ста­ли неболь­шие интер­ак­тив­ные ани­ма­ци­он­ные эле­мен­ты, кото­рые несут в себе нави­га­ци­он­ную функ­цию: помо­га­ют поль­зо­ва­те­лям видеть резуль­тат сво­их дей­ствий или объ­яс­ня­ют даль­ней­шие шаги на сай­те. В 2017 году это направ­ле­ние будет наби­рать обо­ро­ты.

Gif c сайта www.ifly50.com/nl_nl/50
Gif c сай­та ifly50.com/nl_nl/50

9. Пер­со­на­ли­за­ция. О пер­со­на­ли­за­ции кон­тен­та гово­рят дав­но, но нуж­ный резуль­тат еще не достиг­нут. Речь идет о том, что­бы под­стра­и­вать содер­жа­ние под такие харак­те­ри­сти­ки поль­зо­ва­те­лей: демо­гра­фия (кто наш поль­зо­ва­тель?), пове­де­ние (что он дела­ет сей­час, а что делал в про­шлый раз на сай­те?), кон­текст (с како­го устрой­ства поль­зо­ва­тель выхо­дит на сайт?). К при­ме­ру, неко­то­рые сай­ты уже пред­ла­га­ют поль­зо­ва­те­лям рас­ска­зать о себе: ука­зать про­фес­сию, пол. Эта инфор­ма­ция поз­во­лит в буду­щем реко­мен­до­вать нуж­ный кон­тент поль­зо­ва­те­лю.

10. Нестан­дарт­ная сет­ка. Послед­ние несколь­ко лет было мно­го спо­ров о том, уми­ра­ет ли совре­мен­ный веб-дизайн. Но в 2016 году появи­лось мно­го раз­но­об­раз­ных спо­со­бов рас­по­ло­же­ния эле­мен­тов на стра­ни­це сай­та. Клас­си­че­ская сет­ка посте­пен­но ухо­дит в про­шлое. Дело в том, что теперь у стра­ни­цы нет деле­ния на несколь­ко чет­ких коло­нок: фото­гра­фии и текст могут рас­по­ла­гать­ся хао­тич­но, даже могут наез­жать друг на дру­га, тем самым состав­ляя необыч­ные ком­по­зи­ции.

dizajn-primer-2

dizajn-primer-1

11. Боль­ше раз­го­во­ра с помо­щью ботов. Экс­пер­ты счи­та­ют, что 2016 год мож­но назвать годом ботов. Но в 2017-м их будет еще боль­ше. И для их запус­ка нужен удоб­ный интер­фейс. Ста­нет попу­ля­рен про­стой, раз­го­вор­ный язык. А перед кон­тент-мене­дже­ра­ми откро­ют­ся новые воз­мож­но­сти: они ста­нут и дизай­не­ра­ми ботов. Так­же в 2017 году мно­го инве­сти­ций будет вло­же­но в поль­зо­ва­тель­ский кон­тент (фору­мы, сооб­ще­ства).

12. Борь­ба с фей­ко­вы­ми ново­стя­ми. Пре­зи­дент­ские выбо­ры в США в 2016 году пока­за­ли, как Интер­нет может вли­ять на обще­ствен­но-поли­ти­че­скую ситу­а­цию. Глав­ный вывод был таков: дез­ин­фор­ма­цию про­из­во­дить очень лег­ко. Осно­ва­тель Facebook Марк Цукер­берг гово­рит, что про­цент фей­ко­вых ново­стей в соци­аль­ной сети неболь­шой, и он рас­ска­зы­ва­ет, какие шаги пред­при­ни­ма­ет Facebook в борь­бе про­тив дез­ин­фор­ма­ции. Груп­па сту­ден­тов вузов при­ду­ма­ла пла­гин для Chrome, кото­рый отме­ча­ет про­ве­рен­ные ново­сти. А Google и Facebook заяви­ли, что будут огра­ни­чи­вать поток реклам­ных средств на под­дель­ные сай­ты ново­стей с помо­щью сво­их инстру­мен­тов.

13. Загля­ни­те в свой бренд. В 2016 году дизай­нер­ские ком­па­нии ста­ли заво­дить соб­ствен­ные бло­ги. Это ста­ло попу­ляр­но. В опре­де­лен­ной сте­пе­ни это попыт­ка при­дать брен­ду лицо. В цен­тре вни­ма­ния ока­за­лось три направ­ле­ния: бренд, гума­ни­за­ция и полез­ность.

14. Вир­ту­аль­ная реаль­ность в Сети. В 2017 году вир­ту­аль­ная и допол­нен­ная реаль­но­сти будут вли­ять на Интер­нет, даже если бра­у­зе­ры еще не смо­гут под­дер­жи­вать такие фор­ма­ты. Конеч­но, сай­ты будут менять­ся и под­стра­и­вать­ся. Позна­ко­мить­ся с таким инстру­мен­том, кото­рый спо­со­бен встро­ить воз­мож­но­сти вир­ту­аль­ной реаль­но­сти на сайт, мож­но по ссыл­ке.