Лучшие статьи категории «Веб-сайты»

Подписка

Плоский дизайн. Примеры сайтов и интерфейсов

С выходом Windows 8 и Metro UI все больше дизайнеров и разработчиков интерфейсов стали создавать сайты в дизайне которых используются только плоские элементы. И если пол года назад такие сайты воспринимались как что-то необычное, особенно в сравнении с другими интернет ресурсами, то сегодня их можно увидеть гораздо чаще и такого восторга они уже не вызывают. Развитие этого направления привело к появлению нового стиля — плоский дизайн (на английском он называется flat-design). О нем мы подробно рассказываем в нашей постоянной рубрике «Плоский дизайн».

Главное отличие плоских сайтов — использование минималистического подхода, при котором из интерфейса и дизайна в целом, удаляются все 3D-элементы, градиенты, тени и другие украшательства. На передний план выходят простые, строгие и понятные формы, но не в ущерб дизайну. Больший акцент уделяется тексту, меньший — графике. Такой подход позволяет устранить лишние шумы на странице, которые могут отвлекать пользователей. Главную же роль в плоском дизайне играет цвет. Его используют без боязни, выбирая по пять, шесть или более основных цветов, без учета дополнительных (например, для показа таких состояний как hover, focus, active и других). Этот выбор сделан намеренно, чтобы сайт не казался скучным.

Ниже мы собрали более 20 примеров наиболее точно представляющих и характеризующих этот стиль.

Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов
Плоский дизайн, примеры сайтов и интерфейсов


Комментарии (7)

Igor / 30 Март 2013 в 12:36

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

Warior / 31 Март 2013 в 12:20

Как же мне нравится этот Metro UI и все сопутствующие стили. Гораздо красивее, чем все эти web 2.0 сайты.

Девушка / 2 Апрель 2013 в 12:43

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

Вздоров / 3 Апрель 2013 в 15:55

Да, неплохие примеры. Microsoft диктует моду (:

Jeanne / 13 Апрель 2013 в 00:36

Мне очень такой дизайн нравится.

Designers / 17 Апрель 2013 в 22:54

Отличная статья.

Alexander Samokhin / 3 Июнь 2013 в 11:51

Отличная подборка, этот стиль сейчас очень популярен. Через годик другой, будет уже не так (:

Добавить новый комментарий

* — поля обязательные для заполнения XHTML: Вы также можете использовать эти тэги: <a href="" title=""> <pre lang=""> <blockquote> Перейти наверх

Поиск

Популярные статьи

Комментарии

  • Кек: Ни один из сервисов не работает.
  • Alex: На самом деле все конечно правильно написано, но для России...
  • Анна: Несколько советов о том, как самому придумать логотип есть...
  • Agen Sabung: Great web site you have here. It’s hard to find excellent writing like yours these days. I really...
  • Павел Тимощенко: Аналогично скриню картинки для некоторых...
  • Зенков Андрей: Учитывая, что иконки служат для подсказки тем,...
  • Зенков Андрей: Дизайнер должен ответственно подойти к...
  • Оля: DizGraf, вот отличный русскоязычный бесплатный фотобанк.

Друзья

Нашли ошибку?

Если вы нашли грамматическую ошибку на сайте, выделите ее и нажмите сочетание клавиш Ctrl+Enter.

Система Orphus