20 лучших сайтов 2020 года: подборка экспертов

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

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

Содержание:

Смотрите также подборку лучших сайтов по итогам 2019 года.

Лучшие сайты с 3D-дизайном

«3D-дизайн в разных вариациях фигурировал почти во всех топовых сайтах в 2020 году, — говорит Гаврил. — На мой взгляд, самая лучшая интерпретация — когда видео или 3D-объекты дополняют, а не мешают типографике и другим элементам сайта».

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

Для последней версии культовой коллекции CHILE 20 дизайнеры агентства Active Theory создали три иммерсивных пространства с реалистичными 3D-визуализациями и хип-хопом. Чтобы попасть в одно из них с главной, нужно выбрать модель кликом, переместиться в другой — сделать свайп в сторону. Приятный бонус для фанатов: фоновый динамический паттерн с названием коллекции можно изменить, заменив «CHILE 20» на свое имя.

Сайт брендингового агентства Beans Agency из Украины, разработанный командой их соотечественников Dops Digital Lab, кажется, вобрал в себя все тренды веб-дизайна. Здесь и сломанная сетка, и продуманная типографика, и смелые цветовые сочетания, и провокационные гифки. Но все перечисленное отходит на второй план перед главной изюминкой. Точнее, бобами.

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

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

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

Источник: Zenly

Лендинг сервиса быстрых онлайн-платежей Plink с крутыми трехмерными анимациями — пример подхода «Content is first», к которому стремятся многие веб-дизайнеры. Кажется, всплывающие заголовки и текст лишь дополняют, но не отвлекают внимания от иллюстраций.

Эта работа студии Numbered из Амстердама отмечена жюри нескольких digital-конкурсов, таких как Awwwards и The FWA. По свежим релизам в их портфолио можно отслеживать тренды веб-дизайна.

VC Swipe — сервис, который помогает инвесторам находить перспективные молодые стартапы, и наоборот. Система, основанная на искусственном интеллекте, связывает участников платформы с наиболее подходящими контрагентами по сделке.

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

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

«Минимализм — вечный тренд веб-дизайна, он всегда был, есть и будет. Но по сайтам ниже можно заметить, как он пытается искать новые формы, новые сетки, новые размеры и тому подобное, чтобы освежить себя».

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

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

Fuse Media — международное коммуникационное агентство. Эффектный, но при этом очень минималистичный сайт с акцентом на типографику и интерактивность. Дизайн легко передает довольно сложную и объемную информацию об услугах и проектах компании.

Разработчики сайта — украинская студия Obys. В своем оффере они смело заявляют, что создают лучшие сайты, которые побеждают в мировых конкурсах. Что ж, имеют все основания: в 2020 году их проекты неоднократно попадали в рейтинг SOTD («Site of The Day») на Awwwards.

Источник: Fuse Media

В этом году у студии веб-дизайна Vide Infra сложился авторитетный список достижений: вошли в Топ-10 креативных веб-разработчиков Рейтинга Рунета, в Топ-5 CSS Design Awards, номинированы на студию года на Awwwards. Вам еще нужны аргументы, чтобы заглянуть в их портфолио и увидеть лучшие сайты 2020 года?

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

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

Источник: Point

Лучшие сайты с декоративными акцентами

«Вроде все тот же минимализм, но на фоне декоративных элементов, призванных очеловечить интерфейс, воспринимается как совсем иной стиль».

Вполне вероятно, что после просмотра этого сайта вы захотите сменить работу. Ведь то, как CoverMyMeds, компания-разработчик ПО для фармацевтической отрасли, презентуют HR-бренд и строящийся кампус, достойно восхищения. Сайт разработан креативной студией Dogstudio из Чикаго. Их лучшие сайты неоднократно попадали в мировые рейтинги.

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

Источник: CoverMyMeds

Готовы поспорить: сайт Тиффани Мазелье из Франции станет одним из самых крутых портфолио дизайнеров-фрилансеров, что вам доводилось видеть. Не только потому, что в нем есть ссылки на лучшие сайты, разработанные с ее участием. Само портфолио отмечено жюри конкурсов CSS Design Awards и Awwwards.

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

12. NYLON

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

