Лучшие сайты 2019 года: подборка экспертов

лучшие сайты баннер

Совместно с авторами телеграм-канала Now How прошлись по главным трендам и собрали лучшие примеры веб-дизайна этого года. Листайте, переходите по ссылкам и погружайтесь в магию дизайна!

Лучшие сайты со скетчами

Скетч — один из горячих трендов этого года. Дизайнеры целенаправленно иллюстрируют сайты в таком стиле, чтобы управлять вниманием и подчеркивать главное. Ниже — лучшие примеры сайтов со скетчами.

1. Hellomonday

На главной странице сайта креативной нью-йоркской студии анимированная скетч-парочка развлекает читателя необычными превращениями и трюками, а с сеткой публикаций можно поиграть курсором мышки и пошевелить края у картинок.

Благодаря скетчам и игровым элементам в дизайне у сайта получилась легкая и непринужденная атмосфера. На такой не страшно зайти даже в понедельник, а значит, задача создателей студии выполнена — хороший дизайн делает жизнь лучше в любой день.

hellomonday2

Hellomonday.com

2. Lemonade

Lemonade — это страховая компания, расположенная в США. Миссия компании — сделать страховой бизнес более прозрачным и человечным, поэтому их сайт очень не похож на типичные сайты страховых компаний: он светлый, приветливый и будто нарисован от руки.

Самая интересная страница с отчетом о благотворительной деятельности буквально рисует читателю историю в цифрах и фактах, которые при прокрутке дополняются новыми разделами. В итоге анимация так захватывает, что не дочитать страницу просто невозможно:

lemonade

lemonade.com

Сайты с пластиковыми иллюстрациями

Дизайнеры всё чаще сотрудничают с художниками при создании сайтов. Фирменные изображения из тренда превращаются в хороший вкус, и пластиковые иллюстрации — один из примеров того, как можно выделиться и запомниться благодаря необычному дизайну.

3. Binaryblocks

Компания-разработчик онлайн-платформ и приложений использовала в дизайне сайта футуристичных пластиковых персонажей, необычные шрифты и черно-белый дизайн.

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

Результат получился очень запоминающимся:

Screenshot 2019-11-17 at 14.15.59

binaryblocks.io

4. Life of Your Code от Google

На этом сайте Google иллюстрации — это не просто декорации, они часть игры, которая объясняет разработчикам, как устроен сервис хранения кода Cloud Run. В процессе игры можно собрать свой поезд из разных вагончиков-сервисов и посмотреть, как он работает.

Screenshot 2019-11-17 at 14.19.29

Google

Лучшие сайты с необычной типографикой

4. ЖК Композиция № 24

Промо-сайт нового жилого комплекса в Москве вдохновлен работами конструктивистов и модернистов, а эстетика того времени не покидает тренды веб-дизайна уже несколько лет. О том, какими ещё художниками вдохновляются дизайнеры, читайте в нашей отдельной статье.

Для сайта ЖК Композиции дизайнеры использовали необычный шрифт с засечками Karloff Negative, который очень похож на шрифты с советских плакатов, а вместо привычных рубрик поверх фотографий наложены контрастные квадратные карточки.

С сайтом интересно взаимодействовать, хочется бродить по всем страницам и внимательно рассматривать детали:

Screenshot 2019-11-17 at 14.22.11

k24moscow.ru

5. Ladybird

Сайт-визитка одноименного фильма использует в оформлении готические и декоративные шрифты, красивые иллюстрации и аккуратную верстку: все ради того, чтобы передать атмосферу фильма.

Внутри спрятан милый тест с карточками, ответы на которые перекликаются с сюжетом из фильма, кадры из которого появляются после ответов. Желание пересмотреть Lady Bird гарантировано.

Если хотите сделать похожий дизайн, ныряйте в нашу подборку бесплатных готических шрифтов с шаблонами и выбирайте понравившиеся.

Screenshot 2019-11-17 at 14.24.35

Ladybird.movie

Лучшие сайты с брутальным дизайном

Брутализм — контр-тренд, в котором смешиваются фотография, видео, иллюстрация и провокативный дизайн. Сайты с таким дизайном противопоставляют себя милой эстетике, минимализму и стильному однообразию веб-дизайна последних лет. Зачастую их специально создают не в конструкторах, а при помощи HTML, поэтому они не выглядят супер-современно, но при этом сильно выделяются из общей массы. Брутализм идеально подходит для магазинов вещей, портфолио дизайнеров и молодежных брендов.

6. 2nd STREET USA

Сайт этого секонд-хэнд магазина уличной моды похож на модный журнал: внутри нетипичная верстка, крутые фотографии моделей и продуманная цветовая схема. Несмотря на нетипичную для интернет-магазина сетку, хаоса на сайте нет, наоборот, вся важная информация на виду.

2ndstreet

2ndstreetusa.com

7. Han Kjobenhavn

Этот датский интернет-магазин взял от тренда максимум: сайт кажется созданным в Microsoft Excel, а текст на плашках — доставленным прямиком из Windows 97.

Выглядит это очень необычно и круто, а главное — идеально сочетается с характером бренда, в котором много жесткой простоты и американского рабочего наследия.

