Gromad.UA.ny або як команда дизайнерів сприяла українізації
Упродовж 3 місяців навчання у OffGrid Design School ми працювали над проєктом Gromad.UA.ny — антишколою української мови. Радо ділимося з вами процесом роботи та результатами, яких вдалося досягти.
Про проєкт
Gromad.UA.ny — соціальна ініціатива, спрямована на популяризацію української мови. З перших тижнів повномасштабного вторгнення волонтери проєкту допомагають людям, що тривалий час перебували в російськомовному середовищі, почати більш впевнено спілкуватися українською. Проєкт позиціонує себе як мовна антишкола, де немає нудних уроків чи домашніх завдань, лише живе спілкування з носіями української мови на цікаві теми зі спільних інтересів учасників. Також Gromad.UA.ny популяризують українську літературу, музику та культуру, влаштовують воркшопи для ІТ-компаній та допомагають вправлятися у письмі.
Попри те, що проєкт доволі молодий, він налічує понад 50 волонтерів- антивчителів та близько 200 антиучнів. І це число невпинно зростає.
Ціллю проєкту є “лагідна українізація”. Gromad.UA.ny допомагають подолати мовний бар’єр, створюючи комфортне, дружнє мовне середовище без критики та різкого вказування на помилки.
На першій зустрічі зі стейкголдеркою нам вдалося зʼясувати, що основними проблемами проєкту є:
- діяльність виключно в соціальних мережах, що створює труднощі в координації роботи великої кількості волонтерів;
- звітність, комунікації та активності проєкту на різних платформах;
- відсутність зручного способу вибору антивчителя.
Команда
Координатори: Наталія Куцьо — Experience Designer, Марія Литвинюк — Experience Designer.
Студенти: Марта Ірклієнко, Дарʼя Торська, Анастасія Соловйова, Лілія Галицька.
Дизайн-процес
Роботу над проєктом ми здійснювали за методологією Дизайн-мислення.
Аналіз конкурентів
Розпочали з аналізу прямих та непрямих конкурентів. Дослідили різноманітні курси вивчення української та іноземних мов, а також сервіси здійснення запису на всілякі послуги. Це дало нам змогу виявити основні тенденції на ринку та сформулювати гіпотези.
Опитування
Дослідження цільової аудиторії проєкту ми розпочали з опитування. У ньому взяли участь 93 респонденти, серед яких учасники як проєкту Gromad.UA.ny, так і різноманітних мовних курсів та марафонів.
Ми зʼясували, що для понад 71% респондентів основним тригером для вивчення чи переходу на українську мову став початок повномасштабної війни.
Також отримали інформацію щодо методів навчання та труднощів, які виявляють учні, вивчаючи українську. Зокрема, понад 50% зазначили, що відчувають брак україномовного середовища та контенту.
Інтерв’ю
Після ретельного відбору респондентів ми провели 10 інтервʼю з антиучнями. Були опитані як ті, хто сам вивчає українську мову, так і ті, хто має досвід навчати мови інших. Серед опитаних також були люди, що проживають на тимчасово окупованих територіях, зокрема в Енергодарі.
Основні відкриття, отримані після спілкування з користувачами:
- учням важливі не лише професійні, а й особисті якості вчителя;
- користувачам бракує україномовного середовища та контенту;
- живе спілкування вважається найефективнішим способом вивчення мови;
- є потреба займатися як індивідуально, так і у групах;
- у вчителів виникають труднощі з веденням документації та комунікації, оскільки все розкидано по різних платформах;
- користувачі вважають ефективною геймифікацію навчання та асоціативне вивчення мови.
Формування персон
Узагальнивши дані досліджень, взялися за формування персон — збірного образу більшості користувачів. Ми виокремили два основні типи користувачів: волонтера-антивчителя та антиучня.
Мапа емпатії та CJM
Опісля ми склали Empathy Map та провели 2 воркшопи CJM (Customer Journey Map, тобто, мапа шляху користувача), один з яких — із залученням стейкголдерки. Відслідкувавши шлях користувача на різних етапах взаємодії з платформою, команда виявила її “больові точки” і згенерувала понад 140 ідей, щоб посприяти їхньому вирішенню.
Пріоритизація
Усі згенеровані ідеї ми проаналізували і пріоритизували за матрицею Impact/Effort. Таким чином вдалося виокремити першочергові задачі, до яких ми віднесли:
- зручний вибір антивчителя на основі спільних інтересів;
- керування антиуроками безпосередньо на платформі;
- доступ до звітності та документів з особистого кабінету;
- інформування користувачів про активності та новини проєкту;
- валідацію профіля антивчителя координаторами проєкту.
Сортування карток та шлях користувача
Для того, щоб побудувати навігацію та ієрархію контенту майбутньої платформи, провели воркшоп Card sorting та пропрацювали кілька User Flow (основних шляхів, якими користувач буде рухатися платформою) антиучня і антивчителя.
Інформаційна архітектура
Наступний етап — побудова інформаційної архітектури — став для нас справжнім випробуванням, оскільки продукт виявився доволі об’ємним, тож потрібно було правильно його структурувати. В процесі подальшої роботи (зокрема, при проведенні тестування) інформаційна архітектура зазнавала певних змін, вдосконалювалася, в чому, власне, і полягає магія ітеративного підходу до створення продукту.
Прототипування
Опісля ми взялися за розробку ваєрфреймів. Дослідивши на попередніх етапах, що 85% користувачів для навчання користуються саме телефоном, ми вирішили вдатися до підходу “mobile first” — і розпочали з мобільної версії платформи.
Пропрацювали понад 100 екранів та запрототипували їх для того, щоб провести тестування з користувачами.
Тестування
Для тестування обрали 5 сценаріїв взаємодії з сайтом, а саме:
- реєстрацію на платформі;
- бронювання уроку з антивчителем;
- скасування уроку антиучнем;
- замовлення воркшопу для компанії;
- фінансову підтримку проєкту.
Тестування допомогло нам виявити певні недоліки. Наприклад, деякі користувачі мали труднощі зі скасуванням уроку. Вирішенням стало переіменування розділу “Календар” у особистому кабінеті антиучня на “Антиуроки”. Також окремі користувачі не очікували знайти “Воркшопи” серед напрямків діяльності проєкту, тож ми виділили їх як окрему сторінку.
Усунувши виявлені недоліки, приступили до втілення візуального дизайну.
Візуальний дизайн
Ми склали мудборд та запропонували замовнику чотири різні концепти сайту. Обравши візуальне рішення, на основі якого будемо створювати UI, перейшли до розроблення стилів та компонентів.
У виборі кольорів були певні обмеження, адже у замовниці вже існував брендбук, тож ми взяли його за основу, додавши трохи акцентів.
Щодо типографії, то за базовий шрифт обрали Manrope, а також запропонували замінити попередній шрифт Podkova російського дизайнера на український Bandera Pro. Така собі лагідна українізація в дії 😊
UI kit створювали за принципом атомарного дизайну, рухаючись від найдрібніших елементів (атомів) до побудови цілих організмів.
Результатом стала система під назвою Gromad.UA.ny.
Цікавими випробуваннями у створенні UI були:
- поєднання легкого, невимушеного візуального стилю платформи, орієнтованої здебільшого на молоду цільову аудиторію, зі строгістю і лаконічністю, що не відволікали б від процесу навчання;
- пошук балансу між яскравим стилем, що вже використовувалася “громадянами” в соціальних мережах, та абсолютно новими візуальними рішеннями;
- створення зручного способу вибору антиучнем часу для уроку.
Ми розробили особисті кабінети для учня і волонтера, у яких, зокрема, можна:
- переглянути заплановані події і сповіщення про них;
- відредагувати особистий графік;
- переглянути списки антиучнів/антивчителів та статистику антиуроків;
- заповнити журнал та звітність тощо.
Про UX writing
Особливу увагу ми приділили написанню текстів (UX writing). Це стало справжньою фішкою проєкту. Оскільки Gromad.UA.ny позиціонують себе як антишкола, що абстрагується від класичного навчального процесу, субординації учень/вчитель, ми обрали легкий і невимушений tone of voice: багато жартуємо з користувачем, розмістили уривки української поезії у плейсголдерах і навіть на сторінці 404 даємо змогу вивчити цікаве українське слово.
Підсумки
За три місяці навчання ми:
- охопили багато активностей у фазі досліджень;
- створили понад 120 екранів мобільної версії вебсайту;
- пропрацювали адаптацію екранів для вебверсії;
- і, сподіваємося, зробили свій невеликий вклад у розвиток української мови, а отже, у нашу спільну перемогу 🇺🇦
Із завершенням OffGrid Design School робота над проєктом не припинилася. Ми активно долучаємося до процесу імплементації продукту, адже у стейкголдерки в планах реалізувати наш концепт сайту. Також плануємо втілити деякий функціонал, що не потрапив до першої версії вебсайту, зокрема геймифікацію навчання, можливість ділитися навчальними матеріалами безпосередньо на платформі, створення внутрішнього месенджера тощо.
Ми віримо, що цей проєкт стане внеском у перемогу, адже мова — це наша зброя в боротьбі з окупантами. Все буде Україна!
