Проектирование графических интерфейсов лекция 8

85
Навигация

Upload: technopark

Post on 26-Jun-2015

126 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Проектирование графических интерфейсов лекция 8

Навигация

Page 2: Проектирование графических интерфейсов лекция 8

ПерсонажиСценарииТребованияОбъекты

Page 3: Проектирование графических интерфейсов лекция 8
Page 4: Проектирование графических интерфейсов лекция 8

Принцип работы с продуктом?

Page 5: Проектирование графических интерфейсов лекция 8
Page 6: Проектирование графических интерфейсов лекция 8

ЛаконичностьСдвиг в сторону опытныхРабота с объектамиНепристойно захватываем все пространство

Page 7: Проектирование графических интерфейсов лекция 8
Page 8: Проектирование графических интерфейсов лекция 8

Быстрый ввод в контекстСдвиг в сторону новичковОриентируемся на задачи и сценарииСкорость!

Page 9: Проектирование графических интерфейсов лекция 8
Page 10: Проектирование графических интерфейсов лекция 8

Совсем для тупыхАлерты и крайние случаиИногда настройкаМаксимальная информативностьНичего не происходит —сервиса нет

Page 11: Проектирование графических интерфейсов лекция 8

Что еще?

Page 12: Проектирование графических интерфейсов лекция 8
Page 13: Проектирование графических интерфейсов лекция 8
Page 14: Проектирование графических интерфейсов лекция 8

Фиксируем структуру

Page 15: Проектирование графических интерфейсов лекция 8

Частота (не суммируем)ПерсонажиФункцииОбъекты системыТребования (отсценариев и персонажей)

Page 16: Проектирование графических интерфейсов лекция 8

Типы экранов?

Page 17: Проектирование графических интерфейсов лекция 8
Page 18: Проектирование графических интерфейсов лекция 8

Структура объектовСценарии и действияОбъекты как функцииКарты и помощникиОбщесистемные возможностиШорткаты и алерты

Page 19: Проектирование графических интерфейсов лекция 8
Page 20: Проектирование графических интерфейсов лекция 8

ОперативнаяСтруктурнаяНавигацияАрхивнаяНалоги

Page 21: Проектирование графических интерфейсов лекция 8
Page 22: Проектирование графических интерфейсов лекция 8

1

2

3

4

Page 23: Проектирование графических интерфейсов лекция 8

Протестировать разныерешенияДешево менять и дорабатыватьНаправить ожиданиязаказчикаЗаставить участвовать

Page 24: Проектирование графических интерфейсов лекция 8

Детальное проектирование

Page 25: Проектирование графических интерфейсов лекция 8

Зачем?

Page 26: Проектирование графических интерфейсов лекция 8
Page 27: Проектирование графических интерфейсов лекция 8
Page 28: Проектирование графических интерфейсов лекция 8
Page 29: Проектирование графических интерфейсов лекция 8
Page 30: Проектирование графических интерфейсов лекция 8

Рисуем!

Page 31: Проектирование графических интерфейсов лекция 8

Законы распределения и

группировки

Page 32: Проектирование графических интерфейсов лекция 8

Пространственная группировкаПохожесть элементовДинамика

Page 33: Проектирование графических интерфейсов лекция 8

Паттерны

Page 34: Проектирование графических интерфейсов лекция 8

Определяем что оптимизируем

Page 35: Проектирование графических интерфейсов лекция 8

Распределяем элементы по

экранам

Page 36: Проектирование графических интерфейсов лекция 8
Page 37: Проектирование графических интерфейсов лекция 8

MS Visio

Page 38: Проектирование графических интерфейсов лекция 8

+ПолотноОбъемыГибкость инструменов

Page 39: Проектирование графических интерфейсов лекция 8

-КартинкиШаблоныСтили

Page 40: Проектирование графических интерфейсов лекция 8

InDesign

Page 41: Проектирование графических интерфейсов лекция 8

+Мастер пейджМакросыКликабельностьДизайнеры

Page 42: Проектирование графических интерфейсов лекция 8

-СкоростьГлюкиСтраницы

Page 43: Проектирование графических интерфейсов лекция 8

