Please enable JavaScript.

Coggle requires JavaScript to display documents.

Разработка интерфейсов (Средство взаимодействия пользователя с программой…

- - - - Правильнее узнаваемый, т.е. пользователь может легко работать с продуктом
  - - - Насколько легко пользователь решает задачу в 1 раз
    - - Как быстро пользователь выполняет типовую задачу после обучения
    - - Как быстро пользователь может вспомнить, как пользоваться программой
    - - насколько хорошо система помогает человеку избежать ошибок, решить проблемы и, возможно, вообще подумать о том, чтобы их не возникало в целом.
    - - Включает все 4 пункта+
      - хорошие навыки визуального дизайна, сделать хорошо эстетически приятный интерфейс, поработать над текстами тех же самых ошибок, поработать над тем, как мы обращаемся с человеком, мы можем еще повысить эту удовлетворенность
- - - - графический интерфейс: рабочий стол, папки, новые способы управления: мышка
        
        touch-экран и наш палец: мы напрямую управляем кнопками,окнами, максимально прямое управление.
        
        управление жестами и голосовое управление.
        
        управлением взглядом
        
        это шлемы виртуальной реальности
- - - - Внимание — это луч, который мы направляем на какие-то значимые для нас объекты, при этом остальные объекты мы тоже воспринимаем просто менее четко, менее подробно и детально
    - - Функция внимания - это связать признаки зрительных объектов, которые находятся в определенном месте.
      - Выскакивание - любой отличающийся по форме, цвету или размеру объект будет объектом, который в первую очередь привлечет наше внимание.
      - Для 100% привлечения внимания к какому-то объекту нужно два или даже три этих правила скомбинировать вместе.
      - Лица очень значимы для социального взаимодействия: они всегда привлекают внимание
  - - - объекты, расположенные близко друг к другу, воспринимаются связанно
        
        Следует избегать ошибок в верстке: заголовок должен быть ближе к абзацу
        
        элементы, которые связаны друг с другом, должны располагаться ближе друг к другу, в то время как несвязанные элементы должны быть размещены раздельно
        
        «Чистое пространство» может усилить визуальную иерархию и управлять потоком информации, что облегчает чтение и сканирование макетов.
    - - Элементы, имеющие сходные визуальные характеристики, воспринимаются как более связанные, чем те, которые не имеют сходных характеристик.
        
        Сходство помогает организовать и классифицировать объекты внутри группы и связать их с определенным значением или функцией.
        
        различные способы сделать элементы воспринимаемыми как схожие: сходство цвета, размера, формы, текстуры, размера и ориентации
        
        цвет> размер> форма
    - - при представлении достаточного объема информации наш мозг сделает выводы, заполняя пробелы и создавая единое целое
        
        можно уменьшить количество элементов, необходимых для передачи информации
    - - элементы, расположенные в одной и том же замкнутой области, воспринимаются как сгруппированные.
        
        Признаки, по которым объекты объединяются в более крупные группы: линии, цвета, формы и тени
    - - Элементы, движущиеся в одном направлении, воспринимаются как более связанные, чем движущиеся в разных направлениях или вообще не движущиеся.
        
        Он может помочь с группировкой релевантной информации и связыванием действий с результатами.
    - - Элементы, расположенные в линию или на гладкой кривой, воспринимаются как более связанные, чем упорядоченные случайным образом.
  - - - Пользователь не сталкивался с этим раньше или сам додумал
      - Необходимо на это влиять
      - Способы исследования ментальной модели пользователей
        
        Наблюдение
        
        Слушайте
        
        Спрашивайте
    - - ситуация неопределенности
        
        Оставлять "хлебные крошки"
      - Когнитивный диссонанс
        
        состояние психического дискомфорта индивида, вызванное столкновением в его сознании конфликтующих представлений: идей, верований, ценностей или эмоциональных реакций.
  - - - Предлагать варианты решения
      - Скорректировать ментальную модель
      - Заранее составить список возможных ошибок и пути решения
- - - - Ключевые внутренние страницы
      - Типовые внутренние страницы
      - Главная страница
    - - Меню спрятанное в бутерброд, навигация, клики на иконки,
        состояния по кликам или по ховерам
    - - Иконки, иллюстрации, инфографика
  - - - Хинтинг
        
        Изменение контура шрифта при его растеризации при помощи специальных программных инструкций, заложенных в шрифтовой файл
      - Как выбрать шрифт?
        
        использовать 1 гарнитуру
        
        использовать максимально контрастные шрифты
        
        создавать базу шрифтов
    - - в Древней Греции, для строительства зданий
        
        "Человек - мера всего"
        
        Гармоничные измерения
        
        Золотое сечение
        
        Не только для размерности
        
        Модуль эмоционального отклика - лайк
      - Для чего нужна?
        
        Быстро понимаем габариты элементов
        
        Быстро понимаем положение элемента на макете
      - Система пропорций помогающая оптимизировать работу с контентом
      - Основные элементы
        
        Габарит
        
        Полный размер макета, для которого строится модульная сетка
        
        Микромодуль
        
        кратным модульной величине
        
        Модуль
        
        на основании какой-то контентной единицы
      - Виды сеток
        
        Блочная
        
        Колоночная
        
        Блок с делением на колонки и межколонные расстояния
        
        Модульная сетка
        
        Иерархическая
        
        Красота и гармония первичны
      - Принципы построяния сетки
        
        Размеры
        
        Ориентация носителя
        
        Разрешение
        
        Особенности платформы (тач устройство - более крупно, экран -курсор - сетка меньше)
        
        Определяем размеры (для какой платформы)
        
        Определяемся с модулем и микромодулем
        
        Строим колонную сетку (опредиляем вертикаль)
        
        Поворачиваем колонки на 90 - "канадская рубаха"
        
        На основании микромодуля делаем разлиновку. На нее должен лечь интерлиньяж.
    - - Сначала функционал, потом эмоция
  - - - По размеру
      - По расстоянию между элементами
      - По цвету элементов
        
        Оттенки одного цвета объединяют
      - По форме
    - - Учитывать расстояние между блоками
        
        Расстояние между элементами должно их объединять в блоки или разъединять на группы
      - учитывать ритмику (равное расстояние между блоками)
  - - - Это используется в шрифтах - буква O чуть ниже базовой линии
    - - Оптический центр всегда выше геометрического
      - Необходимо свешивать округлые объекты за вертикаль
      - Выравнивание букв A W T Y O S C