Новости
25.10.2017
Показатель отказов: от чего он зависит? Показатель отказов: от чего он зависит?

Показатель отказов – важный параметр работы сайта. Он показывает, насколько ресурс интересен и полезен для пользователей. Соответственно, чем ниже процент отказов, тем вы...

18.10.2017
Копия сайта и необходимость ее создания Копия сайта и необходимость ее создания

Несмотря на то, что сайт – это не вещь, его тоже можно потерять. Серьезные проблемы с интернет-порталом могут быть результатом:Посягательств со стороны злоумышленников. П...

10.10.2017
Грамматические ошибки на сайте: накажут ли за них поисковики? Грамматические ошибки на сайте: накажут ли за них поисковики?

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

Мировые новости


05.09.2014
Минимализм и анимация в веб-дизайне

Минимализм и анимация в веб-дизайне

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

 Я столкнулся с понятием красоты сайта. Делюсь наработками.

Картинки для привлечения внимания нет.

Факт 1

Красота сайта равна его удобству, реальной или потенциальной пользе для посетителя.

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

Факт 2

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

Факт 3

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

 Это базовые факты, на основе которых построены выводы ниже.

Минимализм

 Чем выше плотность полезной информации, тем красивее сайт. Важно только содержание. “Дизайн ради дизайна” вредит. Оформительство, стилизации или имитации, которые не помогают раскрытию идеи, ухудшают дизайн. Кнопка может быть плоской, иконка — схематичной, а ссылка — неподчеркнутой. Потому что из простого образа мы считаем его назначение. А блики, тени и выпуклости понижают плотность полезной информации.

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

 В противовес можно привести примеры отличных промо сайтов, построенных на спецэффектах —

lookbook.reebok.com

nike.com/xp/b/genealogyofthefree

ogreen.special-t.com

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

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

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

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

Подборка минималистичных сайтов — siteinspire.com.

Адаптивность

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

Анимация

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

Мы использовали эффект параллакса на сайте rizhik.biz. Он создает искусственный беспорядок, который подчеркивает количество и разнообразие продукции. Другая наша работа — dmbasis.ru, где анимация рассказывает об услугах компании. В этих примерах анимация является содержанием.

 Отличные примеры использования анимации как содержания —

tokyomildfoundation.com

soleilnoir.net/dreamon

dataveyes.com

codeandtheory.com/why-we-make

 Ицелаяколлекцияподобныхсайтов— hoverstat.es.

Источник