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

 

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

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

image01

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

Cybeer Bar

image15

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

Christmas with Joy

image21

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

Руководство Dropbox

image00

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

450 GSM

image25

Сайт 450 GSM все еще ​​может рассматриваться в качестве оригинальной плоской конструкции, если бы не применение длинной тени под птицей. Забавный факт: этот сайт был фактически построен с Startup Design Framework, который позволяет легко создавать красивые сайты быстро.

Intercom

image23-e1438676839152

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

Агентство Survival Kit

image22

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

Hell‘o Baby

image20

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

Helbak

image17

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

Paye Ton Caps

image13

Графика для этой французской онлайн-игры построенная на плоском дизайне 2,0, четко подобранные цвета, гармонично сочетаются и гармонично дополняют дизайн ресурса.

CSS Conference EU

image05

Традиционная плоская цветовая палитра в сочетании с некоторыми декоративными детали, чтобы сделать сайт CSS конференции современным и востребованным.

Take It

image06

Использование слоев для сайта Take It демонстрирует креативное сочетание в себе реальные фотографии в плоском стиле. Обратите внимание на фон города, проделанный в типичном плоском стиле.

Google Santa Tracker

image08

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

For Better Coffee

image18

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

Dots

image07

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

Quotes Magazine

image14

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

Who Is This F*cking Bear?

image04-e1438677286949

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

Stash Flat Icons

image03

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

Acapo

image12

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

Liberio

image24

Liberio еще один учебный сайт с плоским дизайном, яркие цвета в соотношении со скромным шрифтом подчеркивают графику выполненную в стиле плоского дизайна 2.0

Kaipoche

image02

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

Team Treehouse

image19

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

SCEATT

image10

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

Evolve Wealth

image16

Еще один сайт финансовой компании который призван приумножить ваш капитал, при этом не загромождая ресурс различный «пустой» информацией.

Black Tomato

image09

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

Lander

image11

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

Выводы

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