Процес дизайну цифрових рішень – це не просто візуалізація в скетчах чи прототипах. Це багатосторонній процес, що починається з формування стратегії та триває до позначки «Готово до розробки». У цій статті ми поділимося, як у Devlight вибудовують дизайн-флоу для мобільних застосунків, інтегруючи аналітику, користувацький досвід і технології в єдиний процес. Цей підхід допомагає створювати рішення, що відповідають бізнес-завданням і очікуванням користувачів.
Devlight – ІТ-компанія зі створення мобільних застосунків, яка допомагає компаніям стати брендом №1 у смартфоні користувачів. Понад 8 років працюємо з бізнесами зі списку «Топ-100 Forbes Україна». Серед клієнтів: Vodafone, Нова Пошта, Fishka, Sense Bank, OKWINE, Portmone, NOVUS, VARUS, BROCARD, «Укрнафта» та інші.
Наша компанія вже досягла вражаючих результатів — понад 35 мільйонів завантажень наших застосунків по всьому світу. Завдяки цьому досвіду ми точно знаємо, як створити дизайн, який приваблює та утримує мільйони користувачів. Ми вміємо втілити ідеї в зручний, інтуїтивний інтерфейс, який не просто відповідає потребам, а й перевершує очікування.
Сервісна модель як основа взаємодії під час розробки продукту
У Devlight ми віримо, що створення якісного цифрового продукту – це завжди комплексна задача, яка потребує злагодженої взаємодії між кількома напрямками. Наша сервісна модель побудована на чотирьох основних компонентах: Strategy & Vision, Customer Experience, Technology & Engineering, і Data Analytics. Ми впевнені, що тільки гармонійне поєднання стратегії, технологій і глибокого розуміння користувацького досвіду дає можливість створювати продукти, які розв'язують проблеми бізнесу та приносять реальну цінність для кінцевих користувачів.
Зображення тут і далі надані компанією Devlight
Таким чином, підхід до розробки завжди полягає в тому, щоб інтегрувати стратегію, користувацький досвід, технології та аналітику в єдиний процес, який дає максимальні результати для бізнесу. Цей процес ми називаємо Discovery, в якому дизайн є одним із ключових етапів.
Дизайн як частина процесу Discovery
Процес створення цифрового продукту починається з етапу Discovery, який зосереджується на глибокому аналізі потреб бізнесу та технічних вимог проєкту. Основна мета Discovery – зрозуміти запит бізнесу, описати вимоги до продукту, візуалізувати рішення і передати проєкт розробникам.
На цьому етапі особливо важливою є співпраця між бізнес-аналітиком та продакт-дизайнером. У Devlight ці фахівці працюють у тісному тандемі. Злагоджена робота між ними є гарантією того, що продукт буде розроблений швидко, з урахуванням як бізнес-запитів, так і потреб користувачів.
На початкових етапах Discovery, таких як ініціація та опис вимог, бізнес-аналітик виступає фасилітатором та керівником процесу, тоді як дизайнер забезпечує дотримання User-Centric підходу. Тут важливо знайти баланс між комерційними цілями та зручністю для користувачів, базуючись на принципі нашої сервісної моделі.
На початку співпраці з новим клієнтом ми аналізуємо наявні бізнес-документи. Ця інформація є основою для подальших кроків. В ідеальних умовах замовник вже має розроблену документацію, та коли деякі важливі елементи «вихідних даних» відсутні, команда Devlight надає допомогу з проведенням продуктових досліджень, за принципом того, як ми працюємо з pre-Discovery phase під час редизайну застосунків.
Lo-Fi та Hi-Fi прототипування – який підхід обрати
Етапи Lo-Fi та Hi-Fi прототипування є важливими складовими процесу розробки дизайну. На початкових етапах проєкту використовуються Low-Fidelity прототипи, які дозволяють швидко експериментувати з ідеями та визначати основні функції та структуру продукту. Lo-Fi прототипи створюються швидше, витрачають менше ресурсів і фокусуються на загальних концепціях та функціях. Їх не тестують на користувачах, оскільки вони призначені для внутрішніх обговорень та швидких ітерацій.
Роман Хом’як Design Lead Devlight: «Коли йдеться про розробку прототипів, Lo-Fi прототипи слугують для швидких ітерацій та експериментів. Hi-Fi прототипи, своєю чергою, вимагають вже базового розуміння продукту».
На етапі Hi-Fi прототипування команда переходить до створення більш деталізованих прототипів, які краще відображають реальність і можуть бути використані для презентацій та обговорень функціональних аспектів продукту. Hi-Fi прототипи орієнтовані більше на користувача, ніж на концепцію, і їх можна та потрібно тестувати. У процесі Lo-Fi/Hi-Fi прототипування дані перетворюються на конкретні сценарії поведінки користувача, дизайнери створюють wireframes (чорнові макети) та презентують результати стейкхолдерам, щоб отримати відгуки та відтак планувати наступні етапи роботи. Фінальним продуктом цього етапу є інтерактивна версія прототипу.
Модероване тестування: якісний підхід до перевірки дизайнерських рішень
Етап тестування є ключовим для підтвердження валідності дизайнерських рішень. Лише після перевірки прототипу в реальних умовах можна впевнено сказати, що дизайн відповідає потребам користувачів, а не залишається лише гіпотезою.
Враховуючи реалії аутсорсу в Devlight ми надаємо перевагу модерованим тестам, де UX-фахівець спостерігає за діями користувача і збирає детальні фідбеки. Це дає змогу глибше зрозуміти емоції, мотивації та поведінку користувача, що більше про концепцію small-n, тобто якісного дослідження. Модероване тестування включає кілька етапів: від вступної частини, де користувачу пояснюються завдання, і до завершення, коли збирається зворотній зв'язок. Основна увага зосереджена на фіксації та аналізі труднощів, з якими стикається респондент, а також на його реакціях та відгуках.
Після завершення тестування UX-фахівець аналізує зібрані дані, щоб виявити проблемні точки в дизайні та внести зміни для покращення користувацького досвіду.
Тестування є циклічним процесом, який повторюється на кожному етапі вдосконалення дизайну. Спочатку створюються скетчі чи рішення, після чого проводиться тестування, де користувачі взаємодіють із прототипом. Зібраний зворотний зв'язок допомагає ітеративно вдосконалювати дизайн, створюючи нові версії скетчів для подальшого тестування. Кожен цикл тестування наближає продукт до остаточного оптимального рішення.
Створення UI-концепту: баланс між варіативністю та ефективністю
Після того, як прототипи протестовані та затверджені, дизайнери переходять до етапу створення UI-концепту. Тут команда фокусується на створенні UI застосунку, базуючись в першу чергу на прототип і візуальну айдентику бренду. Важливо, що UI-Сoncept містить декілька екранів ключових функціональностей продукту і його мета – надати застосунку привабливої візуальної мови, що буде асоціюватися із брендом.
UI-концепт постійно еволюціонує через зворотний зв’язок клієнтів до дизайну. Кожна ітерація не тільки вдосконалює візуальну складову, але й усе більше наближає нас до відповідності очікуванням клієнтів.
Прийняття остаточного рішення приходить не одразу: як правило, після кількох ітерацій. Затверджений і провалідований концепт дає можливість рухатись далі і переходити до основної фази дизайну.
Важливо, щоб процес надання фідбеку на цьому етапі був чітко структурованим. Для цього команда Devlight створює кілька варіантів дизайну і заздалегідь обговорює можливі рішення зі стейкхолдерами, задаючи певні рамки для оцінки. Після отримання фідбеку від команди та клієнта відбувається затвердження фінальної версії візуального стилю, яка потім використовується в основній фазі дизайну.
Етап UI-концепту включає кілька варіантів візуального рішення, що дозволяє клієнтам і стейкхолдерам порівнювати та обирати найбільш відповідний підхід.
Основна фаза: UI/UX дизайн – від концепції до впровадження
Після того, як концепція дизайну затверджена, наша команда переходить до основної фази UI/UX дизайну — створення кінцевих візуальних макетів. Це момент, коли рішення перестають бути ескізами та стають повноцінним дизайном, готовим до імплементації в мобільному застосунку.
На цьому етапі ми формуємо Master File — це головний робочий файл, що містить усі функціональні елементи інтерфейсу та визначає флоу продукту. Щоб забезпечити стандартизацію між дизайном і кодом, ми використовуємо дизайн-токени. Наприклад, коли потрібно змінити колірну гаму застосунку, достатньо просто змінити значення колірного токена primary-color, і всі елементи, що його використовують, оновляться автоматично. Це рішення гарантує, що зміни можуть легко впроваджуватися в усьому проєкті без необхідності редагувати кожен компонент вручну.
Ми завжди прагнемо до того, щоб наші проєкти мали масштабованість і узгодженість на всіх рівнях. Для цього ми створюємо дизайн-системи, які включають UI Kit і Styleguide. Ця система не лише допомагає стандартизувати процес розробки, але й робить його більш керованим.
Підхід до роботи в команді: мультидисциплінарність як ключ до інновацій
Командна робота в Devlight базується на принципі мультидисциплінарності, що забезпечує гнучкість і швидке реагування на нові виклики. Ми віримо, що для успішного проєкту необхідно не лише розуміти свою власну сферу відповідальності, але й бути залученим у суміжні області.
Кожен проєкт — це новий виклик, і ми прагнемо з кожним таким досвідом не просто розв'язувати поставлені задачі, а й документувати набуті знання. Це дозволяє дизайн-команді нарощувати експертизу і створювати середовище для безперервного професійного розвитку.
У Devlight ми використовуємо комплексний підхід до дизайну мобільних застосунків, що базується на тісній співпраці між усіма учасниками процесу. Це дозволяє створювати масштабовані продукти, які вирішують конкретні бізнес-завдання та забезпечують винятковий користувацький досвід.
Переходьте на сайт та отримуйте консультацію, щоб обговорити ваші ідеї та перетворити їх на ефективні цифрові рішення.
