x
 
Артём Розанов
25 сентября 2011

Приветствую, Андрей!

Я решил нарисовать иконки для двух своих жёстких дисков Ласи Брик — ради облагораживания рабочего стола и для поддержания тонуса. Дойдя до представленной стадии, я остановился, чтобы не делать лишнюю работу, ведь при моём системном размере иконок в 40×40 пикселей иконки уже выглядят вполне удовлетворительно.

Но, думая о возможном продолжении и задаваясь вопросами «правильно ли я их осветил», «стоит ли скруглять грани у корпусов» или, скажем, «достаточно ли условна тень, которую они отбрасывают» (параметры как у тени от системного диска мне подобрать не удалось), я сформулировал главный вопрос: где вообще проходит грань между реализмом и условностью в рисовании таких иконок? Например, Machintosh HD выглядит довольно натурально, но при этом он весь из очень утрированных деталей.

И да, какие косяки я не заметил? Благодарю наперёд.



И вам привет, Артём!

Мне думается, вопросы дизайна очень субъективны. Грань между реализмом и условностью в своих работах вы вольны выбирать сами. Полагайтесь на своё мнение, у всех остальных оно всё равно будет несколько отличным от вашего.

Условность — сестра стилизации. Любая из стилизованных форм может быть красива сама по себе.

Чтобы вы чувствовали себя уверенно в своей позиции, ваше мнение должно быть логически или эстетически подкреплено. В конце концов, всё сводится к вопросам: зачем? для чего? В чём смысл элемента? Какие у него функции? Ответив на эти вопросы, вы поймёте, какая нужна степень детализации и как элемент будет стилизован.

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

Но, возможно, вы фанат «Лего». Тогда ваш рабочий стол может быть весьма дружелюбен к такой иконке и в таком контексте иконка будет выглядеть хорошо:

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

Теперь о самой иконке. Вы выбрали реалистичную стилизацию, в которой есть только упрощение формы, но не её искажение. Сглаживать или не сглаживать углы, до какой степени детализировать блики — дело вашего вкуса, но геометрия и пропорции страдать не должны. Обратите внимание, что ваши пимпочки малы в высоту и общая форма кирпичика «Лего» не считывается:

Плохо проработана светотень, форма совсем не выражена. Быстрыми штрихами можно поправить ситуацию:

Степень детализации и прорисовки, очевидно, зависит и от размера изображения. В вашем случае в большом размере иконка сильно проигрывает «маковской». Но в уменьшенном виде, при должной доработке, может выглядеть неплохо благодаря свой малой детализации и более крупным элементам:

Действуйте уверенно и смело. При этом делайте так, как вам нравится. Объективная оценка, конечно, возможна, но в деталях она у каждого своя.

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

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

Комментарии

Иван Демидов
25 сентября 2011

Шикарная иллюстрация, продемонстрированная Андреем к вопросу об условности и реализме, напомнила байку о Пикассо.

«Молодой человек сидит в купе поезда, проходящего через города Испании. Как вдруг узнаёт в человеке, сидящем на соседнем диване, Пабло Пикассо, Великого художника. Набравшись смелости, молодой человек говорит: «Синьор Пикассо, вы, конечно, известный художник, но почему ваши картины такие изломанные и перекрученные? Почему бы вам не рисовать реальность?»

Пикассо, глубоко вздохнув, спрашивает: «А как, по вашему мнению, выглядит реальность?»

Молодой человек, волнуясь, достает из нагрудного кармана пиджака фотографию: «Ну, например, вот так. На этой фотографии моя жена».

Пикассо берёт карточку, вглядывается в неё и бледнеет: «В самом деле? У вас такая маленькая, чёрно-белая, односторонняя и плоская жена?»

Александр Судьин
25 сентября 2011

Андрей, благодарю, что делитесь опытом, но в данном случае «пимпочки» должны быть совсем невысокими, такие они на продукте.

Меня сразу смутило, что «лобовая» часть смотрелась не перпендикулярно к поверхности, на которой стоит.


5 октября 2011

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

Сергей Кардашев
6 сентября 2014

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

А у леговского диска тень под диском и чуток выползает вперёд, в то время как должно быть под ним и чуток справа (свет-то спереди слева).

Прав ли я, при условии что мы рисуем реалистично?


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

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

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

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

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




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

1 3 Правдивость 3 Как сделать, чтобы публикация выделялась в ленте: композиция, исправление дефектов, цвет 1