Источник: NYLON

Сайты с лучшей типографикой

«В 2020-ом мы видели шрифты с засечками, как мне кажется, во всех возможных интерпретациях. Могу предположить, что в следующем году этот тренд в веб-дизайне будет только набирать обороты. Потому что на фоне гротескных шрифтов „а-ля Helvetica“ это все еще выглядит свежо».

13. Muteza

Иногда веб-дизайнеры берутся за действительно амбициозные и смелые проекты — создают новые лучшие сайты для компаний, которые даже не в курсе. Зачем? Например, чтобы занять себя на карантине и подать заявку на конкурс, как Абхишек Джа из Нью-Дели. Взяв за основу идею продукта Аtolla, он сделал полный редизайн сайта и дал ему альтернативное название Muteza.

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

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

Сайт разработан агентством Exo Ape. Этот и другие их проекты неоднократно были отмечены как лучшие сайты 2020 года на Awwwards.

Источник: Æbele Interiors

15. CUSP

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

2°C EARTH — визуальный путеводитель по пяти популярным туристическим местам на планете, природному и культурному наследию которых угрожает изменение климата. Автор проекта — дизайнер Jingqi Fan, и это ее выпускная дипломная работа. Она предлагает представить, как изменится Земля в результате повышения глобальной температуры на 2 градуса по Цельсию, и призывает задуматься о последствиях потепления.

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

  • «Тропический лес океанов» (настоящее);
  • «Города-призраки океанов» (будущее).

Исследование сайта 2°C EARTH — объемный интерактивный опыт. Найдите возможность уделить ему время.

Лучшие сайты с нестандартными решениями в UX

«Еще один яркий тренд: все чаще дизайнеры подходят к проектированию UХ („User Experience“, дословно „опыт пользователя“), вкладываясь в тот самый „experience“ по максимуму, транслируя его как „переживание“, „приключение“. В результате мы получаем так называемые фестивальные сайты, нацеленные на то, чтобы максимально погрузить пользователей в интерактив, вдохновить особенной атмосферой, создать ощущение не просто навигации, а полного управления всем происходящим внутри».

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

«Типичный лендинг стартапа, но на каких-то диких стероидах», — так охарактеризовал сайт Everpost Гаврил Перов. А мы заглянули на сайт разработчика Брайана Джеймса BryBry и пришли к заключению, что сказанное выше после «но» можно отнести ко всем его проектам. Неспроста они каждый год стабильно попадают в лучшие сайты на Awwwards с 2014 года.

Источник: Everpost

Свою сотую победу в престижном для разработчиков конкурсе FWA (Favorite Website Awards), команда канадской студии Jam3 решила отметить... созданием еще одного конкурсного сайта, разумеется! К слову, сейчас в их копилке уже 106 отметок за лучшие сайты на FWA.

То, что получилось в итоге, сложно назвать сайтом. Это, скорее, арт-объект или инсталляция. Будьте готовы к бесконечному восторгу от путешествия в пространстве и времени. В любой момент можно кликнуть на иконку камеры в правом верхнем углу, чтобы сохранить потрясающие обои для рабочего стола с 3D-абстракциями.

Агрохолдинг Pioneer занимается селекцией засухоустойчивых гибридов кукурузы с 1950 года. За 70 лет компания собрала впечатляющий багаж инноваций, к которым можно причислить и лучший сайт о кукурузе, который когда-либо был создан. Если за дело берется нидерландская студия Resn, может быть только так. Эта команда не первый год задает тренды веб-дизайна.

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

Источник: Pioneer – Corn Revolutionized

Международный проект «Музей без стен», организованный Британским Советом, начал развиваться в digital-пространстве за несколько лет до пандемии COVID-19. Но именно в 2020 году концепция музеев онлайн стала как никогда актуальной.

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

Как отслеживать тренды веб-дизайна

Самый верный способ — добавить в закладки браузера и периодически просматривать сайты конкурсов:

Смотреть крутые работы веб-дизайнеров и искать вдохновение можно также на Dribbble, Behance и SiteInspire.

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

Похожие статьи

Все

Реализуйте свои идеи за минуты.

Выразите себя с помощью самой простой в мире программы дизайна.