Mobile app design feature development

1. Mobile App Design. Feature Development
Проектування мобільного додатку.
Визначення можливостей

2. Типи мобільних додатків
1. Ігрові додатки
+ Розваги
2. Утиліти
Погода, Бізнес, Здоров’я і т.д.
3. Клієнт-серверні додатки
M2M-додатки
Мобільні магазини
Автоматизація бізнес-процесів
•
M2M додатки -> IoT
Machine-to-Machine, Mobile-
to-Machine, Machine-to-
Mobile…

4. Number of mobile app downloads
worldwide from 2009 to 2017 (in millions)

5. Number of paid mobile app downloads
worldwide from 2011 to 2017 (in billions)

6. Number of apps available in
leading app stores as of June 2016

12. Розроблення мобільного додатку
Розроблення
технічного
рішення
Розроблення цінності
Розроблення
бізнес-моделі
Розроблення = інновація

13. Minimal Viable Product

15. Important questions
• Why?
• How?
• What?
https://www.ted.com/talks/
simon_sinek_how_great_leaders_inspire_action

16. Important questions
• Чому Ви це робите? - Яка місія Вашої
компанії? Яку цінність Ви створюєте? Що Ви
будете робити, а що не будете?
• Як Ви це робите? - наслідок від «Чому?»
• Що робите? (ЛЮДИ-ЗАДАЧІ-КОНТЕКСТ-
ПРОДУКТ)

17. Цінність
Цінність — властивість того чи іншого
предмета, явища задовольняти потреби,
бажання, інтереси соціального суб'єкта
(індивіда, групи людей суспільства).
(за матеріалами Wikipedia)
Мобільний телефон - предмет
Можливість швидко сконтактуватися зі своїми
близькими - цінність

18. 1) Дизайн зручного інтерфейсу користувача
2) Використання засобів та методик, які можуть:
А) прискорити час виведення програмного
продукту на ринок
Б) забезпечити підтримку додатку в середовищі,
яке дуже швидко змінюється
Ключові проблеми, які виникають в розробленні
ПЗ для мобільних платформ

19. Основні питання, на які треба відповісти перед
розробленням мобільного додатку:
1) Хто користувачі мобільного додатку
2) Який має бути інтерфейс користувача
3) Тип пристроїв
4) Тип зв’язку з мережею
5) Обсяг даних, що будуть передаватися між
клієнтом та сервером
6) Рівень інтеграції з API сервера
7) Засоби нотифікації користувача
8) Рівень безпеки
9) Споживання енергоресурсів пристрою під
час роботи

20. Основні проблематичні місця при розробці
мобільного додатку
1) Поєднання різних інтерфейсів та
технологій
2) Діапазон цільових пристроїв
3) Необхідність оновлень версій ПЗ
4) Інтерфейс користувача
5) Продуктивність
6) Управління пам’яттю
7) Безпека
8) Витрати на Backend/Support

21. Як зробити додаток
зручним?

22. Human Centered Design
User experience - Відчуття і
реакція людини, внаслідок
використання певного продукту,
системи або послуги.
Зручність є степенем ефективності,
продуктивності і задоволення, з
якими продукт може
використовуватися певними
користувачами для досягнення певних
завдань в певному контексті. (ISO
9421-11)

23. Попередній досвід користувача в значній мірі
впливає на взаємодію з новою програмою.
Тому важливо проаналізувати, які програми
використовують ваші потенційні користувачі, і яким
чином користувачі виконують у них певні дії
(шукають ті чи інші функції).

24. Human Centered Design
http://profs.info.uaic.ro/~stefan.negru/hci2014/lab2.html

25. Хороший дизайн програми
повинен:
1. Задовольняти потребу користувача
2. Бути простим у використанні
3. Бути привабливим
4. Відповідати очікуванням бренду

26. Is it Tapworthy?
Люди використовують мобільні додатки тоді, коли вони
мобільні.
Люди бачать мобільний додаток лише одним оком,
приділяючи лише часткову увагу на ваш ретельно
зроблений інтерфейс. Вони бачать зовсім інший
додаток, ніж той, який бачите ви.

27. Як зробити зручний інтерфейс?
1. По мірі виконання задач користувач повинен постійно
відчувати своє наближення до мети.
2. Інтерфейс повинен в кожен момент часу давати розуміння,
що користувач на правильному шляху і вірно йде до мети, а
якщо це не так, то як на цей шлях повернутися.
3. Основне правило:
«Не змушуйте користувача відчувати себе дурнем».
4. Зміст екранів системи повинен бути таким, щоб
концентрувати увагу користувача, а не розсіювати його.
5. Щоб користувач отримав якісні переживання, продукт
повинен розповідати історію, яка гармоніює з історією його
життя і стане для нього чимось дійсно важливим.
© Юрій Грановський, “Процес і результат”

