52
Проектирование историй в интерфейсах Все понимаем. Поговорим? Екатерина Юлина Старший проектировщик интерфейсов КБ «Собака Павлова» [email protected]

Проектирование историй в интерфейсах

  • Upload
    -

  • View
    280

  • Download
    2

Embed Size (px)

Citation preview

Проектирование историй в интерфейсах

Все понимаем. Поговорим?

Екатерина ЮлинаСтарший проектировщик интерфейсов КБ «Собака Павлова»

[email protected]

АХТУНГ!!!Бездушные интерфейсы

Я в них верю

Реальные люди Контекст Мотивы поведения Факторы

Их опыт и дизайн-идеи

Эпизоды События Факты Фразы Эмоции Мимика

Фокус внимания

Цель понятна Задачи ясны

Палка-выручалка

Разработка Презентация Тестирование

Сторителлинг в проектировании интерфейсовКак создавать истории, улучшающие дизайн

Уитни Ксенбери, Кеин Брокс

Сторителлинг

Use Case и прочие #простигосподи UML

Дизайн-процесс

Ошибки — это нормально

Так вот ты какой, здоровый мазохизм! ;)

Книжки

«Успеваю или не успеваю?»Приложение для водителей

Роли на проекте

ПроектировщикПроектирует, прототипирует

АналитикСобирает требования и данные

МенеджерУправляет проектом, командой и заказчиком

ЗаказчикРассказывает про свое ИТ-хозяйство

Представитель ЦАЗнает, почем фунт лиха

#МногобуквиеВопросы по проекту Сущности в работе Жизненные ситуации Кейсы Опросники Анкеты Объектно-информационные модели

А? Что? Где?

Проектировщик — этопереводчик с русского на интерфейсный

Начать можно с чего угодно

«Идите и делайте; вы всегда успеете оправдаться позже».

Грейс Хоппер

Разбор контекста использования

Появление первых картинокЕще не интерфейс, но уже и не буквы

Обсуждение и новые вводные

Язык интерфейса• Среда (web, mobile, терминалы, Smart TV)

• Платформа (iOS, Android, Windows)

• Гайдлайны и лэйауты

• Виджеты, кнопки, навигация, всплывашки, табы и т.д.

• Поведения и события элементов

• Визуальная подача (серые квадраты всем надоели)

Первый заход на интерфейс…

Главный экран

Режим навигатора

…ищем решения на бумаге…

…ищем решения на бумаге…

…создаем интерфейс

Главный экран убили, появился экран Рейс

Не выходит каменный цветок

Что делать?

Сюжетная линия«Успеваю или не успеваю»

Фрагмент интерфейса

Но не то! Не то! Нужно другое решение!

«Дайте мне точку опоры — и я переверну Землю!»

Архимед

Заметки в блокноте

Где разместить большую кнопку SOS?

Уже теплее

История про водителяВодитель должен сообщить о прибытии на склад загрузки, чтобы диспетчер понимал, успевает ли водитель по графику.

(Персонаж) в (место) должен сделать (действие), потому что (мотив).

История вырисовывается

Что дальше?

Насыщение информацией

Все получилось!

История в картинкахРассказ сценария картинками

Слайды с картинками приложения и рассказ истории залу

ЗаказчикРассказывает

про свое ИТ-хозяйство

Мне, честно, нравится последний вариант, думаю, пальцем в точку :-)

Обратная связь

Кайдзен

Слушайте Наблюдайте

ВизуализируйтеСпрашивайте

ФантазируйтеГоворите

Ошибайтесь

Сторителлинг• «Сторителлинг в проектировании интерфейсов», Уитни Ксенбери, Кеин Брокс

Дизайн-мышление• «Думай как дизайнер», Ж. Лидтка, Т. Огилви •«Дизайн-мышление в бизнесе», Тим Браун • http://www.youtube.com/watch?v=_yEgrW9GeqQ

ТРИЗ• http://www.youtube.com/watch?v=ah4Dhcqurkc • http://goo.gl/i7HJlO

User-Centered Design• Д. Норман, А. Купер, Я. Нильсен, В. Папанек и др.

Методологии

Спасибо ;)Вопросы?

Как получить презентациюНапиши сюда: [email protected]