» » » Немножко о дизайне. Часть 2. Уровни детальности

 
 
 
14

Немножко о дизайне. Часть 2. Уровни детальности

Разместил AAKA 26 октября 2015. Просмотров: 5 068

Немножко о дизайне. Часть 2. Уровни детальности

Не прошло и двух лет с прошлой статьи о дизайне "Немножко о дизайне. Часть 1: передняя панель". Попробуем продолжить.

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

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

Задача первая: понять, что такое уровни детальности и на что они влияют

Уровни детальности есть композиционное соотношение и деление элементов по размеру. Наличие, отсутствие и их количество напрямую влияет на восприятие объекта.

Уровни детальности (за редким исключением) делятся на три части: общая форма, основные элементы и мелкие детали.


Первый уровень детальности – общая форма предмета или детали

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

Уровень второй – геометрическое, визуальное или цветовое деление на основные массивные детали

Представьте теперь, что отошли от дома метров на 300 (солнце отодвинем в сторону, чтобы не слепило). Что вы видете? В первую очередь, общую форму дома (первый уровень), так же вы можете разглядеть разделение между этажами, оконные проемы, покрашенный в иной цвет фундамент здания, трубу камина, поднимающуюся во всю высоту дома.
Это деление или элементы второго уровня.

Третий уровень – детали (маленькие до микроскопических, если сравнивать с первым и вторым уровнем детальности)

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

Хороший пример для понимания сути

Я немного поглумился в фотошопе над пистолетом, чтобы получился хороший пример.


Уровень первый — общая форма.



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



Третий уровень – кнопочки, винтики, заклепки, текстуры, надписи и т.д. Этот уровень дополняет картину и болванка превращается в законченное устройство.


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


Задача вторая: разобраться и понять как с этим работать или «или как болванка превращается в пульт управления полета»

Так как объяснить на словах немного сложновато и придется залазить «по пояс» в композицию и пропорции, попробую добавить немного картинок с простыми формами, а некоторые специально буду немного утрировать для наглядности.

1.

Начнем с первого уровня – он определяет основные пропорции будущего объекта.
Но как он связан с уровнями детальности, спросите вы, это же обобщающая форма?
Если взять как пример изготовление какого-либо устройства (например, усилитель), то общая форма может быть простой (не детальной, не перегруженной)


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

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

Однако не поймите меня заведомо неверно – я не имею ввиду, что плоская коробка это идеальное решение. Вовсе нет! Просто с более сложными формами придется вложить гораздо больший объем работы и мысли. Если вы готовы, это того стоит.
Если время на планирование ограничено, то выбирайте более простые формы.

2.

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

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


Например: первая картинка – «Подслеповатый верзила». Дальше сами.






Изменением размеров и расположением деталей можно менять композицию и получать разное «ощущение» от объекта – легкий, приземистый, глупый, улыбчивый, горбатый, массивный, довольный, устойчивый и так далее. О принципах композиции конечно нужно писать отдельную статью, и вероятно не одну.

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

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

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


Для дополнительного упрощения можно взять ножницы и два вида бумаги – белую и темную (нам нужен контраст). Из белой вырежьте примерную форму вашего объекта или, например, вид спереди, желательно один к одному. Из темной бумаги вырежьте кружки и квадратики разного размера, которые будут ручками и ножками вашего объекта (несколько размеров для каждого элемента).
Затем накладывайте и передвигайте их. Лучше при этом ещё и фотографировать варианты, а затем на компьютере пролистывать, смотреть и сравнивать – так гораздо легче.
Да, это занимает время, но поверьте мне, не в пустую, если конечно вы хотите, чтобы ваш девайс выглядел достойно.

А теперь вопрос на засыпку, хотя думаю ответить теперь будет не сложно. Почему мы даем имена некоторым предметам, а некоторые так и прозябают безымянными?

3.

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

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

В деталях третьего уровня важно знать меру! Они должны дополнять, а не заполнять!
В пиджаке платочек треугольничком только в одном кармане. Это изюминка и дополнение, согласитесь если растыкать платочки по всем карманам это уже безвкусица.
Важно – глаз должен цепляться за детали только на мгновение и затем снова переходить к созерцанию объекта в целом.
Детали являются свидетелями продуманности и конструктивности, вложенной в разработку изделия, но их должно быть в меру.


