Современный веб-дизайн. самые яркие примеры стильных сайтов

Содержание

Главная страница Studio P2MV

Перейти на главную страницу https://p2mv.studio/

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

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

Дизайн корзины интернет-магазина

Расположение, цвет и размер иконки

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

Пример расположения корзины в верхнем правом углу на странице сайта с контрастной иконкой:


Расположение корзины

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

Пример такой функции: при наведении указателя мыши открывается корзина и пользователь видит товар, который успел положить в корзину:


Пример отображения корзины, когда пользователь наводит курсор мыши

Запомните! Чем меньше кликов, тем быстрее и проще путь клиента, а значит — высока вероятность совершения сделки.

Оформление заказа и покупка

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

Пример оформления заказа на сайте Леруа Мерлен:

Пример простого дизайна на странице оформления заказа

6 сайтов для дизайнеров о шрифтах и типографике

  • https://ilovetypography.com. Один из лучших ресурсов для тех, кто небезразличен к буквам. На этом сайте вы найдете массу полезных и просто интересных заметок о типографике и том, что с ней связано.
  • https://fonts.google.com. Подборка бесплатных шрифтов от Google, которой чаще всего пользуются дизайнеры. Самое полезное — возможность посмотреть, с какими шрифтами чаще всего сочетается выбранный вами вариант.
  • https://www.paratype.ru. Отличный сайт с хорошей подборкой шрифтов. Из приятного — можно без особого труда подобрать даже красивый русский шрифт, из печального — большинство шрифтов придется приобретать (но на сайте часто проводятся распродажи).
  • https://fontshop.com. Магазин шрифтов, где можно подобрать удачное решение для своего проекта. Но особенно интересен сайт даже не количеством самих шрифтов, а примерами их применения, которые позволяют лучше оценить, насколько выбранный шрифт подходит для вашей задачи.
  • https://www.dafont.com. Огромная подборка шрифтов для самых разных задач, а еще — удобный интерфейс и много новинок.
  • https://typejournal.ru. Полезный интернет-журнал о типографике и шрифтах.

14 медиа о веб-дизайне

  • http://webdesignerwall.com. Сайт посвящен не только созданию дизайна, но и затрагивает темы разработки, верстки, анимации и продвижения.
  • http://houseofbuttons.tumblr.com. Здесь можно найти десятки интересных примеров оформления кнопок на сайте (многие с готовой анимацией).
  • https://www.webdesignerdepot.com. Еще один информационный сайт для дизайнеров, затрагивающий самые разнообразные сферы, начиная с приемов оформления интерфейса и заканчивая организацией рабочего процесса.
  • https://webdesignledger.com. Неплохой ресурс о веб-дизайне, на котором можно найти много различных подборок удачных решений, новые тренды, узнать больше о типографике и элементах дизайна сайтов.
  • https://designyoutrust.com. Ежедневная подборка новостей, событий и тенденций в сфере дизайна.
  • https://www.creativebloq.com/computer-arts-magazine. Международный интернет-журнал о цифровом искусстве.
  • https://say-hi.me. Один из лучших русскоязычных ресурсов, рассказывающий о творчестве для креативных людей.
  • https://designpub.ru. Рассказывают о событиях, типографике, дизайн-процессах, иллюстрации и саморазвитии.

«Дизайн-кабак» — сайт о дизайне и о том, что с ним связано

Лучшие дизайны интернет-магазинов

Пример стильного дизайна сайта Nikos Koulis — производителя ювелирных изделий:

  • В оформлении прослеживаются четкие линии.
  • Простая и стильная структура сайта.
  • Кнопка «Открыть» — единственная на странице. Она выделяется, легко читается и открывается на нужной странице.
  • Минус в том, что нельзя сразу оформить заказ, можно только оставить заявку на получение стоимости товара.
  • Понятная структура главной страницы.
  • Сдержанные цвета и яркая кнопка корзины определенно являются отличным решением, так как сразу фиксируют взгляд пользователя.
  • Единый шрифт и большой размер букв позволяют увидеть всю важную информацию.
  • В карточках товара — подробное описание продукта и его характеристик.
  • Оформить заказ можно за несколько минут.

