Коротко про клієнта
| Компанія SMS-Fly |
Сервіс СМС розсилок |
Україна |
SMS-Fly надає послуги смс-розсилки на ринку України, працює з 2011 року. Компанія є офіційним партнером мобільних операторів і надсилає розсилки “білими” методами. Управління відбувається через особистий кабінет користувача в якому можна створювати одиночні та групові розсилки, імпортувати та групувати контакти, дивитися статистику, поповнювати баланс. Крім того є zAPI, яке дозволяє інтегруватися із зовнішніми системами.
SMS-Fly – класичний стартап, який став компанією. Компанія пройшла шлях від сервісу розсилок серед знайомих, до компанії, яка працює в масштабах всієї України.
Задача проекту
Інтерфейс SMS-Fly створювався з нуля невеликою командою розробників, не включав себе етапу проектування, а дизайн придумувався “на ходу”. Функціонал системи розширювався, і в кінцевому рахунку вона обросла складними і заплутаними процесами. Клієнт усвідомив що зручність використання сервісу програє основним конкурентам і звернувся до нас.
Система стала незрозумілою і складною для користувачів, і основним завданням було виправити це.
Для інтерфейса потрібен був UI / UX дизайн, щоб зробити його інтуїтивно зрозумілим і зручним користувачеві.
Нагадаємо, що UI / UX дизайн – це створення призначених для користувача інтерфейсів, в яких зручність використання не менш важлива ніж зовнішній вигляд. Ось так раніше виглядала стартова сторінка особистого кабінету:
Приступаючи до створення UX-прототипу ми проаналізували поточну систему, конкурентів і цільову аудиторію сервісу. Основний акцент зроблений на скорочення часу користувача, яке необхідно для створення розсилки.
Ми відібрали серед конкурентів 8 сервісів SMS-розсилок, представлених як на внутрішньому ринку України, так і на зарубіжному. Зареєструвалися в кожному сервісі, проаналізували їх, виписали сильні і слабкі сторони.
Разом з клієнтом ми розділили всіх користувачів на персони. Для кожної персони визначили найважливіші функції кабінету, завдання і проблеми, які потрібно вирішити. Ось ці 4 персони:
Спрощуємо інформаційну архітектуру
Насамперед спростили інформаційну архітектуру. В попередній версії структура кабінету була перевантажена. Для виконання деяких завдань користувачу потрібно було робити невиправдані переходи між сторінками, і процес створення розсилки потребував багато часу і складних дій. Ми побачили можливості для оптимізації – об’єднали кілька сторінок в одну, перегрупували розділи, змінили назви на більш зрозумілі.
Прототип початкової сторінки особистого кабінету
На цю сторінку ми винесли “майстер створення першої розсилки“. Цей інструмент зрозуміло розкладає процес створення розсилки. Після виконання кожного з перерахованих кроків, система повертає користувача на головний екран, в якому видно прогрес виконання.
|
Статистика показала, що багато користувачів бажають перевірити швидкість і надійність відправки повідомлення.
|
 |
Для такої перевірки ми розмістили форму відправки поодинокого (тестового) повідомлення внизу сторінки.
Це дозволяє користувачеві переконатися в перевагах системи вже при першому знайомстві з системою.
Сторінка створення повідомлення
Для наочності, поруч з вікном введення тексту ми розмістили демонстрацію готового повідомлення. Вона представлена у вигляді мобільного телефону, де в режимі реального часу показується як буде виглядати повідомлення для одержувачів. Така функція допомагає користувачеві скласти шаблон повідомлення, і бути впевненим в зручності його прочитання.
Об’єднавши декілька сторінок в одну, ми отримали лаконічну і зрозумілу користувачеві сторінку.
Страница створення повідомлення ДО редизайну
Сторінка створення повідомлення ПІСЛЯ редизайну
Інші сторінки
Всього було спроектовано більш ніж 40 сторінок інтерфейсу (особистий кабінет і увесь сайт)
.png)
Передача готового прототипу в розробку
Унаслідок, ми створили високодеталізований прототип, в якому можна натискати на елементи і розуміти як вони працюють. Він повністю відтворює робочу систему.
Для розробників прототип супроводжується детальними user stories, в яких описано які дії може виконати користувач, і як система реагує на взаємодію з елементами.
12.04.2018
Зображення, використані в статті, були взяті з відкритих джерел і використовуються як ілюстрації.
.png)
