Post on 20-Jul-2015
От слов к делу:как перейти от анализа к проектированию интерфейса
Все понимаем. Поговорим?
Екатерина ЮлинаСтарший проектировщик интерфейсов КБ «Собака Павлова»
Концептуальное проектирование —
часть дизайн-процесса
Аналитик передал многобукв
А что с этим делать?
Business Model Canvas
Персонажи Impact Map
Сценарии использования
Анализ конкурентов
Объектно-информационная модель
Customer Journey Map
Обоснование проекта Ожидания
Информации никогда не бывает достаточно
Сколько вам потребуется составить портретов пользователей, чтобы собрать Звезду Смерти?
Проектирование — это решение задачи Задача с кучей неизвестных, константами и пренебрежительно малыми величинами
ИМХО
Интерфейс — это система Можно начинать откуда угодно
Первые эскизы архиважны!!! Повод начать разговор
«А что если?» Увлекательная игра, в которую можно играть до бесконечности
Ошибки — это нормально «Я не потерпел неудачу. Я уже нашел 10 000 способов, которые не работают» (с) Т. Эдисон
Brainstorm и лучшие умы бюро
Как мы мыслимИнформационный мусор Освобождаем голову от очевидностей и банальностей
Моделируем и детализируем сценарии Игровые ситуации: дьявол кроется в деталях
Визуализируем идеи Скетчи на доске, в блокноте, салфетках, стикеры, бумажные прототипы и <td> </td>
Альтернативы Рассматриваются диаметрально противоположные варианты (современно — старомодно, инновационно — традиционно)
Визуализируем идеи
Главное — найти точку опоры
Инструментарий
proto.io
Белый лист: опять за рыбу деньги! Что делать-то будем?
Создать сетку Для какого устройства интерфейс? Какие размеры? Количество колонок?
С чего начать
Организовать «дерево» системы Создать страницы (логическая структура), зона отстойника
Крупными мазками по холсту Шапка, мастхэв-элементы, логотип и т.д.
Зарисовать то, что известно На этом шаге создаются какие-то серые недетализированные блоки
Добавить в прототип осмысленность Размеры и формы элементов, добавление поведения и событий
Концепт-прототипы
Концепт-прототипы
Обсуждение внутри команды
То, не то? Размер «зоны покрытия»? Что еще можно показать?
↓ Одобрение от «генштаба»
↓ Презентация заказчику
Concept #1не принят
Что дальше?
Круг шаблонов сузился
Мы уже знаем один неработающий вариант
Начинаем сначала
brainstorm & rapid prototyping
Concept #2принятЧто дальше?
Детализизацияпрототипа
Но это уже совсем другая история…
Методологии• Дизайн-мышление
• Думай как дизайнер / Ж. Лидтка, Т. Огилви
• Дизайн-мышление в бизнесе / Тим Браун
• http://www.youtube.com/watch?v=_yEgrW9GeqQ
• ТРИЗ
• http://www.youtube.com/watch?v=ah4Dhcqurkc
• http://goo.gl/i7HJlO
• User-Centered Design
• Д. Норман, А. Купер, Я. Нильсен, В. Папанек и др.
Спасибо за внимание!