Старайтесь не перегружать дизайн деталями. Это очень отвлекает. Крепеж, например. Постарайтесь подобрать цвет в тон конструкции или плоскости, на которой «сидит» болтик. Лучше, когда он привлекает внимание только формой. Если есть возможность загнать болтик впотай — ещё лучше!

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

Если элементов много, а место ограничено, постарайтесь объединить их в группы, а вокруг создать свободное пространство, чтобы глаз мог отдохнуть. Элементы важно располагать относительно друг друга – например, все ручки можно выровнять по линии относительно центров окружностей, по верхней, или нижней части, то же самое и относительно групп элементов.

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

К этой части статьи картинок я не делал. Вместо этого и как заключение предлагаю посмотреть на работы Дитера Рамса (Dieter Rams), главного дизайнера фирмы Braun.

На примере его работ можно проанализировать и лучше понять принципы детальности и композиции. Кстати можно обнаружить, что многие дизайны фирмы Apple буквально списаны слизаны с его работ.
• Обширный сборник работ Дитера Рамса в высоком качестве и с описаниями (en.)
• Блог по дизайну компании Braun.

Надеюсь, что у меня получилось передать мысль и статья будет вам полезна.
Красоты всем!
Даниил
Даниил (AAKA)
Израиль, Тель-Авив (бывш. харьковчанин)
Профиль AAKA
Уровень моих электронных познаний: вроде понял как работает, спаял, и даже немного настроил.
По профессии промышленный дизайнер, работаю преподом в институте и потихоньку свои проекты продвигаю.
Самое большое увлечение, из миллиона разных, это починить чего-нибудь.
 

Понравилось? Палец вверх!

  • всего лайков: 87

Поделись с друзьями!

Связанные материалы:


Схема на Датагоре. Новая статья Пусть всегда будет солнце!... Сегодня День Победы. Мы так долго живём без войны, что начали забывать, что это такое, а без этой...
Схема на Датагоре. Новая статья Литье из эпоксидной смолы ЭДП в радиолюбительской практике... Примеры изделий из эпоксидки. Под пузырьком — «виновник» статьи Эпоксидный клей ЭДП — интересный...
Схема на Датагоре. Новая статья Возвращаясь к напечатанному. Стрелочный индикатор на микроконтроллере Attyny13... В поисках чего бы ещё собрать в плане изучения МК, нашел датагорскую статью «Стрелочный индикатор...
Схема на Датагоре. Новая статья Датагорский проект 10 "Water Tank Controller". Модификация блока управления для полива... Привет, друзья! Последний раз я имел дело с микроконтроллерами лет 20 назад, во время ПК типа...
Схема на Датагоре. Новая статья Полный усилитель на микросхемах. Часть 5-2. Компенсация сопротивления соединительных проводов акустических систем... Не мечтай, действуй! Интерфейсные искажения, возникающие между УМЗЧ и акустической системой, явно...
Схема на Датагоре. Новая статья Немножко о дизайне. Часть 1. Передняя панель... Сколько сайтов по усилителям не обошел, сколько не расчесывал интернет, тему дизайна всегда...
Схема на Датагоре. Новая статья Программный генератор сигналов звуковой частоты.... Предлагаемая Вашему вниманию программа позволяет использовать звуковую карту компьютера в качестве...
Схема на Датагоре. Новая статья Солнечное затмение!... Я сегодня видел полное солнечное затмение и даже умудрился заснять его! Это было неописуемое...
Схема на Датагоре. Новая статья Программа - осциллограф... Простой и очень удобный осциллограф для просмотра сигнала. Программа-эмулятор осциллографа,...
Схема на Датагоре. Новая статья Электронные устройства для дома. Евсеев А. Н.... Евсеев Андрей Николаевич Электронные устройства для дома. — М.: Радио и связь, 1994г. — 144 с: ил....
Схема на Датагоре. Новая статья Полупроводники. Часть первая: Электрические свойства полупроводников.... Эта статья в основном предназначена для тех, кто только-только начал первые шаги в области...
Схема на Датагоре. Новая статья M5230L/FP... Прецизионый интергральный двухканальный стабилизатор M5230L. Нормированный уровень шумов (не более...
<
  • Гражданин
26 октября 2015 11:42

Владимир / partizan0018

Цитата
  • С нами с 14.02.2013
  • Ушёл в реал Пользователь offline
  • 138 комментариев
  • 6 публикаций
 
  • +3
Интересный материал.
Немного напомнило цикл статей в "Радио" № 9, 10, 11 за 1980 г. "Художественное конструирование радиоаппаратуры"
Тоже одна из немногих публикаций, где рассматривалось влияние формы корпуса и его "загруженности" органами управления на визуальное восприятие готового аппарата. Плюс привязка всего этого к удобству пользования аппаратом. Когда-то прочитал с большим интересом. Как и Ваши статьи. Надеюсь будет продолжение.

Жаль, что в реале чаще приходится "совмещать несовместимое". То есть размещать на случайно попавшем в руки корпусе не менее случайно попавшие в руки кнопки, ручки, лампочки и т. п. Иногда, правда, получается что-то более-менее неплохо выглядящее smile

<
  • Гражданин
26 октября 2015 22:29

Владимир / vladimirm2

Цитата
  • С нами с 5.01.2010
  • Ушёл в реал Пользователь offline
  • 131 комментарий
  • 14 публикаций
 
  • +2
Спасибо за такой интересный материал! Всегда, при оформлении новой конструкции, вынашивание дизайна берет больше времени, чем реализация самой конструкции. Это очень важно!

<
  • Кандидат
27 октября 2015 01:48

Антон / antony

Цитата
  • С нами с 19.12.2008
  • Ушёл в реал Пользователь offline
  • 4 комментария
  • 0 публикаций
 
  • +2
Спасибо! Прекрасная статья! К стати автодизайнеры иногда делают просто потрясающие "шедевры" — к примеру Фиат Мультипла...

<
  • Гражданин
28 октября 2015 03:08

Дмитрий / Wishmaster

Цитата
  • С нами с 1.05.2013
  • Ушёл в реал Пользователь offline
  • 84 комментария
  • 14 публикаций
 
  • +1
Дизайн это всё, ведь встречают по одёжке)) Если усилитель выглядит как кусок хлама, то убедить заказчика в хорошем звучании сложно, даже если звук и правда шикарный. Предвзятость и всё тут. Я всегда начинаю проект с обдумывания дизайна, делаю пару набросков в фотошопе и только когда получаю удовлетворяющий меня результат, начинаю подгонять схемы под будущий корпус. Обратная последовательность чревата множеством проблем.

