Interview questions - UX-UI.md

Заметки по UX/UI

Понятия

• Когнетика - отрасль пси­хо­ло­гии, которая ис­сле­дует по­зна­вательные про­цес­сы, такие, как память, внимание, чувства, представления информации, логическое мышление, воображение, способности к принятию решений[1][2

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

• UI дизайнер - придумывает, как каждый из этих шагов будет выглядеть Человек, который думал, какой величины будет камень, какого цвета выбрать дерево для подставки и чем скрепить деревянные жерди (гвоздями или кожаными жгутами?) и какой длины будет ручка, был UI дизайнером.

• Интерфейс - тот способ, каким бы вы затачивали меч назывался бы интерфейс.

Книги

• Дональд Норман - Дизайн привычных вещей (1988)
  • когнетика
  • психология
  • ошибки
  • дизайн
  • ориентация на пользователя....
• Алан Купер - Психбольница в руках пациентов (2004)
  • персонажи
  • для конкретного персонажа, без "резиновых персонажей"
  • цели человека на сайте (по рейтингу)
    • личные - не чувствовать себя глупо, не ошибиться...
    • практические - перезвонить вовремя клиенту
    • корпоративные - увеличить прибыль
  • сценарии работы посетителя (повседневные, обязательные (не часто, но критично), исключительный)
  • общий словарь для всех участников процесса разработки
  • проектирование взаимодействия (Проектирование UI → Дизайн → Программирование → Тестирование)
  • подробная документация
• Алан Купер - Об интерфейсе (2009)
  • целе-ориентированное проектирование
  • ментальные модели
  • исследования
    • поведение, взгляды, склонности потенциальных пользователей продукта;
    • предметную область – технический, экологический и деловой контексты разрабатываемого продукта;
    • используемый лексикон и прочие социальные аспекты предметной области;
    • способы применения существующих продуктов - модели пользователей
  • шаблоны проектирования взаимодействия
  • метафоры и идиомы
  • визуальный дизайн
• Влад Головач - Дизайн пользовательского интерфейса. Искусство мыть слона (2 издания, 2001 и 2010)
  • 4 основных (остальные – производные) критерия качества интерфейса:
    • скорость работы пользователей,
    • количество человеческих ошибок,
    • скорость обучения
    • субъективное удовлетворение пользователей
• Влад Головач - Культура дизайна (тоже два издания, 2014 и 2017)
• Джеф Раскин - Интерфейс. Новые направления в проектировании компьютерных систем
  • человекоориентированные интерфейсы
  • когнетика и локус внимания
  • мифы, например новичок/эксперт
  • квантификация
  • унификация
  • навигация
• Стивен Круг - "Юзабилити" (2003, 2005, 2008) Или "Веб-дизайн". Ещё "Не заставляйте меня думать"
  • не заставляйте меня думать
  • опускаем лишние слова
  • разработка навигации
  • юзабилити тестирование + интерпретация
• Адриан Форти - Объекты желания (1986)
• Эдвард Тафти
  • Представление информации
  • The Visual Display of Quantitative Information
  • Envisioning Information
  • Visual Explanations: Images and Quantities, Evidence and Narrative
  • Beautiful Evidence
• Юрий Гордон - Книга про буквы от Аа до Яя
• Ральф Каплан - С помощью дизайна (2005)
• Ян Чихольд - Новая типографика. Руководство для современного дизайнера
• Ян Чихольд - Образцы шрифтов ()
• Ян Чихольд - Облик книги. Избранные статьи о книжном оформлении и типографике

Тренды

• Material design как методология дизана
• дизайнеры in home - т.е. как часть команды
• Figma и Scetch как инструменты. Axure - хорошая интерактивность. Adobe XD и Google (gallery.io, плагин для Scetch Material Theme Editor) -отстают]

Некоторые события 2014-2018

• 2018 весна - презентация Google Material Design 2.0

  • Новые шрифты - гарнитура Product Sans вместо Roboto
  • Больше прозрачного и белого, больше пространства
  • Движение в сторону минимализма
  • Больше скурглений (безрамочные экраны)
  • Навигация всё больше уходит вниз, т.к. устройства больше и длинее (нет рамок)
  • Более яркие и чистые цвета. Использование четырех основных цветов логотипа в качестве визуального языка
  • Навигация по системе в духе iPhone X. Паттерн «рукоятки» вместо кнопки «Домой» с почти аналогичной механикой, отказ от отдельной кнопки списка приложений (также вызывается свайпом снизу) и ставшая официальной в последние годы нижняя панель навигации.
  • Новые инструменты - плагин Material Theme для Sketch, наборы иконок, библиотеки компонент
  • Превращение в полноценную дизайн-систему - с компонентами в коде, а не просто масштабные гайдлайны и шаблоны к ним с какими-то разрозненными примерами. Эти компоненты также поддерживают тематизацию, так что система выглядит целостной (сами компоненты начали появляться год назад).
  • Широкие возможности темизации. теперь Material Design поддерживает более продвинутую тематизацию, чем просто замена цвета. Можно менять шрифтовую сетку, скругления элементов интерфейса (точнее, даже их форму — например, можно сделать диагональные скосы), иконки.
  • https://vc.ru/design/37728-teper-material-design-polnocennaya-dizayn-sistema
  • https://trashbox.ru/topics/117404/material-design-2.0-instrukciya-po-ekspluatacii

• Влад Головач выпустил второе, расширенное издание "Культуры дизайна 2" http://designculture.exmachina.ru/

Головач о дизайне интерфейсов

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

Другие трактуют дизайн интерфейсов как следование набору правил-эвристик («терминальные кнопки должны быть размещены справа внизу или справа сверху» и т. п.). Авторы этих книг допускают, что если мы сделаем интерфейс по этим правилам, интерфейс получится хорошим. Этот вариант тоже не кажется мне плодотворным. Он напоминает мне изучение иностран- ного языка по словарю и грамматическому справочнику. Конечно, это приемлемо, но истинного знания языка так получить невозможно. Например, фразы «Коля пошел в школу» и «В школу Коля пошел» явля- ются правильными как грамматически, так и орфографически. Только вот смысл у них чуточку разный...

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

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

Legmo, 2019