designing mobile app
DESCRIPTION
TRANSCRIPT
![Page 1: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/1.jpg)
Проектированиемобильного приложения
![Page 2: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/2.jpg)
Ведущий мастер-класса
Мыслинский Игорь
USABILITYLAB, Проектировщик интерфейсов
![Page 3: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/3.jpg)
1 Вводная лекцияКоротко о главном
2 БрейнштормГенерируем суть приложения
3 Интервью с бизнесомЧто и кому мы хотим продать
4 Опрос пользователейЧто мы хотим купить
5 Концепт приложенияНаброски и варианты
![Page 4: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/4.jpg)
Мобильное приложение
Как это выглядит на самом деле
![Page 5: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/5.jpg)
Мобильное приложение
Как это представляет разработчик
![Page 6: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/6.jpg)
Мобильное приложение
Android
IOS
WindowsPhone +
Windows 8
HTML5
Как это представляет разработчик
![Page 7: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/7.jpg)
Статистика на 3й квартал 2013 года
По операционной системе По производителю
Распределение смартфонов в мире
![Page 8: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/8.jpg)
Статистика на 3й квартал 2013 года
Разработчики под мобильные системы
![Page 9: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/9.jpg)
Мобильное приложение
Как это видит пользователь
![Page 10: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/10.jpg)
Мобильное приложение
• Пользователю не важна операционная система, ему важен результат работы приложения
• Пользователю важно, чтобы приложение на разных системах одинаково реагировало на его запросы
Множество операционных систем
![Page 11: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/11.jpg)
Мобильное или настольное?
![Page 12: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/12.jpg)
Мобильное или настольное?
• Долговременно, но редко в течении дня
• Верификация в приложении не затрагивает личных данных как в телефоне
• Не всегда доступен в течение дня
• Более мощная вычислительная система чем на телефоне + большая ширина экрана + лучше звук
Контекст использования
![Page 13: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/13.jpg)
Мобильное или настольное?
• В течение дня короткими промежутками, высокая отвлекаемость
• Телефон содержит личные данные, сильно персонифицировано
• Быстрая реакция на запросы извне
• Более слабая вычислительная система
Контекст использования
![Page 14: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/14.jpg)
Мобильное или настольное?
На десктопе
Ресурсозависимая часть
CMS, редакторы, etc.
Домашний кинотеатр + развлечения
Разделяем и властвуем
На телефоне
Коммуникативная часть
Навигационная часть
Новости
Магазин
![Page 15: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/15.jpg)
БрейнштормГенерируем приложение 2
Придумываем название приложения из двух слов
Придумываем описание приложения
Выбираем лучшее для перехода к следующему этапу
![Page 16: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/16.jpg)
Интервью с бизнесомЧто и кому мы хотим продать 3
- Цели и задачи(продавать товары с помощью каталога)
- Показатели успеха(количество проданых товаров)
![Page 17: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/17.jpg)
Интервью с бизнесомЧто и кому мы хотим продать 3
Выясняем целевую аудиторию приложения
Выстраиваем персону
Находим подходящего представителя для опроса
![Page 18: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/18.jpg)
Опрос пользователейЧто мы хотим купить 4
Выясняем потребности пользователя
- Какие проблемы- К чему стремится- Жизненные ситуации
Цели
- Что нужно чтобы решить проблему
![Page 19: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/19.jpg)
Опрос пользователейЧто мы хотим купить 4
Выясняем ожидания пользователя
Узнаем как решали проблему без программы
Как выглядит день пользователя
![Page 20: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/20.jpg)
Концепт приложенияСценарии 51. Запустил приложение2. Ввел запрос поиска3. Выбрал интересующее в поисковой выдаче4. Просмотрел характеристики5. Прочитал отзывы6. Заказал7. Получил уведомление о времени доставки
![Page 21: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/21.jpg)
Концепт приложенияНавигационная диаграмма 5
Каталог
ПоискСписок
новостей
Новость
Категория
Страница товара
Форма заказа
Поисковая выдача
![Page 22: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/22.jpg)
Концепт приложенияНаброски 5
![Page 23: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/23.jpg)
Итак!Изучайте своих пользователей
Пользуйтесь идентичными сценариями независимо от мобильной платформы
Разделяйте функции PC/Mobile
![Page 24: Designing mobile app](https://reader033.vdocuments.net/reader033/viewer/2022051515/5537e64355034680358b466a/html5/thumbnails/24.jpg)
Спасибо за внимание!
Мыслинский ИгорьПроектировщик интерфейсов
USABILITYLAB, http://Usabilitylab.net