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

 
 
 

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

📆26.10.15 🙋AAKA 👀7 668 💬14
Немножко о дизайне. Часть 2. Уровни детальности

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

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

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

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

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

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


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

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

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

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

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

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

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

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


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



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



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


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


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

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

1.

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


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

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

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

2.

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

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


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






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

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

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

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


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

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

3.

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

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

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


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

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

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

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

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

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

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

Читательское голосование

Нравится

Статью одобрили 89 читателей.

Для участия в голосовании зарегистрируйтесь и войдите на сайт с вашими логином и паролем.
 

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

 

 

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

 

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

Общаемся по статье 💬

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

Комментарии, вопросы, ответы, дополнения, отзывы

 

<

partizan0018

Владимир Читатель Датагора
  • Гражданин
Комментарий # 1 от 26-10-15, 11:42.
Ответить
  • С нами с 14.02.2013
  • 138 комментариев
  • 6 публикаций
 
Интересный материал.
Немного напомнило цикл статей в "Радио" № 9, 10, 11 за 1980 г. "Художественное конструирование радиоаппаратуры"
Тоже одна из немногих публикаций, где рассматривалось влияние формы корпуса и его "загруженности" органами управления на визуальное восприятие готового аппарата. Плюс привязка всего этого к удобству пользования аппаратом. Когда-то прочитал с большим интересом. Как и Ваши статьи. Надеюсь будет продолжение.

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

<

vladimirm2

Владимир Читатель Датагора
  • Гражданин
Комментарий # 2 от 26-10-15, 22:29.
Ответить
  • С нами с 5.01.2010
  • 141 комментарий
  • 14 публикаций
 
Спасибо за такой интересный материал! Всегда, при оформлении новой конструкции, вынашивание дизайна берет больше времени, чем реализация самой конструкции. Это очень важно!

<

antony

Антон Читатель Датагора
  • Гражданин
Комментарий # 3 от 27-10-15, 1:48.
Ответить
  • С нами с 19.12.2008
  • 4 комментария
  • 0 публикаций
 
Спасибо! Прекрасная статья! К стати автодизайнеры иногда делают просто потрясающие "шедевры" — к примеру Фиат Мультипла...

<

Wishmaster

Дмитрий Читатель Датагора
  • Гражданин
Комментарий # 4 от 28-10-15, 3:08.
Ответить
  • С нами с 1.05.2013
  • 111 комментариев
  • 20 публикаций
 
Дизайн это всё, ведь встречают по одёжке)) Если усилитель выглядит как кусок хлама, то убедить заказчика в хорошем звучании сложно, даже если звук и правда шикарный. Предвзятость и всё тут. Я всегда начинаю проект с обдумывания дизайна, делаю пару набросков в фотошопе и только когда получаю удовлетворяющий меня результат, начинаю подгонять схемы под будущий корпус. Обратная последовательность чревата множеством проблем.

<

AAKA

Даниил Читатель Датагора
  • Гражданин
Комментарий # 5 от 28-10-15, 18:26.
Ответить
  • С нами с 25.02.2010
  • 48 комментариев
  • 11 публикаций
 
Спасибо всем за добрые отзывы.

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

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

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

<

Dimonos

Дмитрий Читатель Датагора
  • Гражданин
Комментарий # 6 от 29-10-15, 1:54.
Ответить
  • С нами с 23.02.2010
  • 51 комментарий
  • 3 публикации
 
Хм. Статья как будто обрезана после вступления на первой главе.
Где остальное? Хде показано или написано то, что обещано в шапке?
А там обещано, что мы увидим, почему одно - болванка, а второе - пульт космического корабля.

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

<

Datagor

Игорь Котов Читатель Датагора
  • Главный редактор
Комментарий # 7 от 29-10-15, 4:18.
Ответить
  • С нами с 26.02.2006
  • 2 214 комментариев
  • 273 публикации
 
Цитата: Dimonos
А там обещано, что мы увидим почему одно- болванка, второе пульт космического корабля.

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

<

partizan0018

Владимир Читатель Датагора
  • Гражданин
