Мене звати Андрій Стабрин, я Head of R&D, Lead Software Engineer в Agiliway і хочу поділитись нашим досвідом розробки мобільного додатку для CRM-системи, що особливо підходить неприбутковим організаціям та політичним партіям.

Чого потребують люди, які постійно в русі? Мобільності. І це ми особливо відчули під час роботи з CiviCRM і нашим додатком CiviMobile. Ми провели досить детальні дослідження потреб та технічних опцій перед розробкою додатку, тому хочемо розповісти більш детально про створення CiviMobile з доступом до даних з CiviCRM.

Як виникла ідея розробки CiviMobile?

Більшість CRM (системи для управління відносинами з клієнтами) здебільшого орієнтовані на комерційні проекти і їх потреби. У той час, як усі громадські та неприбуткові організації, політичні партії також потребують зручної системи для щоденної роботи. Якраз цю функцію чудово виконує CiviCRM, але під час роботи з нею ми зіштовхнулись з іншою проблемою. Це проблема так званої «мобільності» CRM та її не юзерфрендний UX.

Ми отримали запит від клієнта на використовування CiviCRM на мобільних додатках. Учасники саме таких соціальних груп (а це активні члени громадських, неприбуткових та політичних організацій від 18 до 50 років) більшість часу проводять на виїздах, зустрічах, у постійному русі — будь-де, але не в офісі. Доступ до бази даних, збережених у CRM, був для них дуже незручний — через ПК, або ж веб-версію з телефону.

Ми вирішили створити CiviMobile — зручний мобільний додаток для Android та iOS, який дає доступ до даних з CiviCRM з будь-якого кафе, конференції чи іншого місця, де члени ГО чи політичної організації перебувають прямо зараз. На даний момент додаток використовують у понад 10 країнах. Крім України, CiviMobile особливо поширений в США, Німеччині, Британії, Австралії, Франції, Нідерландах, Канаді, Чехії, Бельгії.

Звісно, під час розробки у нас виникло чимало челенджів та нюансів. Про них ми і розповімо у цій статті.

Скільки людей працює над CiviMobile?

Загалом, команда, яка працює над CiviMobile, складається з 7 людей: Tech Lead-а, дизайнера, двох Front-End девелоперів, двох Back-End розробників та QA.

Процес розробки CiviMobile: виклики, задачі та рішення

Потреба клієнта була не конкретно в аплікації. Це могла бути просто адаптивна веб-версія, яка працювала б на різних девайсах. Тому ми зробили попередній аналіз існуючих технологій, що дозволяють використовувати CiviCRM на мобільний пристроях, щоб обрати оптимальний варіант.

Найпростішим було розробити адаптивну веб-версію, щоб люди користувались нею з браузера. Найскладнішим варіантом була розробка нативних додатків на Swift та Java.

Після детального аналізу зійшлись на React Native, що дасть нам можливість написати одну гібридну мобільну аплікацію, яка компілюється у дві рідні мобільні аплікації для iOS та Android з нативними UI компонентами, які у свою чергу є знаковими і легкими для використання у тій чи іншій операційній системі. Тим більше, якби щось не можна було зробити на гібридному коді, завжди можна допиляти якусь частину на рідному коді іОС або Андроїда.

Ще однією вагомою причиною, чому ми зупинили свій вибір на гібридному додатку — це можливість розробити процеси та UX під своє бачення та потреби. CiviCRM має дуже багато налаштувань і не менше екстеншинів. Відповідно, це робить систему хоч і гнучкою під потреби клієнта, але дуже не зручною у користуванні. Тому якби ми обрали адаптивну веб-версію, довелось би і далі працювати з цими не юзерфрендлі процесами. Насправді, ми задіюємо багато ресурсів, щоб зробити як додаток, так і CiviCRM більш зручними, спростити усі процеси, зменшити кількість непотрібних кнопок, адже UX є критичним для телефону.

Загалом, для розробки CiviMobile ми використовуємо React Native, Redux (для централізації даних), Saga (для асинхронності), AsyncStorage для збереження даних, react-native-navigation від WiX, яка працює з допомогою рідної навігації ОС та Firebase для Push сповіщень та аналітики. Для автоматизації тестування ми використовуємо Detox.