Screenshot 2019-11-17 at 14.33.02

Han Kjobenhavn

8. I am tired online

Ещё один провокационный сайт, авторов которого достала концепция лайков и жизни ради социальных сетей. При помощи дизайна сайт рассказывает разные истории, в которых показывает обратную сторона всеобщей публичности и доступности.

Повествование ведется при помощи скролла, и самая первая зарисовка — о том, как много стало социальных сетей. Прокрутка вниз не позволяет избавиться от движущихся букв секунд 30 — даже устойчивых к мельтешению букв зрителей начнет тошнить. Заставляет задуматься.

output_Re4zcS

iamtired.online

Лучшие сайты со стилизацией

Ещё одна разновидность трендовых иллюстраций этого года — стилизация под определенный стиль или формат.

9. Deplace Maison

Этот сайт треккинговой и городской обуви стилизован под бумажные комиксы и граффити. Курсор на странице превращается в жирную точку краски, на фотографиях видны сгибы бумаги, так что создается полное ощущение того, что перед глазами не пиксели, а печатный каталог.

Вместе с необычной обработкой фото моделей на сайте используется еще один трендовый прием этого года — сломанная сетка. Они отлично дополняют друг друга и стильно смотрятся.

Screenshot 2019-11-17 at 14.43.17

Deplace Maison

10. Vladimir Gruev

Сайт-портфолио UI/UX-дизайнера, с которого не хочется уходить, потому что он стилизован под объемный куб, который при помощи курсора очень приятно «подержать в руках».

На сайте дизайнер рассказывает о себе и показывает свои лучшие работы. Другие классные примеры дизайнерских портфолио мы собрали в статье с советами и шаблонами для оформления.

output_Re4zcS

Gruev.space

11. Birdsrecords

Необычный проект, совместное детище Яндекс. Музыки и WWF, который оформлен тоже необычно. Проект посвящен теме сохранения птиц, поэтому визуально он стилизован под них. Каждый «этаж» отличается от предыдущего, а в самом низу находится плеер с музыкой, за прослушивания которой Яндекс делает пожертвования в WWF. Чем не повод задержаться на сайте и послушать Ивана Дорна.

Screenshot 2019-11-17 at 15.11.58

Birdsrecords

12. Jazz FM Romania

Ещё один музыкальный сайт, на этот раз румынской джазовой радиостанции. У сайта максимально далекий от привычного для джаза дизайн, он больше похож на афишу новой выставки современного искусства. Вместе с тем на сайте все понятно, а кнопка проигрывания такая большая, что не заметить ее нельзя. Получилось красиво и очень стильно.

Screenshot 2019-11-17 at 15.16.50

Jazzfm.ro

13. Save Whales

Образовательный сайт, цель которого — помочь сохранить популяцию китов. Для каждого из животных создана отдельная страница с большим анимированным портретом, записью песни и набором фактов о них внутри пузырей воздуха.

Сайт стилизован под воду, и после просмотра создается полное ощущение погружения в подводную жизнь китов.

Screenshot 2019-11-17 at 13.41.06

Save Whales

Лучшие сайты со сломанной сеткой

Наезды и смещения — тренд в веб-верстке этого года. Такое нарушение правил идет против привычных законов композиции, но отлично смотрится, чем с удовольствием пользовались дизайнеры в 2019 году.

14. Lyft

Компания решила рассказать об историях своих водителей и создала для этого отдельный красивый сайт с подборкой видео, фото и текстов, которые оформили при помощи наезда. Выглядит очень кинематографично.

output_Re4zcS

Lyft

15. Atolla

Сайт бренда Atolla намеренно отказался от симметричной сетки, чтобы подчеркнуть разницу в типах кожи у разных людей. Такое дизайнерское решение отлично сочетается с рассказом о продуктах компании — персонифицированных сыворотках для лица. Этот сайт — хороший пример того, как дизайн может идти рука об руку с характером компании.

Screenshot 2019-11-17 at 15.40.26

Atolla

16. White Elephant

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

output_Re4zcS

White Elephant

Сайты со скандинавским дизайном

Несмотря на новые тренды и течения, скандинавский дизайн до сих пор очень популярен и многие дизайнеры по-прежнему придерживаются его в работе и выпускают сильные продукты в этом стиле. Ясность, простота, крупные штрихи, модульность и ничего лишнего — суть скандинавского подхода.

17. HalloBasis

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

Screenshot 2019-11-17 at 15.46.33

HalloBasis

18. George&Harrison

Сайт дизайн-студии и брендингового агентства, выполненный в лучших традициях модульной верстки и скандинавского стиля. Четкие прямые линии, красивый гладкий рисунок букв и отточенные формулировки в тексте. Идеальный скандинав.

Screenshot 2019-11-17 at 15.48.26

George&Harrison

Подписывайтесь на наши обновления в Телеграме, Фейсбуке и ВКонтакте, чтобы упустить новости из мира трендов графического дизайна и возможности Canva, которые помогут воплотить их в жизнь!

Ваше секретное средство для потрясающих дизайнов