Истоки минимализма в веб-дизайне

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

Эти приемы взяли собственный развитие под влиянием минимализма — течения в искусстве, показавшегося в первой половине 60-х годов прошлого века.

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

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

  • 5 правил плоского дизайна, сделавших его самым горячим трендом сезона

Что такое минимализм и с чем его едят?Истоки минимализма в веб-дизайне

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

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

Минимализм — реакция на популярность «максималистского» дизайна интерфейса пользователя, примерами которого помогают флэш-заставки, нелепые gif-анимации либо приложения, напичканные всевозможными фишками «для посвященных» (к примеру интерфейс Микрософт Office, существовавший до версии 2007).

Портфолио дизайнера Брайана Данахера (Brian Danaher), страницу которого вы имеете возможность заметить выше — обычный пример минималистского ресурса. Его основное окно представлено белым фоном, на котором находится минимум вкладок. Кнопки меню оформлены оттенками серого и голубого цвета.

Данный шаблон на данный момент очень популярен среди дизайнеров.

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

Но направляться осознавать, что лаконичность уместна не для всех лендингов.

  • Преимущества минимализма с позиций психологии восприятия

Восход солнца минимализма: 1960-е гг.

За большое количество десятилетий перед тем, как минимализм стал трендом в веб-дизайне, он был представлен в искусстве послевоенной Европы. Жанр появился как отражение хаоса, царящего в то время. Хаос цвета и линий чаще всего распространен в абстрактных работах экспрессионистов: к примеру, капельная живопись Джексона Поллока (Jackson Pollock).

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

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

Джексон Полок, «Full Fathom Five» (1947 г., Музей современного мастерства).

К минималистам тех лет кроме этого относятся графический дизайнер Йозеф Мюллер-Брокман (Josef Muller-Brockmann), живописец Эллсворт Келли (Ellsworth Kelly) и промышленный дизайнер Дитер Рамс (Dieter Rams). Обратите внимание на чистые линии, рациональное использование и простоту цвета в каждом из этих примеров. Не обращая внимания на громадное разнообразие слоев, ощутима последовательность построения композиции.

Эллсворт Келли «Бруклинский мост VII» (1962 г., Музей современного мастерства).

Дитер Рамс (Dieter Rams). Радиоприемник модели «RT 20 Tischsuper» для компании Braun, 1961 г.

Краун-холл, спроектированный Людвигом Мис ван дер Роэ (семь дней Mies van der Rohe), 1956 г.

Предстоящий успех минимал-арта был отражен в девизе известного архитектора XX века Людвига Мис ван дер Роэ: «Меньше — значит больше». Данный девиз потом переймут веб-дизайнеры минималисты: чем меньше элементов на странице, тем лучше пользовательский опыт.

  • 18 примеров лендинг пейдж с плоским дизайном

1980–2000 гг.

В конце двадцатого века минимализм начал формироваться как отдельное направление компьютера и взаимодействия человека. В первой половине 80-ых годов XX века Эдуард Тафти (Edward Tufte), специалист в области визуализации данных, в собственной работе «Наглядное представление количественной информации» ввел понятие «коэффициент информационных пикселей» (data–ink ratio).

В печатных СМИ коэффициент информационных пикселей является соотношениеммежду (1) количеством чернил, затраченных на передачу информации, и (2) всех чернил, применяемых для печати графики. Тафти являлся ярым приверженцем того, дабы оставлять как возможно больше писклей, передающих данные и как возможно меньше изображений, не передающих сущность послания. Его идею возможно выразить посредством следующего уравнения: Data–ink ratio = Коэффициент информационных пикселей (Informative Ink)/ Объем чернил (Total Ink).

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

В первой половине 90-ых годов XX века Джон М. Кэрролл (John M. Carroll), исследователь тематики интерфейса «человек-компьютер» (Human-computer interface) изучал методы улучшения технических учебных пособий. На базе собственных изучений он создал теорию минимализма в технической коммуникации. Теория Кэрролла предполагала, что хорошего обучающего результата возможно достигнуть стремительнее, в случае если дизайн книжки будет максимально несложным.

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