28. Процес розроблення прототипу
продукту включає в себе:
1.Розроблення місії, цілей, можливостей,
здібностей(функцій) продукту
2.Дослідження потенційних користувачів
3.Дослідження користувацьких цілей,
досягненню яких сприяє додаток (аналіз Jobs to
be done, JTBD)
4.Вибір персон (достатньо 1-2 персони)
5.Написання сценаріїв і контекстних ситуацій
для персон
6.Проектування інтерфейсних рішень

29. Розроблення місії, цілей, можливостей, функцій продукту
МІСІЯ – Заради чого більшого в світі цей продукт
існує? (має доповнювати місію бізнесу)
ЦІЛІ БІЗНЕСУ – Для чого ми його розробляємо?
МОЖЛИВОСТІ – Що отримає людина завдяки
функціям продукту?
ФУНКЦІЇ – Які основні функції він може робити
фактично? (основні)
КОРИСТУВАЧІ – ХТО наш користувач?

30. 1.Максимально уявити себе в ролі користувача
2.Працювати з потенційними користувачами, вивчати
їхні риси, вподобання, особливості (для корпоративного
сектора — додатково з представниками бізнесу, які
приймають рішення)
3.Визначити точки болі потенційних користувачів, які
може зняти новий продукт
4.Працювати з персонами
5.Визначити контекст використання продукту
6.На основі цілей бізнесу, особливостей користувача,
створених персон і контексту згенерувати контекстні
ситуації: користувач->ситуація->задача
Як зрозуміти користувачів?

31. 1. ЛЮДИ: Персони, цільова аудиторія (ЦА)
2. ЗАДАЧІ: Яку проблему має вирішити ваш
продукт?
3. КОНТЕКСТ: В якій ситуації яка задача буде
вирішуватися?
4. ПРОДУКТ: Створення продукту, який
найліпше вирішує для заданої ЦА
поставлені ЗАДАЧІ в заданому КОНТЕКСТІ

32. Створення персони включає в себе максимально
можливий перебір відомих персонажів, які би
підійшли нам по вимогах до особливостей
потенційного користувача.
Це має бути психологічний портрет людини, якої
насправді не існує.
Може бути додаткова персона, більш лояльна.
Також може бути негативна персона, не наш клієнт.

33. Приклад.
Мобільний додаток
для вилучення
небажаних об’єктів з
фотографій.

34. ЦІЛЬ БІЗНЕСУ – продати мобільному
користувачеві, який цікавиться фото або
технічними новинками програму для
якісного і суттєво простішого забирання
небажаного контенту (у порівнянні з
аналогами) та утримуватись в TOP-20
програм для опрацювання фотографій на
мобільному пристрої.
МІСІЯ – надати можливість покращити фото
на телефоні завдяки якісному та зручному
забиранню небажаних об’єктів в одну мить.

35. Персона (Роберт)

36. Персона (Роберт)

37. Персона (Майкл)

38. Персона (Майкл)

39. Додатки з подібними функціями:
Adobe Fix
Pixelmator
Easy Eraser

40. Розроблення місії, цілей, можливостей, здібностей продукту
№ Можливості Здібності (Функції)
1 Інтелектуальне видалення небажаних
об’єктів
Надання можливостей для виділення і
видалення небажаних об’єктів
2 Інтелектуальне видалення небажаних
ліній
Надання можливостей для виділення і
видалення небажаних ліній
3 Ручне забирання об’єктів з ручним
вибором джерела
Надати можливість вибрати джерело та
замалювати небажані об’єкти
4 Виділити великі об’єкти та дрібні деталі Надання можливості вибору радіусу кисті
5 Розширене керування виділенням
об’єктів
Надання можливості не тільки виділяти,
але й забирати виділення (eraser) та
обводити об’єкти (lasso)
6 Виділити лінію частково Надання можливості виділення сегменту
або цілої лінії
7 Можливість застосування поточних змін
та запуску процесу видалення об’єктів
Надання візуальних елементів для
застосування поточних змін та запуску
процесу видалення об’єктів
8 Швидке загальне ознайомлення на
початку
Надання Onboarding

41. № Можливості Здібності (Функції)
9 Навчання для користувачів Надання інформації для навчання, вивчення
прикладів видалення небажаних об’єктів, ліній
10 Відновлення роботи над фото Автозбереження
11 Можливість відміни здійсненої дії
Підтримка Undo/Redo та надання візуального
елемента для відміни дії
12 Можливість масштабування зображення
Надання засобів масштабування зображення
(Fit, 1:1, Zoom)
13
Можливість перегляду оригінального
зображення
Надання візуального засобу для можливості
перегляду оригінального зображення (Show
original)
14 Можливість експортувати фото в галерею Надання можливості зберегти фото в галерею
15
Можливість відвантажити фото одразу у
сервіси (Facebook, Twitter, Instagram)
Надання можливості вибору сервісу для
відвантаження
16 Додаткові опції при експорті фото
Надання можливості вибору розширення та
формату фото

45. Рекомендована
література

54. http://wud-ukraine.com/
http://uxcamp.com.ua/
http://push-conference.com
http://usabilitylab.ru/

55. Курси
• https://www.open2study.com/courses/user-
experience-for-the-web
• http://lits.com.ua/course/uiux-base-course/