Під час розробки CiviMobile ми зіштовхнулись з труднощами реалізації певного функціоналу, тому в нашому екстеншині CiviMobileAPI ми дописували, або модифікували АРІ, оскільки можливостей рідного стандартного CRM-мівського АРІ нам не вистачало.

Основним челенджом є те, що наша мобільна аплікація конектиться не до нашого сервера, а до сервера клієнта, до якого немає доступів. Через це виникає багато проблем. Кожен сервер по-різному наконфігурований, має різні доступи, і ми отримуємо багато сапорт тікетів. Доводиться наполегливо боротись, щоб автоматизувати усі перевірки і зменшити кількість цих тікетів.

Як це відбувається? Коли людина скачує додаток, першим скріном бачить введення домену клієнта, після чого відбувається конект до його серверу. Далі йде перевірка на наявність нашого екстеншину CiviMobileAPI та усіх налаштувань, включно з правами доступу. Якщо все правильно, після введення логіну та паролю, ми під’єднуємось до серверу клієнта і можемо користуватись CRM з мобільної аплікації.

Хочемо звернути увагу, що CiviCRM — це модуль, який встановлюється на WordPress, Joomla і Drupal CMS. Цей модуль дозволяє писати різні розширення (екстеншини) для CRM. Один з цих екстеншинів — це саме CiviMobileAPI, який використовується для того, щоб CRM конектилась до мобільного додатку CiviMobile.

Ще одним викликом було те, що кожна організація, чи політична партія має свої унікальні потреби: хтось працює з донорами, хтось з членськими внесками, інші мають дуже деталізовану структуру з обмеженими правами доступу та інші нішеві функціонали.

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

Якщо коротко, то структура проекту виглядає так:

  • features — усі головні сутності були виділені у окремі модулі, в яких поселились React компоненти, переклади, хелпери для АПІ запитів, редюсери, saga генератори та великі файли конфігурацій, у яких зберігаємо усе, що може змінитись для потреб клієнта (атрибути, які аплікація дістає з АПІ, список атрибутів, які показувати на list та detail скрінах сутності, екшин кнопки в навігації);


  • client — кастомна частина кожної клієнтської аплікації, тут ми зберігаємо картинки, оверрайдимо конфіг файли потрібних модулів, сетапимо навігацію, підключаємо потрібні модулі, та оверрайдимо файли перекладів при потребі;
  • core — частина, де усі ці налаштування збираються в одне ціле. Тут також лежать загальні UI компоненти, сервіси, утиліти та різного роду хелпери.

Усі модулі в майбутньому плануємо виносити в окремі npm модулі. Кожен брендований додаток буде збиратись з уже написаних модулів, які легко модифікуються під кожного клієнта з допомогою конфіг файлів.

Коли з’явився CiviMobile, яка його функціональність?

Перша версія CiviMobile з’явилась у травні 2018 року і містила у собі лише базові функції CiviCRM: контакти, пошук, події та календар подій, дії членів організації і роботу офлайн. Оскільки кількість зацікавлених додатком збільшувалась, і щоразу було більше прохань додати ту чи іншу функцію, то вже через кілька місяців, у жовтні 2018, ми випустили другу версію додатку.

CiviMobile version 2.0 дозволила не лише переглядати контакти і дії учасників з бази, але й повноцінно створювати і редагувати їх зі свого смартфону через додаток. Також, у другій версії CiviMobile з’явились функції зміни статусу учасників організацій та розширеного пошуку за допомогою фільтрів. Але, мабуть, найкориснішою новою опцією стали мобільні сповіщення і карта розташування (таким чином, користувач міг одразу побачити локацію певної події та прокладати до неї маршрут за допомогою Google Maps).

Однак, відверто кажучи, робота над CiviMobile не зупинялась ні на день. Саме тому після релізу другої версії ми вже почали працювати над третьою версією на наступний день! І через півроку, у квітні 2019, світ її побачив. Що нового там було?

  • Ми додали функцію керування своїм членством в організації (можливість бачити свій статус мембера, змінювати його за потреби).
  • Можливість керувати своїми внесками в організацію (бачити історію платежів, дату внесення останнії внесків тощо).
  • Керування відносинами між вами і іншими учасниками з контактної бази.
  • Нотатки. Можливість залишати як публічні нотатки, так і приховані для певних користувачів.
  • Розширені функції налаштування додатку «під себе». Тепер користувач міг вибрати, які сторінки CiviMobile будуть відкриватись першими при запуску додатку, а також обирати мову (англійська, німецька, французька чи італійська).

