Вольный перевод стать webdesignerdepot с моими очень предвзятыми комментариями
Хороший дизайнер знает, что минималистский дизайн позволяет добиться отличных результатов. Тем не менее, многие дизайнеры считают этот стиль проблематичным.
(то ли им кажется, что веб страница не забитая по самую макушку будет выглядеть непрофессионально, то ли не замечают эстетики деталей)
Правда сейчас в интернете появились все больше статьи на тему минимализма в веб-дизайне, да и весь web2 построен воздухе и акценте деталей. Вот и Kayla Knight тоже решила написать о том, как с помощью минимализма можно добиться прекрасных, стильных результатов.
А на десерт небольшая подборка хороших примеров сайтов выполненных в стиле минимализма
Что же представляет собой минимализм в веб-дизайне?
В принципе минимализм построен на чистоте форм без использования лишних элементов, текстур и остальных фентифлюшек. На первый план выдвигается содержание и простота. То есть не отвлекать зрителя от идеи, а дать возможность свободно путешествовать в информации.Этот стиль давно известен (например, в Японии), но активно его начали лет десять тому в Швеции. Откуда через сми он перебрался во все области дизайна: графический дизайн, архитектуру, музыку, литературу, живопись и, совсем недавно в веб-дизайн.
(честно признаю я пока не слышала минимализм в музыке)
На заре Интернета весь веб-дизайн был минималистичным, но с расширением каналов и появлением java и flash все дружно начали использовать чрезмерную графику. И хотя за последние пару лет вы уже почти не встретите мигающих логотипов и цветовой палитры из 40 цветов, но все равно дизайн все еще буйный и властный.
Давайте пройдемся по основам минимализма в приложении к веб-дизайну. Конечно, никто вас не заставляет с головой прыгать в это направление, но некоторые приемы пригодятся в любом проекте.
(Основой минимализма всегда была лаконичность форм, сведения их к простым геометрическим фигурам. Ничего лишнего. На мой взгляд этот стиль построен на доверии к воображению зрителя. В этом стиле культивируются открытое пространство, подчеркивается эстетика простоты и точности, все элементы должны быть тщательно продуманы так чтобы у человека оставалась возможность домыслить композицию по своему вкусу.
У каждого элемента должен быть легкий силуэт, и даже при этом элементов должно быть очень не много. Никакого декора или орнаментов, только ясность композиции. Меня частенько обвиняют в скупости дизайна. Но я все равно считаю, что сдержанная графическая гамма и небольшие цветовые всплески всегда выигрывают по сравнению выпирающим дизайном.)
Лучшее враг хорошего
Еще раз повторюсь что основой минимализма является смысловое содержание, для того чтобы не отвлекать пользователя от сути и не дать ему утонуть в море элементов.
Вот пример такого дизайнерского решения: белый фон, большой промежуток между текстовым блоком и графическим элементом. Таким образом, выигрывает и текст, и графический элемент который хорошо подчеркнул идею дизайнера. Без отступа такой сложный элемент просто бы не смотрелся и развалил всю композицию. А выкинув все лишнее, дизайнер добился идеального баланса.( Мне не нравится название «отступ, промежутки» для меня это в первую очередь воздух который позволяет:
- дышать композиции
- подчеркивает каждый элемент
Как минимизировать дизайн?
Первым шагом в создании минималистского дизайна, будет не тупое нажатие клавиши делит, а переосмысление содержания в поисках структуры проекта. Только в этом случае наиболее важные элементы будут работать в соответствии с ТЗ.Уже на стадии проектирования выделяйте основные элементы сайта и оставляйте только те, что действительно нужны: логотип, навигация, текст и не используйте ничего не существенного.
Выбрасывайте как можно больше.
Ниже приведены некоторые элементы, которые быстрее всего не нужны. Конечно, всё зависит от приоритетов данного сайта, но чаще всего можно не загромождать страницу лишними отвлекающими деталями.
Имейте в виду, что это только рекомендации.
- Всякие айконы социальных сетей
- Дополнительные описания
- “В избраное”, “Популярное” и “Последние” списки (типа Twitter и RSS feed lists)
- Линки на не основные страницы. Тоесть оставить классические "Введение", "О нас" и "Услуги"
- Промежуточные страницы навигации.
( Эта рекомендация сложно выполнима в реальных условиях, когда дизайнер пытается работать зажатый идеями заказчика и рекомендациями промоутера. Но мысль верная: легче не впустить чем потом избавиться. )
Используйте внутреннюю структуру.
Тоесть выделите иерархию содержания, и уже ей придавайте простую и наглядную форму. Если рассматривать примеры, то видно, что дизайнеры подстегивали интерес зрителя с помощью всплесков цвета, интересной типографики или нестандартной формой, но основой все равно являлась внутренняя логика содержания сайта.
Конечно, намного сложнее удерживать внимание с помощью минимальных средств, но лаконичная структура поможет вам вести вашего пользователя именно туда куда надо. Для этого рекомендуем:
1. Определить, какое содержание действительно необходимо для данного проекта
2. Определите приоритеты содержания
3. На основании этого списка создать эскиз, который визуально подчеркивает эту структуру.
Тут надо учитывать как размещение информации, так и визуальное решения. Например, если ваш логотип имеет цвет, то не допускайте повторного использования этих цветов в других элементах
(очень не согласна с этой рекомендацией. Обычно сайт обязан поддерживать логотип и весь бизнес-стиль в целом. Поэтому эти цвета уже никуда не деть. Я бы порекомендовала наоборот, активнее использовать цвет из логотипа и его градацию. Давайте все таки без фанатизма)
Пустое пространство. (Тобишь воздух)
Свободное пространство практически синоним минимализма. Без него не возможно создать приличный дизайн ( ни в одном из стилей), но в минимализме пустое пространство является основным инструментом юзибилити проекта. ( Тоесть если к обычным, рекомендованным веб2 отступам добавьте еще столько же вокруг каждого элемента получится настоящий минимализм). Конечно, при этом не стоит разрушать композицию сайта.
Баланс, выравнивание, контрастность
В минимализме особое значение имеют контраст, выравнивание и баланс. Если вы опираетесь на эти три кита, то будьте уверены, результат будет отличным и вам не понадобиться еще какие-то детали для завершенности дизайна. При этом не забывайте о "Принципах дизайна" для новых идей.
( на мой взгляд, минимализм потому и не любят, что в нем особо оголяются все просчеты композиции и неряшливость разработки. Как не странно, но именно в этом стиле приходится выверять весь дизайн до пикселя. Намного проще зафигачить веселенький фончик и не морочить себе голову с каждой деталью. )
Если избыточный дизайн стал привычкой
Для того чтобы избавится от схемы мышления «а что бы еще сюда запихнуть?» необходимо наработать новые навыки. Попробуйте в любом новом проекте использовать основные принципы минимализма хотя бы в первом эскизе. К примеру, упростите содержание и уделите должное внимание воздуху страницы.
Пересмотрите свои работы с точки зрения минимализма, и вы сможете заметить новые способы подачи информации без использования вычурных элементов. Можете обсудить со своим коллегами эту тенденцию (на спор! кто больше выкинет из эскиза не в ущерб смысла?).
Ниже приведены яркие образчики минимализма.
1. All Day
2. Lonely
3. DBushell
4. Toy NY
5. Symour Powell
6. Ah-Studio
7.Blumenthal
Некоторые тенденции
Как вы могли заметить, минимализм в веб-дизайн явную тенденцию к росту. Осознавая эти тенденции, вы сможете заметно улучшить ваш дизайн в целом.Черное и белое
Одна из наиболее заметных тенденций это широкое использование черного и белого. Это достаточно очевидно: цвет должен быть упрощен вместе с фактурой, формой и содержанием. Но эта тенденция может стать чрезмерной в наши дни, и выглядеть немного скучной.Посмотрите на сайт, который с помощью минимума цвета смог добиться отличных результатов.
Интересная типографика
Типографика в веб-дизайне тесно связана с минимализмом.
Для привлечения внимания посетителя дизайнеров так и тянет использовать нестандартные шрифты. Иногда они заходят до такой степени, что используют ее в качестве единственного визуального элемента.
Это смелый ход, но еще тенденция сама по себе. Ищите способы сделать графическое оформление текста интересным при этом, оставаясь уникальной.
( как было хорошо пока на веб-сайтах можно было использовать только шрифты из безлопастного набора: Arial, TimesNewRoman, Verdana Georgia, Courier New,Tahoma. Теперь с приходом технологиий замены стандартных шрифтов на сайте, которая позволяет использовать любой шрифт для текста а не только на картинке, интернет может соревнованием «у кого самые крутые шрифты». Но обычный пользователь не хочет вглядываться в дичайшие текстовые эффекты и восхищаться шрифтами. Он хочет не наряжно читать, выделять интересные куски, выражать свое мнение. Ну так дайте ему все это, а не отвлекайте шрифтами, сдобренные кучей скриптов на каждое движение мышки )
Flash
Удивительно, но растет число минималистского дизайна флеш-сайтах. В таких сайтах для визуальной стимуляции используются анимации (например, текстовые выцветания или уменьшение текста). Кроме того, флэш снимает некоторые ограничения в процессе проектирования. Нетрадиционную структуру, типографику и другие элементы намного проще донести с помощью Flash, чем традиционными методами.Заключение
Минималистский дизайн проявляется во многих формах, но слишком часто мы видим слепое повторение стандартных решений, вместо разумного использования тенденции, которая имеет смысл.В любом случае, минимализм может быть красивым и будет востребованным еще долгие годы, поэтому изучение основ этого стиля может быть невероятно полезным, как для ваших клиентов или собственных проектов.
И даже если вы не хотите работать в стиле минимализма, то основные принципы, помогут создавать более стройную структуру, а это всегда хорошо.
Written exclusively for Webdesigner Depot by Kayla Knight.
Ну а теперь мое краткое мнение о минимализме в веб дизайне.
В чистом, классическом виде минимализм может себе позволить только сайты где размещено очень много текста для специалиста и вот там уже очень важно использовать весь набор минимализма: иерархия, никаких деталей, сухая констатации информации.
В остальных сайтах превалировать должно тот посыл который хочет донести заказчик к своим просителям. Но заказчикам, которые хотят произвести впечатление респектабельности и профессионализма и я предлагаю дизайн-решения разработанные на основе минималистичного стиля
1. Минимум цветов (1-2 из бизнес стиля + градация этих цветов)
2. 3 шрифта (каждое начертание считается отдельным шрифтом)
3. Никакой анимации (ни в баннерах, ни тем более в тексте)
4. Лаконизм (не стоит считать своих посетителей полными идиотами которые только и могут «нажать тут»
5. Стройна структура (за три клики добраться куда нужно)
6. Весь дизайн строится на модульной сетке ( в идиале 960 grid system)
Вот и весь минимализм в действии.
Спасибо, мне очень понравилось, мне кажется минимализм в отличии от web 2.0, пришел на долго.
ОтветитьУдалить