В 1995 году, Якоб Нильсен (Jakob Nielsen) вводит термин «минималистский дизайн». В статье о десяти эвристических приемах дизайна он применял этот термин в духе Тафти и Кэрролла, поскольку поддерживалустранение несущественной информации из интерфейсов.

  • 16 «смертельных» неточностей веб-дизайна посадочных страниц

2000–е гг.

С середины 2000-х годов последствия мнимал-арта стали появляться в сфере сайтостроения. Показались более большие полосы «негативного пространства», количество контента уменьшился, цветовая палитра ограничилась. Компанию Гугл довольно часто именуют пионером минимализма в данной сфере.

Гугл постоянно ставил на первое место аскетизм и простоту интерфейса со времен самого первого тестирования бета версии поисковой совокупности в девяностых.

Основная страница Гугл (1999)

Не обращая внимания на то, что Гугл с того времени создал и купил столь успешные продукты, как Гугл Drive, YouTube, Gmail, Гугл Maps, его основная страница мало изменилась за 15 лет.

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

Основная страница Гугл (2015)

Не смотря на то, что Гугл был законодателем моды на аскетичность в дизайне, потребовалось время, дабы минимализм приобрел популярность. В начале 2000-х годов Интернет пестрил «лоскутными одеялами» — раздражающе-пестрыми ресурсами со множеством элементов.

Медлительно, но правильно, минимализм взял признание среди веб-дизайнеров, графических дизайнеров, живописцев, фотографов, разработчиков и архитекторов. Дизайнер и блогер Эмили Чанг (Emily Chang) в 2006 году написала о подъеме минимализма следующее:

«Пожалуй, обстоятельством всему — успех основной страницы Гугл либо общая негативная реакция на мигающие баннеры и навязчивые popup-окна (так называемый эффект Джонатан Ива). Но сущность одна: пользователи, разработчики и дизайнеры, — все приняли девиз Мис ван дер Роэ «меньше — значит больше» как управление к действию.

  • Введение в юзабилити

2010–2013 гг.

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

Со временем предпочтения пользователей и дизайнеров стали склоняться к большей простоте веб-интерфейсов. Данный сдвиг был подчеркнут наибольшими трансформациями во внешнем виде операционных совокупностей двух гигантов хай-тек индустрии: Микрософт (Windows 8 в 2011 г.), и Apple (релиз iOS в 2013 г.).

Разработка Windows 8 компанией Микрософт в 2011 первенствовалабольшой реконструкцией ОС за последние десятилетия. Одновременно с этим, компания позиционировала собственный дизайн как современный. Эта новая философия компании была квинтэссенцией минимализма, забравшего начало напрямую от одноименного перемещения в сфере мастерства.

В официальной проектной документации Микрософт сообщено, что школа «Баухаус» есть одним из главных столпов нового дизайна ОС и стиля корпорации.

Windows 8. «Плиточный» дизайн

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

Интерфейс iOS7 от Apple. 2014–2015 гг.

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

  • Актуальные тренды веб-дизайна

Оптимален ли минимализм для пользователей?

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

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

Вместо заключения

При разработке макета направляться руководствоваться девизом Мис ван дер Роэ «Меньше — значит больше». Не следует додавать лишних элементов. Это правило возможно применимо для контента, добавления и визуального оформления каких-либо дизайнерских фишек.

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

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

направляться не забывать, что минималистский дизайн сам по себе, без выговора на потребности и интересы аудитории, не приведет к вправду качественному пользовательскому опыту. Хороший пример юзабилити — Windows 8.

Высоких вам конверсий!

По данным: nngroup.comImage source: Abstracted Eye

Случайные статьи:

Краткая история Веб-дизайна


Подборка похожих статей:

riasevastopol