А здесь показан пример UX-разработки — интерактивная покупка велосипеда. Объект изменяется с применением различных составляющих, а также быстро складывается, чем экономит место в квартире.

Тобиас ван Шнайдер

Био: неоднократно отмеченный наградами графический дизайнер родом из Германии. Живёт и работает в Нью-Йорке.

Чем крут: мастерски дизайнит всё — от веба до продуктового дизайна и дизайна кроссовок. Победитель многих фестивалей, судья в жюри Cannes Lions, Hyper Island, Art Directors Club & the FWA, разрабатывает дизайн для Spotify, Red Bull, Google, NASA, BMW, Sony, Fantasy Interactive, Wacom, Toyota. О нём пишут Bloomberg, Wired, The Washington Post, Business Insider, Net Magazine, Computer Arts, FastCompany, Inc. Magazine и другие.

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

Wave переносит медитацию в XIX век — с интегрированным мультисенсорным музыкальным подходом. Изображение: личный сайт

Дизайн главной страницы интернет-магазина

Главная страница — это то самое «первое впечатление», о котором мы говорили в начале статьи. Здесь должна быть сконцентрирована полезная и вовлекающая информация.

Почему мы выбрали такие разные сайты:

Шапка сайта, или хедер

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

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

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

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

Второй пример — сайт Molnio. Здесь другое расположение элементов в шапке: одна строка с логотипом и основными страницами сайта, а также номером телефона компании.

  • Каталог с эскизами продукции.
  • Оплата и доставка.
  • Сервисное обслуживание.
  • Контакты.
  • Новости.
  • Аксессуары и запчасти.
  • Поддержка.

Рекламный блок

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

«Аскона» предлагает сразу шесть предложений на выбор пользователя: варианты оснований кроватей и матрасов, а также товаров для детей.


Рекламный блок на сайте Асконы

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

Оформление блока с баннерами на сайте Molnio

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

На сайте Асконы в блок с каталогом добавили хиты продаж и основную продукцию со скидкой:


Оформление раздела каталога на главной странице

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


Оформление каталога на главной странице сайта

Дизайн галереи фотографий:


Галерея продукции

Хиты продаж и акции

А в блоке «Хиты продаж» размещают популярную продукцию за последнее время. Иногда данный раздел отводится под товары, которые компания не успела продать в прошлом сезоне, и их нужно быстрее реализовать, чтобы освободить склад для новых моделей.

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


Пример оформления блока «Хиты продаж»

На главной странице также можно найти акцию для клиентов, оформивших членство в клубе «Любителей здорового сна»:


Пример оформления акции и дополнительного привлечения пользователей

Molnio не добавила на свой сайт акции или хиты продаж

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


Услуги гарантийного сервиса на сайте

Дополнительная информация

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

«Аскона» в данном случае разместила блок с новинками:


Блок с новинками на сайте

Molnio, в свою очередь, решила рассказать о компании, оформив ее историю в хронологической последовательности:


Пример оформления блока «О нас»

Блог

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

«Аскона» публикует статьи об истории компании и продукции, а также делится советами о том, как правильно спать или какой матрас выбрать для больной спины.

На скриншоте ниже показаны два блока: вверху — история и рассказ о производственных мощностях компании, внизу — новостная лента и статьи.


Блог на главной странице

Футер

Подвал сайта обычно представляет из себя карту из основных страниц и предложений с окном подписки на рассылку и иконками соцсетей.

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


Оформление футера

У Molnio в футере есть ссылки на социальные сети и на документы о политике конфиденциальности:


Пример оформления футера

Простые шрифты и мягкая цветовая палитра

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

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

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

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

Наша команда с удовольствием поможет вам создать адаптивный дизайн сайта, в котором будут внедрены основные тенденции веб-дизайна и эффективные технологии для достижения максимальной оптимизации. Напишите нам на info@stfalcon.com, и мы будем рады помочь!

Главная страница True Ventures

Перейти на главную страницу https://trueventures.com/

Студия Ueno уже была в ТОП-25 студий по версии Awwwards-2018, уже имеет 29 наград ресурса, 13 из них — в номинации “Сайт дня”.

Студия представила новую работу, которую оценили жюри — ресурс для платформы для венчурных предпринимателей True Ventures.

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