<
  • Гражданин
28 октября 2015 18:26

Даниил / AAKA

Цитата
  • С нами с 25.02.2010
  • Ушёл в реал Пользователь offline
  • 48 комментариев
  • 11 публикаций
 
  • +1
Спасибо всем за добрые отзывы.

Владимир (partizan0018) - У вас есть этот номер журнала в электронном формате? Интересно почитать статью.

Антон - Ну как говорится в семье не без урода, зато внутри просторно и комфортно. :)

Дмитрий - Согласен на двести процентов, так держать!

<
  • Гражданин
29 октября 2015 01:54

Дмитрий / Dimonos

Цитата
  • С нами с 23.02.2010
  • Ушёл в реал Пользователь offline
  • 49 комментариев
  • 3 публикации
 
  • 0
Хм. Статья как будто обрезана после вступления на первой главе.
Где остальное? Хде показано или написано то, что обещано в шапке?
А там обещано, что мы увидим, почему одно - болванка, а второе - пульт космического корабля.

А из того что есть все замечательно, но этого очень мало.
Надо еще 3 раза по столько, с примерами. good

<
  • Главный редактор
29 октября 2015 04:18

Игорь Петрович Котов / Datagor

Цитата
  • С нами с 25.02.2011
  • Ушёл в реал Пользователь offline
  • 1 652 комментария
  • 265 публикаций
 
  • 0
Цитата: Dimonos
А там обещано, что мы увидим почему одно- болванка, второе пульт космического корабля.

Дмитрий, так прочитать нужно статью и всё найдётся.
Может быть у вас на вашем модном планшете опять что-то не отображается? crazy

<
  • Гражданин
29 октября 2015 10:08

Владимир / partizan0018

Цитата
  • С нами с 14.02.2013
  • Ушёл в реал Пользователь offline
  • 138 комментариев
  • 6 публикаций
 
  • 0
Цитата: AAKA
У вас есть этот номер журнала в электронном формате? Интересно почитать статью.


Журналы есть. Отписался в личку.