Axure

Page 44: Проектирование графических интерфейсов лекция 8

+ИнтерактивМастер ЭлементИмитация в мобильных

Page 45: Проектирование графических интерфейсов лекция 8

-Сложная логикаЦвета

Page 46: Проектирование графических интерфейсов лекция 8

Еще?

Page 47: Проектирование графических интерфейсов лекция 8
Page 48: Проектирование графических интерфейсов лекция 8

Бумага

Page 49: Проектирование графических интерфейсов лекция 8

+ПривычкаСкоростьНалогИдеологияДоступность

Page 50: Проектирование графических интерфейсов лекция 8

-Детали

Page 51: Проектирование графических интерфейсов лекция 8

Хитро

Page 52: Проектирование графических интерфейсов лекция 8

Хитро

Page 53: Проектирование графических интерфейсов лекция 8

Хитро

Page 54: Проектирование графических интерфейсов лекция 8

Хитро

Page 55: Проектирование графических интерфейсов лекция 8

Хитро

Page 56: Проектирование графических интерфейсов лекция 8
Page 57: Проектирование графических интерфейсов лекция 8

Рисуем?

Page 58: Проектирование графических интерфейсов лекция 8

Принципы и законы

Page 59: Проектирование графических интерфейсов лекция 8

Минимизируем деятельность

Page 60: Проектирование графических интерфейсов лекция 8

КогнитивнаяРабота с памятьюВизуальная работаФизическая (моторная)

Page 61: Проектирование графических интерфейсов лекция 8

Минимизируем деятельность

Page 62: Проектирование графических интерфейсов лекция 8

Закон Фитса

Page 63: Проектирование графических интерфейсов лекция 8

Хитро

Page 64: Проектирование графических интерфейсов лекция 8

Закон Хикка

Page 65: Проектирование графических интерфейсов лекция 8

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

Page 66: Проектирование графических интерфейсов лекция 8

Закон сохранения сложности Теслера

Page 67: Проектирование графических интерфейсов лекция 8

Хитро

Page 68: Проектирование графических интерфейсов лекция 8

Пока Йокэ

Page 69: Проектирование графических интерфейсов лекция 8

Хитро

Page 70: Проектирование графических интерфейсов лекция 8

Поиск решений

Page 71: Проектирование графических интерфейсов лекция 8

ПерсонажиМозговой штурмПаттерныЧек-листыGOMSСтандарты

Page 72: Проектирование графических интерфейсов лекция 8

Паттерны

Page 73: Проектирование графических интерфейсов лекция 8

Listbox: не более 20-ти элементов

Radiobutton: не более 3х элементов

Checkbox не должен использоваться для переключения между двумя режимами;

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

Page 74: Проектирование графических интерфейсов лекция 8

Нажатие на клавишу 0,28Нажатие на кнопку мыши 0,10Перемещение мыши 1,10Взятие-бросание мыши 0,40Выбор действия 1,20Реакция системы 0,1-

Page 75: Проектирование графических интерфейсов лекция 8

Термины Стандарты ОС: Microsoft , Apple, SAP Стандарты отдельных приложений: MS Office 2007 SO/ГОСТ стандарты: ISO 9241, ISO 9126 и так далееiOS, Android и прочие гайдлайны

Page 76: Проектирование графических интерфейсов лекция 8

Уже ближе

Page 77: Проектирование графических интерфейсов лекция 8

Организация информации

Page 78: Проектирование графических интерфейсов лекция 8
Page 79: Проектирование графических интерфейсов лекция 8

Цвет

Page 80: Проектирование графических интерфейсов лекция 8

Управления вниманием ГруппировкиУправления эмоциональным состояниемИндивидуализации

Page 81: Проектирование графических интерфейсов лекция 8

Избегайте

Page 82: Проектирование графических интерфейсов лекция 8

Типографика

Page 83: Проектирование графических интерфейсов лекция 8

МинимализмЗасечки – для текстаМалые строчные –заголовки, большие -текст

Page 84: Проектирование графических интерфейсов лекция 8
Page 85: Проектирование графических интерфейсов лекция 8