Топ крутых сайтов по дизайну
Веб-дизайн - это особое направление в искусстве, к которому применимы высказывания "все уже придумано до нас" и "новое - это забытое старое". Но, несмотря на это, в живописи портрет Джаконды до сих пор остается непревзойденной классикой, а "Девятый вал" Айвазовского годами будоражит воображение. Поэтому подборка самых крутых веб-дизайнов используется в качестве лучших источников вдохновения и пополнения копилки своего опыта.
В этой статье предлагаем рассмотреть оригинальные веб-дизайны, которые помогут преодолеть творческий кризис, подарят новые идеи. Если вы просмотрите примеры в одном стиле - наверняка увидите много общих приемов, позаимствуете их для создания своего крутого веб-дизайна и сэкономите время на разработку. Итак, поехали!
3D-дизайн сайта
Это направление фигурирует во всех топовых сайтах. 3D-объекты и видео не мешают типографике, а больше дополняют ее.
Заказ одежды онлайн от культовых брендов сопровождается тремя вращающимися спортивными товарами, при этом 3Д-визуализация настолько реалистична, что просто поражает воображение. Выберите модель кликом мышки и сделайте свайп в сторону. А фоновый паттерн можно дополнить своим именем.
Beans Agency
Украинское брендинговое агентство воплотило, наверное, все тренды хорошего 3D-дизайна. Сломанная сетка, идеальная типографика, смелые сочетания цветов, провокационные гиф-изображения. Но даже они отходят на второй план по сравнению с главной изюминкой веба.
Моушн-заставки с прорисованными персонажами делают путешествие по сайту очень увлекательным.
Zenly
Красочные 3D-иллюстрации и короткие тексты раскрывают суть этого приложения. Сначала оно задумывалось в виде мобильной карты для связи с друзьями и близкими, к примеру, можно было указать точку сбора или не потеряться во время путешествия. Но теперь с помощью приложения свои действия могут координировать даже пожарные службы.
Графика очень сложная, но навигация интуитивно понятная. Несколько скроллов мышкой перенесут вас между анимационными локациями.
Plink
Лендинг онлайн-платежей с крутыми трехмерными анимациями, которые не отвлекают внимание, а дополняют процесс оплаты.
VC Swipe
Сайт, основанный на работе искусственного интеллекта, связывает инвесторов с перспективными стартапами. Кроме 3D-анимации имеется приятная типографика и сетка.
Минималистичный дизайн
Этот тренд в веб-дизайне будет всегда. Но даже он ищет новые формы и выражения - сетки, размеры и т.п.
Cellular Agriculture Society
Некоммерческая организация для исследования развития науки о производстве сельскохозяйственных продуктов из клеток. Интересна интерактивная инфографика, нестандартные переходы, минималистичный декор.
Fuse Media
Минималистичный дизайн с акцентом на интерактивность и типографику. Общая картина замечательно передает объемную информацию.
Vide Infra
Эта студия веб-дизайна вошла в топ креативных веб-разработчиков по Рейтингу Рунета, CSS Design, а также Awards. Давайте заглянем в их портфолио и посмотрим, что же такое креативненькое они придумывают?
Сайт студии имеет минималистичный дизайн, дополнен мягкими микроанимациями и плавными переходами по сетке.
Point
Посмотрите, как дизайнеры обыграли цвета и продумали дизайн карт, которые предлагаются к оформлению, и как преподнесен в минимализме фотоконтент.
Декоративные акценты
Минимализм на фоне дополнительных элементов имеет более очеловеченный интерфейс, поэтому веб-проект не воспринимается как простой сайт.
CoverMyMeds Careers & Culture
Если вы просмотрели этот сайт и захотели поменять работу, значит, дизайнеры добились своего.
Но после просмотра роликов вы проникнетесь миссией команды - помогать больным людям.
NYLON
Журнал о развлечениях, моде, музыке, стилях. Стандартная многоколоночная сетка оживлена контрастными баннерами, яркими коллажами, декоративными шрифтовыми акцентами и чистыми "воздушными" пространствами.
Типографика
Шрифты с засечками - известный тренд в веб-дизайне, который по прежнему набирает обороты и выглядит очень свежо. А для тех кто не знаком с понятием типографики, прошу сюда.
Muteza
Этот сайт сделан специально для конкурса на основе идеи веб-ресурса Atolla. Проект получил альтернативное название "Muteza".
Косметический веб-проект должен показывать текстуры, эстетику, ощущения, настроение и даже запахи. Фото декоративных элементов и начертание заголовков передают все это полностью.
АЕbele Interiors
Элегантный сайт агентства дизайна интерьеров.
CUSP
Команда сотрудников создает комплексные решения для сторонних компаний. На сайте-портфолио представлена демо-версия всех возможностей команды.
Нестандартные решения в UX
UХ-дизайнеры, которые отталкиваются от опыта пользователя, транслируют веб-сайт как "приключение". Посетитель максимально погружается в интерактив, вдохновляется атмосферой и считает, что в его руках управление сайтом, которое на самом деле находится внутри веб-ресурса.
Everpost
Галерея тизеров говорит о том, что компания предлагает услуги видеопродакшена.
Jam3 – FWA 100
Сайт разработан для конкурса FWA. Получился какой-то арт-объект с бесконечным восторгом от путешествий. А клик на иконку камеры сохраняет потрясающие анимированные обои для десктопного рабочего стола.
Pioneer
Агрохолдинг Pioneer изучает кукурузу более 70 лет. Пожалуй, это лучший сайт о данной сельхозкультуре.
Museum Without Walls
Онлайн-музей с виртуальной галереей.
Примеры B2B-сайтов с качественным дизайном
Большинство B2B-сайтов рассказывают посетителям о команде, своей работе и услугах. Но не всегда обычные сайты работают эффективно. Все подобные веб-проекты должны иметь приятный визуал, отвечать на вопросы клиента, иметь простую навигацию, быть мультиплатформенными, время на загрузку должно быть минимальным.
JCurve Solutions
Агентство по планированию ресурсов предприятий (ERP). Сайт открывает "тяжелая артиллерия" в виде решения проблемы - "Мы помогаем организациям внедрить ERP".
Sysdoc
Простой интерфейс с легкими анимациями. Старается заслужить доверие посетителя веб-ресурса, используя блок довольных клиентов. Навигационная панель движется при скроллинге, CTA (call to action) продуманы и заметны.
Примеры интернет-магазинов
Такие веб-проекты могут стать очень оригинальными решениями с расширением типичного функционала.
Портфолио
Сайт портфолио должен "продавать" лицо и золотые руки специалиста - дизайнера, художника, фотографа. Давайте рассмотрим несколько сайтов портфолио с удачным дизайном.
Рисованные и анимированные веб-проекты
Примеры лендингов - российские топовые сайты по дизайну
Лендинг должен продавать на первой странице, поэтому дизайну такого сайта уделяется самое пристальное внимание.
А ниже вы увидите лендинг ко Дню Космонавтики. Рассмотрим этот интересный проект подробнее.
Как находить вдохновение в самых крутых веб-дизайнах
Прежде всего добавьте в закладки браузера сервисы мировых конкурсов типа FWA, Рейтинг Рунета, Awwwards, Epica Awards, Red Dot Award, CSS Design Awards, Cannes Lions, где можно найти подборку лучших сайтов мира каждого года. А, может быть, вам попадется какой-либо уникальный сайт во время серфинга? Ищите вдохновение и воплощайте свои замыслы. Удачи!