x
 
Николай Товеровский
1 января 2012

Андрей, расскажи, пожалуйста, за пять минут всё, что должен знать дизайнер интерфейсов о тенях.



Николай!

Дизайнер интерфейсов может вообще ничего не знать о тенях. И это не помешает ему быть прекрасным дизайнером интерфейсов :-)

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

Падающая тень поможет вам различно ориентировать иконку в пространстве. Тень создаёт плоскость под пиктограммой. Например, с помощью тени вы можете подвесить иконку в невесомости на различном расстоянии от поверхности:

Тень может положить плоскость «на лопатки»:

Манипулировать плоскостью, изменяя её ориентацию:

Даже помочь утопить вашу иконку в плоскости:

Ну и, конечно, с помощью теней можно создавать слои и уровни:

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

P. S.
Это был воскресный совет о техническом дизайне и графике. Хотите узнать всё о композиции, светотени, пикселях, ретуши и карамелизации микроволновок? Присылайте вопросы.

Поделиться
Отправить

Комментарии

Алексей Мельников
1 января 2012

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


Цель рубрики — обсуждение вопросов дизайна всех видов, текста в дизайне и взаимоотношений дизайнеров с клиентами.

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

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

Вот такой веб 2.0.

1 4 4 Какого цвета должна быть человеческая кожа на фотографии? 2




Недавно всплыло

Как найти себе замену 1 Как совместить информационный стиль и текст для поисковиков? 7 Хочу научиться сторителлингу 12 Хочу научиться сторителлингу 2