Главная страница Google Store

Перейти на главную страницу http://store.google.com/

Сложно ожидать от сайта Google Store дизайн, не соответствующий строгим гайдлайнам самой поисковой сети. Неизвестно, как студия BASIC (США) подходила к его разработке — сначала поработав над соответствием требованиям Material Design, а потом добавляя креатив, или наоборот? Итогом оказался магазин, наполненный качественными фото, вызывающими восторг — будь то изображение товара или рекламного атмосферное фото.

Изображения оттеняют функциональные элементы простых форм, стандартные Google-шрифты и фирменный логотип из буквы G то тут, то там. Просто чтобы ненавязчиво напомнить пользователю, на чьем (!) сайте он находится. Это поддержит интеграция с Google-аккаунтом. Даже не надо входить — все уже готово к покупкам!

Главная страница Ricky Michiels, 2019

Перейти на главную страницу https://www.rickymichiels.com/

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

В 2013 году тенденцию дизайна сайтов Веб 2.0 сменила портальная (журнальная) верстка. Круглые линии, реалистичные градиенты и объемные иконки уступили место острым углам, плоскому дизайну, минимализму и чистоте изображения. Истина “все гениальное — просто”, определяющая смысл журнальной верстки, не теряет актуальности и в 2019 году.

Найдите референсы

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

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

Подборку референсов вы можете смело показать заказчику. Так вы вместе выберете подходящий стиль, что избавит от ненужных правок в дальнейшем. Найти множество хороших примеров можно на Behance, Awwwards и Pinterest.

Дизайн карточки товара на странице интернет-магазина

Далее разберем карточки товаров на примере двух сайтов: оформление, описание, количество изображений, а также наличие инструкций.

На сайте Асконы карточка товара представлена с подробным описанием:

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

Пример хорошего оформления карточки товара

Molnio предлагает минимализм во всем. В карточке товара — только ключевая информация:

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

Альтернативный пример оформления карточки с ключевой информацией о продукте

Главная страница Anoukia—in Pink

Перейти на главную страницу https://www.pink.anoukiaperrey.com/

Американская студия Saint Roman совместно с 3D-дизайнером Anoukia Perrey разработали ее портфолио, в котором поместили летний сет ее работ, объединив в коллекцию “Anoukia in Pink”.

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

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

A Digital Volcano

Сайт лучше открывать через Chrome, Safari или Firefox, поскольку он состоит из качественных тяжелых видео. Для загрузки такого объема информации требуется быстрый браузер. Проверьте сами – https://www.ge.com/digitalvolcano.

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

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

Дизайн сайта: подготовка

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

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

Постановка целей для будущего сайта

Определяемся с целью, например:

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


Карточка на «Леруа Мерлен» позволяет удобно изучить, сравнить и купить товар

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

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

Выбор типа сайта

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

Лендинг, или посадочная страница — это такой моносайт, который посвящен одному предмету и имеет всего один CTA. Например, страница конференции с кнопкой «Зарегистрироваться». Скорее всего, в содержании будет описание конференции, список спикеров и докладов и основные тезисы, почему стоит прийти.

Пример дизайна сайта-лендинга конференции SendPulse и eLama

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

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

Выбор платформы для создания сайта

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

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

Мы собрали 12 известных конструкторов, которые подойдут для создания лендингов и многостраничных сайтов. Изучили плюсы и минусы каждого и спросили читателей, каким пользуются они сами.

Главная страница My 360° Mirror

Перейти на главную страницу https://www.my360mirror.com/

Как удачно продать дизайнерское зеркало? Дизайнер Stella Petkova (Болгария)  нашла способ, предложив свое видение, каким должен быть дизайн для торгового марки My 360° Mirror, чтобы идея бренда пришлась посетителю по вкусу.

А замысел дизайна пришел прямо из названия: даешь зеркало с обзором на 360° — так покажи его именно вот так, с любой стороны. Презентация товара разворачивается перед посетителем по мере скроллинга. Идея не новая, но неизменно выигрышная для презентации товаров, хоть и связана с хлопотами в подготовке фотоматериала.

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

Выводы

Если проследить тенденции, царящие в мире современного веб-дизайна, то вырисовывается следующая картина:

намечается тенденция перехода от лонгридов к одноэкранным сайтам с переходами через клик или скролл, которые были популярны в нулевых. Отличает лишь современную версию Веб 2.0 сокращение контентной части до предельного минимума, и действительно до одного экрана, без скролла вниз — эта функция уже занята под переходы;
parallax-эффект все так же не сдает позиций, являясь классикой для создания wow-эффекта. Разница — в реализации. Не всегда это — простой скролл полотен текста, разделенного окошками с визуальными элементами (видео, фото)

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

На этот случай дизайнеры придумывают креативную заглушку с элементами интерактива, чтобы пользователь не скучал;
интерактив может стать и способом развлечь посетителя на сайте. Забавные игровые элементы могут присутствовать практически на любом ресурсе — даже на сайте респектабельного дизайнерского бюро, лишь бы приподнятое и веселое настроение, которое они вызывают, было уместным и не входило с в противоречие с тематикой ресурса;
дизайн, достойный наград, может быть выполнен и без особо сложных эффектов
При должном усилии, сайт, разработанный фрилансером, может привлечь внимание жюри. “Вывезти” веб-ресурс может просто следование гайдлайнам Google, без покушения на игру с нормами, какую могут себе позволить маститые дизайн-агентства;
покушение на нормы — при должном уровне мастерства (или смелости) можно нарушить абсолютно все нормы, и попасть в рейтинг
Если знать, какие нарушения придутся публике по душе. в этом поможет глубокое исследование вкусов целевой аудитории и рынка в целом.

Определитесь с целью

Для начала поймите, зачем вашему клиенту нужен сайт. Пусть он ответит на несколько простых вопросов:

  • Чему посвящён сайт?
  • Какие задачи должен решать?
  • Как планируется продвигать сайт?
  • Какая у сайта должна быть структура?
  • Какой контент планируется размещать?
  • Есть ли у клиента готовый брендбук?

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

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

Главная страница Oui Will Agency

Перейти на главную страницу http://www.ouiwill.com/

Еще одно знакомое по рейтингу-2018 дизайн-студий — агентство Oui Will из сан-Диего (США). На этот раз студия представила обновленный собственный сайт, сделав ставку на Parallax-эффект, эффектные презентационные ролики и тонкую, гладкую типографику. Все разделено по экранам, для каждого слогана, ролика или новости — свой экран, никакого соседства. Сайт щедро сдобрен уместной анимацией и, где это возможно, интерактивным взаимодействием с пользователями, при этом, оставляя дух минимализма и сдержанности. Умение сочетать противоположности в очередной раз принесло студии место в рейтингах Awwwards.

Главная страница Won Hundred

Перейти на главную страницу https://wonhundred.com/

Есть тут кто-то, соскучившийся по табличной верстке нулевых? Разработчики SPRING/SUMMER удивили жюри Awwwards, предложив на суд беспрецедентный проект сайта для капсульной коллекции одежды Won Hundred. В этой странице есть все из дизайна девяностых-нулевых: белый фон, однопиксельные границы табличек, в которые вписано главное меню, форма рассылки и карточки товаров. Дополнительный флер гениальности вносят стандартные цвета и типографика, и даже бегущая строка заголовков. Вишенкой на торте выступают рекламные баннеры в лучших традициях WordArt. Нельзя упрекнуть датских разработчиков в хорошем чувстве юмора.

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

Лучшие дизайн-студии США

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

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

Watson Design Group, Inc.

Офис компании: Лос-Анджелес, США

Специализация: брендинг, дизайн, мобильная, VR и веб-разработка

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

Ежедневный труд и опыт сделали команду Watson DG специалистами, услугами которых уже воспользовались Sony, Amazon, студии Paramount, Riot Games, Disney, Universal, Lionsgate, Fox Searchlight, Warner Bros.

ZeroStudios

Офис компании: Нью-Йорк, США

Специализация: брендинг, маркетинг, дизайн

Призвание специалистов ZeroStudios из Нью-Йорка — создавать бренды, которые будут менять жизнь пользователя. Безусловно, к лучшему. В дизайне своих продуктов команда студии использует яркие и модные flat- и material-цвета. Они играют незаметную роль в презентации продуктов, ненавязчиво создавая необходимый настрой у пользователя.

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

