Етапи та засоби проєктування цифрових продуктів
Створення цифрових продуктів — це часто тривалий процес, в який можуть бути залучені десятки, а часом навіть сотні фахівців. А враховуючи, що айтівці — це одні з найдорожчих фахівців на ринку, не дивно, що цей процес ще й досить дорогий. Тож більше шансів на успіх мають ті команди цифрових продуктів, що вміють мислити гнучко та здатні швидко адаптуватись до змін.
Коли ви створюєте застосунок, то інтерфейс часто бере на себе особливу роль в тому, як він буде сприйнятий користувачем. Те, наскільки він зрозумілий, наскільки інтуїтивний та зручний, зрештою може визначити, чи будуть люди ним користуватись. Тож важливо якомога раніше почати отримувати зворотний зв’язок від користувачів. І далі — продовжувати спілкуватись з ними на кожному етапі проєктування.
І щоб ліпше зрозуміти, які дослідження можна проводити, нам спочатку потрібно з’ясувати, якими є, власне, етапи проєктування застосунків.
Етапи проєктування
Зазвичай проєктування застосунку має такі етапи:
- Розробка інформаційної архітектури
- Створення схематичних макетів
- Створення макетів дизайну
- Розробка сценаріїв взаємодії
- Проєктування інтерактивних прототипів
Інформаційна архітектура та асоціативна карта (мапа думок)
Спочатку ви описуєте інформаційну архітектуру продукту, що містить в себе перелік екранів, їхніх станів та переліку функцій та сутностей, що на них доступні. Така інформаційна архітектура може зображатись по-різному. Скажімо, у формі таблиці чи карток. Але найзручніший спосіб її опису — асоціативна карта (або ж мапа думок). Цей інструмент допомагає візуалізувати й обсяг продукту, і взаємозв’язок окремих його частин.
Схематичні макети
Після цього дизайнери переходять до проєктування схематичних макетів. Ідея їхнього створення полягає в тому, щоб якомога швидше, з найменшими витратами ресурсів, візуалізувати екрани застосунку. Часто ранні схематичні макети можуть виглядати дуже спрощено: замість текстів — лінії, замість зображень — прямокутники. Без дотримання пропорцій та уваги до деталей. Такі схематичні макети називають низькодеталізованими. Їхня задача — сформувати загальне уявлення про продукт та вміст екранів. По суті, це чернетка чернетки, як своєрідна графічна нотатка, створена в межах робочої наради.
Створивши схематичні макети низької деталізації, дизайнери інтерфейсів їх пропрацьовують, роблять охайнішими, пропорційнішими, і в результаті з’являються схематичні макети високої деталізації. В них вже замість ліній мають міститись конкретні написи, зображення все ще можуть бути умовними, але вже має бути очевидним, що ви бачите саме ілюстрацію, а не абстрактний блок. Також пізніші схематичні макети вже мають враховувати пропорції елементів.
Макети дизайну
Наступним кроком після схематичних стають повноцінні макети дизайну з пропрацьованою сіткою, колірною палітрою, системою іконок та шрифтів.
Сценарії взаємодії
При цьому, щоб розуміти, як саме взаємодіють між собою окремі екрани, як користувач потрапляє послідовно з одного екрану в наступний і далі, дизайнери створюють сценарії взаємодії. Такий сценарій дещо схожий за задумом на інформаційну архітектуру: він показує все, що відбувається в межах застосунку, і візуалізує взаємозв’язок окремих його елементів. Такі сценарії можна робити як на рівні схематичних, так і на рівні повноцінних макетів.
Інтерактивні прототипи
Але, звісно, в такому схематичному вигляді дійсно зрозуміти, як сприймається взаємодія з застосунком, може бути складно. Тому існують інструменти, що дозволяють створити на основі макетів інтерактивний прототип. Це можна зробити, скажімо, у Figma або за допомогою редактора ProtoPie.
Отже. На якому з етапів проєктування дизайну доречно взаємодіяти з потенційними користувачами? І де власне, їх взяти? Про це поговоримо у наступному матеріалі.
