Метка «Flat UI»

Вместо предисловия


Для начала хотелось бы сказать пару слов о новомодном тренде в области веб-дизайна и дизайна интерфейсов — плоском дизайне (Flat UI).

Flat, очень хорошо играет на контрасте. Metro особенно сильно выделяется в сфере UI.
Можно провести небольшую параллель: посмотрите на это надгробие. Оно прекрасно, не так ли?

image
Крупнее

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

Однако если на кладбище все надгробия будут такие же, как это, тогда это будет ужасающая серость и беда. Прелесть минимализма именно в контрасте.

Другой яркий пример контраста минимализма

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

И тут вы достаёте свою минималистичную Zippo Black.
Windows Phone 8 такая, какой её задумали разработчики
Она элегантна своей простотой. Среди пестрящей вычурности других зажигалок ваша, скорее всего, будет наиболее сильно выделяться из общей массы.

Но давайте теперь представим обратную картину.
У всех посетителей в руках минималистичная Zippo Black и тут вы заходите с золотой Zippo с красной вставкой и выдавленной трубкой. И на этот раз уже ваша далеко не минималистичная золотая Zippo будет привлекать внимание посетителей.


Минимализм не должен быть в мейнстриме, ни в коем случае.

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

В 2010 году, когда на рынке смартфонов властвовали Apple, Samsung и HTC с нагромождёнными интерфейсами iOS, TouchWiz и HTC Sense, Windows Phone поражал воображение по внешности, дизайну.
Читать полностью »

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

Несколько интересностей и полезностей для веб разработчика (выпуск 4)Pace.js — это самый простой способ (документация здесь) добавить к вашему проекту прогресс бар. Для Pace существует несколько тем, которые описываются только на CSS. От Hubspot есть еще два универсальных проекта на GitHub: Vex и Messenger — «Dialogs for the 21st century» и «Alerts for the 21st century» соответственно. Рекомендую.

imageFlat UI Free 2.1
Популярный информационный ресурс Designmodo опубликовал на GitHub обширный набор элементов интерфейса в стилей трендового плоского дизайна. Об этом еще в марте писал читатель ilya42. А на этой недели проект обновился до версии 2.1. Теперь в Flat UI есть поддержка Bootstrap 3, появился ряд новых элементов, иконок, обновилились шрифты. Количество старов уже больше 5000.

Несколько интересностей и полезностей для веб разработчика (выпуск 4)Framer
Потрясающее изобретение разработчика Koen Bok. Framer — это бесплатный инструмент для прототипирования интерактивных и анимационных интерфейсов. Приложение синхронизируется с Photoshop, нарезает слои макета на .png (конечно же для верстки придется немного порезать руками, но все зависит от педантичности дизайнера к макету) и все верстает на z-index и trasnform matrix3d. А интерактив и анимацию дизайнеры добавят с помощью этого простого синтаксиса прямо в браузере (к сожалению только Chrome). PSD.Logo, PSD.OverviewButton — это имена PNG файлов. Говоря о разработчике Framer, хочется также упомянуть про его проект Cactus — генератор статистических сайтов на Python использующий Django template. Читать полностью »

Flat UI — бесплатный набор плоских элементов веб интерфейса [обновлено]Компания Designmodo, специализирующаяся на разработке веб-интерфейсов, опубликовала на Гитхабе довольно внушительный набор модных сегодня плоских элементов интерфейса — меню, кнопок, слайдеров, переключателей, чекбоксов, иконок и многого другого. Плоский дизайн интерфейсов активно продвигает Microsoft, и он всё чаще и чаще встречается в сети.

Можно спорить о преимуществах и недостатках такого дизайна, но игнорировать его нельзя — мода есть мода, так что этому набору наверняка найдётся место в колллекции большинства веб-дизайнеров. Кроме файлов изображений и стилей, набор включает шрифт Lato польского дизайнера Лукаша Джеджича и подобранные дизайнерами образцы цветовых сочетаний. Демо можно посмотреть здесь.
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js