Комментарий # 8 от 29-10-15, 10:08.
Ответить
  • С нами с 14.02.2013
  • 138 комментариев
  • 6 публикаций
 
Цитата: AAKA
У вас есть этот номер журнала в электронном формате? Интересно почитать статью.


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

<

saloED

Иван Читатель Датагора
  • Гражданин
Комментарий # 9 от 11-11-15, 2:08.
Ответить
  • С нами с 23.10.2009
  • 11 комментариев
  • 0 публикаций
 
Спасибо автору. Для людей с мышлением "ровно квадратно, значит красиво" (это я о себе, если что) очень полезная статья.

<

Maroc

Виталий Читатель Датагора
  • Кандидат
Комментарий # 10 от 20-12-15, 19:05.
Ответить
  • С нами с 6.12.2014
  • 7 комментариев
  • 0 публикаций
 
Даниил, спасибо! Отличные статьи, однозначно беру в закладки. Кратко и доходчиво. Чувствуется опыт преподавания. Понравилось про "визуальную иерархию", ведь интуитивно это ощущал, а словами выразить не мог:). С использованием текстурированных материалов буду теперь бдить. Тема важная и, конечно, ее продолжение актуально. Из известных (мне) материалов - это вышеупомянутые статьи в "Радио" 1980 и книга Бродкина В. М. "Конструирование бытового радиокомплекса", 1975 (МРБ 890). Кстати, там автор предлагает при выборе пропорций прямоугольника интересные соотношения помимо "золотого". В качестве иллюстраций - в основном модели "Грюндига".

<

otzvuk

Александр Читатель Датагора
  • Гражданин
Комментарий # 11 от 21-12-15, 22:34.
Ответить
  • С нами с 16.03.2010
  • 28 комментариев
  • 1 публикация
 
Дополню список источников по данной тематике: Композиция в технике. Год выпуска: 1987. Автор: Ю.Сомов Жанр: Производственное издание. Издательство: Машиностроение. Хорошо бы компьютеризировать мучительный процесс "отсекания всего лишнего" и перемещения по телу нужных пимпочек. У меня, к сожалению, маааленький опыт моделирования навеса к даче и конструкции колоночки типа открытый ящик в 3d системе Google Sketchup. На мой взгляд очень "легкоусвояемая" программулина.

<

Serge3000

Cергей Читатель Датагора
  • Кандидат
Комментарий # 12 от 07-02-16, 3:34.
Ответить
  • С нами с 2.02.2010
  • 1 комментарий
  • 0 публикаций
 
Многие, возможно, слышали о 10 принципах хорошего дизайна Дитера Рамса, думаю в рамках темы можно о них напомнить.

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

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

Лекция Рамса, 1.5 часа, En.


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

<

alexzender

Александр Читатель Датагора
  • Гражданин
Комментарий # 13 от 09-08-16, 23:40.
Ответить
  • С нами с 5.07.2016
  • 23 комментария
  • 2 публикации
 
Полезная статья. Не у всех есть природное чувство гармонии.
По моему скромному мнению, эти довольно простые принципы порой нарушаются даже именитыми брендами: например, усилители Денон - нелепое сочетание аляповатой большой ручки регулятора громкости и миниатюрных кнопочек плюс мелкие надписи на огромной лицевой панели.

Добавить комментарий, вопрос, отзыв 💬

Камрады, будьте корректны и вежливы, соблюдайте правила!


Налетай! Паяльники, станции, жала с доставкой

Офигенная миниатюрная рация на литии BaoFeng UV-5R, 5W, 5-15 км!

Тестер универсальный LCR-TC1 для транзисторов, конденсаторов, ESR, MOSFET и т.д.
  • smilelolhellowinkscepticthumbupbored
    crazybadcryingsadirefulsickstraight
    ballooncakegooddrinksmailbombsun
    nightrainstarscolddashpartyhandshake
    musicnegativenowordspardonshoksleepunknown
    wackoyawnsainthelmethashsmokingwhew


Скопируйте текст вашего комментария на случай неверного ответа на контрольный вопрос.