Топ крутых сайтов по дизайну

Крутые сайты по дизайну

Веб-дизайн - это особое направление в искусстве, к которому применимы высказывания "все уже придумано до нас" и "новое - это забытое старое". Но, несмотря на это, в живописи портрет Джаконды до сих пор остается непревзойденной классикой, а "Девятый вал" Айвазовского годами будоражит воображение. Поэтому подборка самых крутых веб-дизайнов используется в качестве лучших источников вдохновения и пополнения копилки своего опыта.

В этой статье предлагаем рассмотреть оригинальные веб-дизайны, которые помогут преодолеть творческий кризис, подарят новые идеи. Если вы просмотрите примеры в одном стиле - наверняка увидите много общих приемов, позаимствуете их для создания своего крутого веб-дизайна и сэкономите время на разработку. Итак, поехали!

3D-дизайн сайта

Это направление фигурирует во всех топовых сайтах. 3D-объекты и видео не мешают типографике, а больше дополняют ее.

Adidas CHILE 20
Adidas CHILE 20

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

Beans Agency

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

Beans Agency
Beans Agency

Моушн-заставки с прорисованными персонажами делают путешествие по сайту очень увлекательным.

Beans Agency - когда появляются смешные персонажи
Beans Agency - когда появляются смешные персонажи

Zenly

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

Zenly
Zenly

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

Zenly - новая локация
Zenly - новая локация

Plink

Лендинг онлайн-платежей с крутыми трехмерными анимациями, которые не отвлекают внимание, а дополняют процесс оплаты.

Plink - топовый сайт по дизайну
Plink - топовый сайт по дизайну

VC Swipe

Сайт, основанный на работе искусственного интеллекта, связывает инвесторов с перспективными стартапами. Кроме 3D-анимации имеется приятная типографика и сетка.

VC Swipe
VC Swipe

Минималистичный дизайн

Этот тренд в веб-дизайне будет всегда. Но даже он ищет новые формы и выражения - сетки, размеры и т.п.

Cellular Agriculture Society

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

Cellular Agriculture Society
Cellular Agriculture Society

Fuse Media

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

Fuse Media
Fuse Media

Vide Infra

Эта студия веб-дизайна вошла в топ креативных веб-разработчиков по Рейтингу Рунета, CSS Design, а также Awards. Давайте заглянем в их портфолио и посмотрим, что же такое креативненькое они придумывают?

Vide Infra - главная страница стильного по дизайну сайта
Vide Infra - главная страница стильного по дизайну сайта

Сайт студии имеет минималистичный дизайн, дополнен мягкими микроанимациями и плавными переходами по сетке.

Vide Infra - портфолио
Vide Infra - портфолио

Point

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

Point - яркие решения в минимализме
Point - яркие решения в минимализме

Декоративные акценты

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

CoverMyMeds Careers & Culture

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

Этот разработчик ПО для фармацевтов презентует HR-бренд просто восхитительно
Этот разработчик ПО для фармацевтов презентует HR-бренд просто восхитительно
Кажется, что это хаотичная композиция из видео, фото, 3D-визуализации, декоративных акцентов и текста
Кажется, что это хаотичная композиция из видео, фото, 3D-визуализации, декоративных акцентов и текста

Но после просмотра роликов вы проникнетесь миссией команды - помогать больным людям.

Команда топового сайта по дизайну
Команда топового сайта по дизайну

NYLON

Журнал о развлечениях, моде, музыке, стилях. Стандартная многоколоночная сетка оживлена контрастными баннерами, яркими коллажами, декоративными шрифтовыми акцентами и чистыми "воздушными" пространствами.

NYLON
NYLON
NYLON - привлекательно и читабельно
NYLON - привлекательно и читабельно

Типографика

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

Muteza

Этот сайт сделан специально для конкурса на основе идеи веб-ресурса Atolla. Проект получил альтернативное название "Muteza".

Пример типографики
Пример типографики

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

Удачное сочетание шрифтов, декоративных элементов и фото
Удачное сочетание шрифтов, декоративных элементов и фото

АЕbele Interiors

Элегантный сайт агентства дизайна интерьеров.

Главный шрифт с засечками искусно сочетается с рукописным, а плавная анимация придает шарма при переходах по страницам
Главный шрифт с засечками искусно сочетается с рукописным, а плавная анимация придает шарма при переходах по страницам
Так удачно вписаны изображения
Так удачно вписаны изображения

CUSP

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

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

Нестандартные решения в UX

UХ-дизайнеры, которые отталкиваются от опыта пользователя, транслируют веб-сайт как "приключение". Посетитель максимально погружается в интерактив, вдохновляется атмосферой и считает, что в его руках управление сайтом, которое на самом деле находится внутри веб-ресурса.

Everpost

Галерея тизеров говорит о том, что компания предлагает услуги видеопродакшена.

Кажется, что это типичный лендинг, но он очень динамичен, до "сумасшествия"
Кажется, что это типичный лендинг, но он очень динамичен, до "сумасшествия"

Jam3 – FWA 100

Сайт разработан для конкурса FWA. Получился какой-то арт-объект с бесконечным восторгом от путешествий. А клик на иконку камеры сохраняет потрясающие анимированные обои для десктопного рабочего стола.