<
  • Гражданин
11 ноября 2015 02:08

Иван / saloED

Цитата
  • С нами с 23.10.2009
  • Ушёл в реал Пользователь offline
  • 10 комментариев
  • 0 публикаций
 
  • 0
Спасибо автору. Для людей с мышлением "ровно квадратно, значит красиво" (это я о себе, если что) очень полезная статья.

<
  • Кандидат
20 декабря 2015 19:05

Виталий / Maroc

Цитата
  • С нами с 6.12.2014
  • Ушёл в реал Пользователь offline
  • 4 комментария
  • 0 публикаций
 
  • +1
Даниил, спасибо! Отличные статьи, однозначно беру в закладки. Кратко и доходчиво. Чувствуется опыт преподавания. Понравилось про "визуальную иерархию", ведь интуитивно это ощущал, а словами выразить не мог:). С использованием текстурированных материалов буду теперь бдить. Тема важная и, конечно, ее продолжение актуально. Из известных (мне) материалов - это вышеупомянутые статьи в "Радио" 1980 и книга Бродкина В. М. "Конструирование бытового радиокомплекса", 1975 (МРБ 890). Кстати, там автор предлагает при выборе пропорций прямоугольника интересные соотношения помимо "золотого". В качестве иллюстраций - в основном модели "Грюндига".

<
  • Гражданин
21 декабря 2015 22:34

Александр / otzvuk

Цитата
  • С нами с 16.03.2010
  • Ушёл в реал Пользователь offline
  • 26 комментариев
  • 1 публикация
 
  • +1
Дополню список источников по данной тематике: Композиция в технике. Год выпуска: 1987. Автор: Ю.Сомов Жанр: Производственное издание. Издательство: Машиностроение. Хорошо бы компьютеризировать мучительный процесс "отсекания всего лишнего" и перемещения по телу нужных пимпочек. У меня, к сожалению, маааленький опыт моделирования навеса к даче и конструкции колоночки типа открытый ящик в 3d системе Google Sketchup. На мой взгляд очень "легкоусвояемая" программулина.

<
  • Кандидат
7 февраля 2016 03:34

Cергей / Serge3000

Цитата
  • С нами с 2.02.2010
  • Ушёл в реал Пользователь offline
  • 1 комментарий
  • 0 публикаций
 
  • 0
Многие, возможно, слышали о 10 принципах хорошего дизайна Дитера Рамса, думаю в рамках темы можно о них напомнить.

Дитер Рамс: десять принципов хорошего дизайна

1.Хороший дизайн инновационный
2.Хороший дизайн делает продукт полезным
3.Хороший дизайн эстетичный
4.Хороший дизайн помогает продукту быть понятным
5.Хороший дизайн ненавязчивый
6.Хороший дизайн честный
7.Хороший дизайн надёжный
8.Хороший дизайн продуман до мельчайших деталей
9.Хороший дизайн беспокоится об окружающей среде
10.Хороший дизайн — это как можно меньше дизайна

более подробный разбор каждого пункта по ссылке (англ):https://www.vitsoe.com/gb/about/good-design

Хороших разработаок!

//4brain.ru/blog/дитер-рамс-10-правил-хорошего-дизайна/

Лекция Рамса, 1.5 часа, En.
https://www.youtube.com/watch?v=KPWMFrMA52Y

<
  • Кандидат
9 августа 2016 23:40

Александр / alexzender

Цитата
  • С нами с 5.07.2016
  • Ушёл в реал Пользователь offline
  • 12 комментариев
  • 2 публикации
 
  • 0
Полезная статья. Не у всех есть природное чувство гармонии.
По моему скромному мнению, эти довольно простые принципы порой нарушаются даже именитыми брендами: например, усилители Денон - нелепое сочетание аляповатой большой ручки регулятора громкости и миниатюрных кнопочек плюс мелкие надписи на огромной лицевой панели.

Добавление комментария


Налетай! Паяльники, станции, жала с доставкой
  • smilelolbyewinkyahoocoollaughing
    crazybadcryingsadirefulsickstraight
    ballooncakegooddrinksmailbombsun
    nightrainstarscolddashguitar-manhandshake
    musicnegativenopardonshoksleepunknown
    wackoyawnblushbullyhashsmokingwhew
Скопируйте текст вашего комментария на случай неверного ответа на контрольный вопрос.