Третя версія дала змогу учасникам більш вільно керувати даними зі своєї CiviCRM, однак ми і надалі продовжили працювати над додатком і у липні 2019, ми випустили четверту версію CiviMobile, яка мала такі нові передбачені опції:

  • Реєстрація інших членів організації на події (раніше реєструвати можна було лише себе).
  • Генерація квитків на подію (після реєстрації на подію учасник отримує унікальний QR-код, який слугує квитком на івент).
  • Менеджмент учасників (можна змінювати їх статуси відносно до того, хто вони є: спікер, волонтер, відвідувач заходу тощо).
  • Check-in (одним кліком можна відмітити учасників, які зареєструвались чи прийшли на подію).
  • QR-сканер. Звісно, якщо и добавили опцію генерування QR-кодів як квитків на подію, то ми і додали функцію, яка дозволить відсканувати цей квиток.

Загалом, це всі функції, які зараз є у CiviMobile. Але якщо ви думаєте, що ми зупинили нашу роботу над розробленням нових функцій для користувачів CiviMobile, то ви помиляєтесь. Ми і зараз працюємо над новими опціями, тому вже скоро світ побачить CiviMobile version 5.0., яка зробить повсякденне життя членів громадських, неприбуткових і політичних організації ще простішим.

Основні виклики після запуску CiviMobile

  1. Основним челенджом після релізу залишається велика кількість сапорт тікетів через те, що апка конектиться до серверів юзерів, а не до нашого, де була б змога усе контролювати. Тому ми намагаємось додати якомога більше валідацій та автоматизації, щоб уникнути людських помилок та зменшити кількість технічних тікетів до нас.
  2. Викликом також є те, що після релізу CiviMobile хочеться реалізувати необхідний користувачам функціонал у найповнішому обсязі, а в брендовану апку винести кастомізацію під назву, логотип та інші візуальні елементи організації.
  3. Складність полягає також у тому, щоб не тільки розробити індивідуальний функціонал під клієнта, але й зібрати та проаналізувати потреби користувачів, розставити правильно пріоритети, знайти рішення, а також зуміти його імплементувати. Часто це вимагає залучення додаткових ресурсів, технологій, перегляду рішень та внесення суттєвих змін у роботу аплікації.

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

Оскільки кількість користувачів зростає, розширюється і географія CiviMobile. Відповідно, команда не припиняє роботу над локалізацією аплікації. Зараз ми вже залучили користувачів до проекту, щоб максимально пришвидшити процес і зробити СiviMobile максимально доступним якомога ширшій аудиторії користувачів. Ми підключили сервіс Crowdin для локалізації мобільної аплікації. Будь-яка людина може перекласти нашу аплікацію на свою мову, після чого ми включаємо ці переклади перед кожним релізом. Аплікація вже є доступною на 9 мовах. Доречі, тулза має українське коріння (родом з Тернополя). Ми допомагаємо хлопцям тестувати Бета-версію їхнього сервісу для Enterprise.

Як стати користувачем СiviMobile?

Кожен може завантажити мобільний додаток CiviMobile з AppStore чи Google Play Market безкоштовно, встановити CiviMobileAPI на сервер своєї CiviCRM і насолоджуватись перевагами мобільної версії CRM. Зроби свій менеджмент простішим і спрости комунікаційні процеси у своїй громадській, неприбутковій чи політичній організації.

Компанія-розробник мобільного додатку CiviMobile — це українсько-американська компанія Agiliway, яка має офіси у Львові і Чернівцях (Україна) та у Остіні (США, Техас). Компанія займається здебільшого ІТ-розробкою та консалтингом, ПЗ, впровадженням та підтримкою CRM систем, e-commerce проектами.

Автор — Андрій Стабрин, Head of R&D, Lead Software Engineer at Agiliway.


#рекламанаCASES