Специалисты студии утверждают, что любят работать со стартапами и некоммерческими организациями. Но в портфеле проектов не без гордости демонстрируют совместную работу с Google, Foursquare, Versace, Hillary For America.

Hello Monday

Офис компании: Нью-Йорк, США

Специализация: брендинг, маркетинг, дизайн, разработка

«Продукт должен быть таким, чтобы радовал даже худший день недели!» — решили специалисты студии Hello Monday. К работе над своими проектами команда подходит с юмором и всеми силами старается поднять настроение и вызвать улыбку у пользователя и клиента. «К жизни и к работе нужно относиться с юмором

В понедельник это особенно важно!» — говорят дизайнеры

Студия открылась в 2006 году в датском городе Аархус. Идеи ребят были восприняты публикой на «Ура!», что сподвигло их в скором времени открыть еще два офиса — в Нью-Йорке и Копенгагене.

Юмор и жизнелюбие, с которым подходят к работе Hello Monday, оценили именитые клиенты. Среди них: Warner Bros, National Geographic, Google и Nasa.

Active Theory

Офис компании: Венис, США

Специализация: мобильная и веб-разработка, VR&AR, интерактивные инсталляции

«Мы делаем крутые вещи для крутых ребят!» — с таким лозунгом студия разработки из калифорнийского города Венис уже который год занимает призовые места в рейтингах мира в сфере веб-разработки и дизайна.

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

Опыт студии в создании новых реальностей пришелся по душе Walt Disney Group. Именно Active Theory стали тем разработчиком, который реализовал виртуальный 3D-проект “Welcome to Hogwarts” по вселенной книг Джоан Роулинг о Гарри Поттере.

Dogstudio

Офис компании: Чикаго, США

Специализация: мобильная и веб-разработка

Проекты студии разработки из Чикаго выделились на общем фоне чем-то любопытно-утонченным. студия скромно называет себя «средней по размеру»  по-бельгийски скромно. Первый офис был открыт в Бельгии в незапамятном году, когда начинали работать с маленькими магазинчиками и бутиками.

Второй офис Dogstudio открыли в Чикаго, чтобы быть ближе к своим клиентам из Сан-Франциско, Нью-Йорка, Сиэтла и Лос-Анджелеса. В 2018 году 2 проекта Dogstudio получили номинацию «Сайт года». И это еще не предел.

Главная страница Design in Motion Festival

Перейти на главную страницу https://demofestival.com/

Использовать рекламные афиши и проспекты в качестве источника вдохновения для веб-дизайна — ход беспрецедентно смелый. Но в разработке оформления сайтов тех же мероприятий смелый шаг приобретает оттенки оптимистичного вопроса “Почему бы и нет?”

Именно интернет-афишей и представляется веб-ресурс DEMO Festival (Нидерланды), разработанный агентством Dept (Амстердам). Яркость и насыщенность цветов, вычурность и гипермасштабность типографики прицельно показывают тематику ресурса — реклама массового мероприятия. Иногда и такой ход позволяет позиционировать мероприятие с первого взгляда. Если это произойдет — дальше только дело за техникой и информативным контентом.

Тематическое и функциональное использование

При создании шаблонов просматривайте различные функциональные и тематические категории, такие как веб-сайт начальной загрузки, креативное агентство, дизайн интерьера, онлайн-образование, создание видео, звук музыки, личный блог, стоковое видео, здоровье мебели, веб-сайт электронной коммерции, WordPress для бизнеса, строительная компания, даже для админских шаблонов. Вам нужно начать продавать свои продукты в Интернете или представить свое цифровое агентство или магазин модной одежды с помощью адаптивной woocommerce. Предположим, вы фанат Instagram, новичок или профессиональный фотограф. В этом случае вы можете создать веб-сайт с недавно созданной коллекцией для своего бизнеса или стартапа, или другие малые предприятия будут идеально подходить, для чего вы можете создать творческий блог, даже если у настраиваемого домена есть варианты макета для запуска веб-сайта. Быстрее. Различные варианты макета, созданные аналогично elementor builder, подходят для студии, реализующей идеи веб-сайтов html5.