Путешествия по сайту вызывают восторг
Путешествия по сайту вызывают восторг

Pioneer

Агрохолдинг Pioneer изучает кукурузу более 70 лет. Пожалуй, это лучший сайт о данной сельхозкультуре.

Pioneer
Pioneer
Как выращивается кукуруза
Как выращивается кукуруза

Museum Without Walls

Онлайн-музей с виртуальной галереей.

Cайт простой и понятный, но очень необычный и свежий.
Cайт простой и понятный, но очень необычный и свежий.

Примеры B2B-сайтов с качественным дизайном

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

JCurve Solutions

Агентство по планированию ресурсов предприятий (ERP). Сайт открывает "тяжелая артиллерия" в виде решения проблемы - "Мы помогаем организациям внедрить ERP".

Решение проблем пользователя на первой странице.
Решение проблем пользователя на первой странице.

Sysdoc

Простой интерфейс с легкими анимациями. Старается заслужить доверие посетителя веб-ресурса, используя блок довольных клиентов. Навигационная панель движется при скроллинге, CTA (call to action) продуманы и заметны.

Лучшие CTA
Лучшие CTA

Примеры интернет-магазинов

Такие веб-проекты могут стать очень оригинальными решениями с расширением типичного функционала.

Big Chill
Big Chill

Портфолио

Сайт портфолио должен "продавать" лицо и золотые руки специалиста - дизайнера, художника, фотографа. Давайте рассмотрим несколько сайтов портфолио с удачным дизайном.

Robby Leonardy - персонажи в стиле "Майнкрафт"
Robby Leonardy - персонажи в стиле "Майнкрафт"
Buzzworthystudio - мягкая анимация при перемещении между элементами
Buzzworthystudio - мягкая анимация при перемещении между элементами
Josh Miller - меняющая форму капля привлекает внимание и завораживает
Josh Miller - меняющая форму капля привлекает внимание и завораживает

Рисованные и анимированные веб-проекты

Mikimottes - весь "подземный" контент перед вами
Mikimottes - весь "подземный" контент перед вами
Jordyalblas - динамичный летательный объект над большим городом
Jordyalblas - динамичный летательный объект над большим городом
Pitch-tents - отсылка к временам наших прадедушек
Pitch-tents - отсылка к временам наших прадедушек
Brandit - небольшие летающие объекты
Brandit - небольшие летающие объекты
Twistanddrink - подмигивающие бутылки
Twistanddrink - подмигивающие бутылки
Plateinteractive - тарелка с пластилином, из которого на ваших глазах создаются объекты
Plateinteractive - тарелка с пластилином, из которого на ваших глазах создаются объекты
Bstd - курсор в виде подрагивающей руки и не только, красивый сайт по дизайну в России
Bstd - курсор в виде подрагивающей руки и не только, красивый сайт по дизайну в России
Тот же сайт, внутренняя страница о команде
Тот же сайт, внутренняя страница о команде

Примеры лендингов - российские топовые сайты по дизайну

Лендинг должен продавать на первой странице, поэтому дизайну такого сайта уделяется самое пристальное внимание.

Jacksbarlondon - эффект присутствия в баре
Jacksbarlondon - эффект присутствия в баре
Шоколад "Альпен Гольд" не устает удивлять
Шоколад "Альпен Гольд" не устает удивлять
Не отстает от него и "Скиттлс"
Не отстает от него и "Скиттлс"
Ясделие - еще одна заявка на креатив, но не все пользователи могут ее воспринять
Ясделие - еще одна заявка на креатив, но не все пользователи могут ее воспринять
Ясделие - тексты "на грани"
Ясделие - тексты "на грани"
Cpeople - действительно, креативные люди
Cpeople - действительно, креативные люди
Экзотические фрукты - шапка сайта
Экзотические фрукты - шапка сайта
Экзотические фрукты - этот лендинг работает как интернет-магазин
Экзотические фрукты - этот лендинг работает как интернет-магазин

А ниже вы увидите лендинг ко Дню Космонавтики. Рассмотрим этот интересный проект подробнее.

Если вы мечтаете о космосе, то вам точно сюда!
Если вы мечтаете о космосе, то вам точно сюда!
Выберите направление полета и тип кабины
Выберите направление полета и тип кабины
А также тип перелета, питание
А также тип перелета, питание
Укажите ваши данные
Укажите ваши данные
И получите билет, совсем как настоящий - в нашем случае на Венеру!
И получите билет, совсем как настоящий - в нашем случае на Венеру!

Как находить вдохновение в самых крутых веб-дизайнах

Прежде всего добавьте в закладки браузера сервисы мировых конкурсов типа FWA, Рейтинг Рунета, Awwwards, Epica Awards, Red Dot Award, CSS Design Awards, Cannes Lions, где можно найти подборку лучших сайтов мира каждого года. А, может быть, вам попадется какой-либо уникальный сайт во время серфинга? Ищите вдохновение и воплощайте свои замыслы. Удачи!

An error has occurred. This application may no longer respond until reloaded. Reload 🗙