Рубрики
Блог

№8 выпуск Business iD с ТЭК-Торг

Новый выпуск Business iD

Развитие мобильных платформ сильно повлияло на цифровизацию государства. Вместе с генеральным директором ТЭК-Торг Дмитрием Сытиным, мы обсудили текущее состояние тендеров и планы по их развитию.

Рубрики
Блог

№7 выпуск Business iD с FxPro

Новый выпуск Business iD на английском языке 🏴󠁧󠁢󠁥󠁮󠁧󠁿

Виталий Дубинин поговорил с операционным директором ГК FxPro, Питером Аустом.

Что обсудили:

— Как международный брокер переживает карантин?

— Почему блокчейн не получает развития, хотя его технологии востребованы?

— Почему FxPro сотрудничает с McLaren?

— Фейки и фрод на рынке брокеров

Рубрики
Блог

Статья на Cossa: Экология в диджитале. Кейс мобильного приложения «Пропластик»

Как мы начали работать над проектом

СИБУР хотел сделать простой и понятный справочник, в котором рассказывается о разных видах пластиковой упаковки, её бытовых свойствах и возможностях переработки. СИБУР — не только крупнейшая нефтехимическая компания, но один из главных экологически активных брендов России, выступающий за осознанное потребление пластика и его вовлечение в переработку.

Примерно 4 из 5 вещей, которые нас окружают, сделаны с применением пластика, и в то же время вокруг него распространено много мифов. Наша задача — сделать простую шпаргалку, которая подскажет, можно ли разогревать пластиковую посуду, хранить в пластиковой упаковке еду, а главное — как вести экологичный образ жизни, сдавая пластик на переработку в пункты приёма вторсырья.

Таймлайн

  1. Октябрь — подписали контракт.
  2. Ноябрь — начали писать ТЗ.
  3. Декабрь — разработка дизайна. К Новому году у нас уже были полноценный отрисованный дизайн и готовое техническое задание, то есть мы уже знали, что делать и как это делать.
  4. С января по март — полноценная разработка проекта.

Если говорить про методологию, то мы придерживались стандартного «Водопада» (waterfall или каскадная модель).

Обсуждение содержания проекта (project scope) с заказчиком → создание прототипов → дизайн → разработка → тестирование на нашей среде → тестирование на среде заказчика → исправление ошибок → релиз.

При выборе методологии мы часто подстраиваемся под клиента. Чаще всего это «Водопад» — лучше всего подходит для небольших проектов с фиксом (fix price) и чёткими требованиями. Иногда канбан с беклогом задач, которые время от времени приоритезируем. Но может быть и SCRUM со стандартными спринтами. Выбираем подход, учитывая специфику проекта и пожелания клиента.

По нашей практике самые энергозатратные этапы — выяснение требований и сдача проекта. Сразу оговоримся, что это не случай Пропластика, здесь всё было хорошо. Но порой добиться чёткого ТЗ непросто. Но и пропускать этот этап ни в коем случае нельзя, потому что без него есть риск сделать продукт, который заказчику попросту не нужен (даже если сам продукт — хороший).

Про аудиторию и актуальность проекта

Изначальная аудитория проекта — сознательные рефлексирующие люди от 14 до 40 лет. Ядро аудитории — 14–18 лет, это экологически активная молодёжь, которая не только сортирует и сдаёт отходы в переработку, но и активно приобщает к этому делу семью и друзей. Мы считаем, что именно в этом возрасте формируется характер, привычки и взгляды, и если человек с юношества начинает заботиться об экологии, скорее всего, продолжит делать это всю жизнь.

На рынке уже есть несколько приложений, которые помогают вести экологически правильный образ жизни. Например, Sborbox.

Главное отличие Пропластика от остальных проектов — нишевость. Пропластик — не гид по сортировке мусора, и не сервис по сбору отходов домохозяйств. Это удобный справочник, в котором собрана информация о разных видах пластика, а ещё приложение показывает места, куда можно этот пластик сдать.

Выбор платформы — React Native

Изначально во время тендера мы планировали разрабатывать нативное приложение под каждую платформу. Но когда дело дошло до оценки ТЗ, все разработчики единогласно выбрали кроссплатформенное решение. Сроки были сжатые (2–3 месяца), а технически проект был простым — без интеграций с платёжными системами, эквайрингом или highload-решениями.

Оставалось выбрать React Native или Flutter. Выбрали первый, на то есть несколько причин:

  • React Native существует уже 5 лет. За это время платформа сильно выросла и стала более перспективной.
  • Если год назад нужно было с нуля писать, например, модули кнопок, то теперь появилось много готовых решений. Flutter же использует свою систему виджетов, которые в любом случае нужно делать самому.
  • Так как React Native существует дольше, на его основе создано больше проектов, в том числе приложения Instagram, Facebook и других больших игроков. Поэтому он выглядит надёжнее, в том числе и в глазах клиента; можно показать больше успешных кейсов.
  • Команда проекта не работала с Flutter. Зато у нас был опыт с React Native во время разработки других приложений. Например, для грузинского каршеринга AiCar.

Обсудив выбор React Native с заказчиком, мы решили, что сделаем одно приложение под две платформы, а выделенные часы возьмём про запас. Потом это решение сыграло нам на руку — когда внедряли дизайн, потратили больше ресурсов на отрисовку и согласование, но благодаря запасу успели сделать в срок.

Если вы решили использовать React Native, учтите следующее:

  • Это всё ещё сырая платформа, которая не получила официального релиза 1.0. Сейчас всё остановилось на версии 0.6.
  • За последнее время React Native стал гораздо дружелюбнее и удобнее. Сейчас доступно больше инструментов «из коробки», легче работать с зависимостями. Стало меньше костылей, добавились удобные инструменты вроде мгновенной перезагрузки приложения.
  • При этом многие нововведения всё ещё сырые и непредсказуемые. Какие-то инструменты могут менять state или вовсе не запускаться. Никуда не делись бесконечные проблемы с бильдами и их запуском.
  • Не хватает важных интеграций вроде связи с Firebase.
  • Кроссплатформа никуда не денется, но кажется, что React начинает проигрывать в популярности Dart и Flatter.

Как устроено приложение Пропластик

Каталог

Мы сделали простой обучающий каталог на главной странице. Здесь в виде списка собраны все маркировки пластика от 1 до 7 с их официальными названиями и обозначениями. Эти маркировки можно найти на любом изделии из пластика.

Каталог работает как справочник. У каждого вида пластика есть своя памятка, в которой собраны:

  • Вещи, сделанные из этого пластика. Например, в пластике типа 4 (LDPE) изображены пластиковые пакеты и плёнки.
  • Свойства и безопасность этого пластика. Многие не знают, можно ли разогревать в пластиковой упаковке еду в микроволновке, можно ли наливать горячее или использовать повторно. Вся эта информация отражена в этом блоке.
  • Возможность переработки с примерами вещей, которые можно сделать из этого пластика. Например, те же пластиковые пакеты хорошо перерабатываются и превращаются в новые пакеты, скотч и многое другое.

Карты

Изначально мы хотели использовать в приложении карту Recycle Map — сервис карт, который заточен под раздельный сбор отходов. Однако Recycle Map за последнее время практически не обновлялся в Москве и Московской области. А устаревшие сведения могли негативно сказаться на отзывах пользователей. Решили использовать карты 2ГИС — самые точные карты в России на сегодняшний день.

В первой версии приложения мы решили пойти быстрым и экономичным путём — подключили карты 2GIS с помощью web view. Но после выпуска приложения увидели, что у пользователей постоянно возникают ошибки. Находясь в Ярославле, люди видели карту Москвы и не могли переключить свой город — всё дело было в устройстве web view. Чтобы обезопасить себя от этих багов, мы решили перейти на нативное решение.

Сейчас в приложении нативно встроены карты 2ГИС, на которых отмечены пункты приёма пластика. Заботиться о природе можно из любого города России — в картах можно найти точки как в миллионниках вроде Москвы, так и в небольших городах и даже посёлках.

Что в итоге

После запуска проверяем все отзывы пользователей. Обычно мы подобное не делаем, так как у нас нет колл-центра, но в порядке исключения пошли навстречу клиенту — настолько мы сами горели идеей проекта.

Отзывов с первым обновлением было немного, до 15, но даже из них мы почерпнули кое-что полезное. В частности, один из пользователей жаловался на плохую адаптивность карт в планшетах — в следующем обновлении мы это поправили.

Что касается количества пользователей, то 24 сентября у нас было 1389 установок на iOS и 851 установка на Android.

Сейчас мы собираем обратную связь по проекту — от неё зависит, какие функции мы запустим в дальнейшем. Один из возможных вариантов — расширение справочника до других видов упаковки, практические советы по экологичному образу жизни и многое другое.

Скачать приложение Пропластик можно в App Store и Google Play.

Рубрики
Блог

Статья на Cossa: Как продавать машины во время самоизоляции. Кейс РОЛЬФа

Привет, это iD EAST. Мы создаём крупные ИТ-проекты для брендов вроде Сбербанка, СОГАЗ, ВТБ, Открытия, MediaMarkt. Сейчас мы работаем уже над восьмой версией приложения для клиентов автомобильного дилера РОЛЬФ.

На примере этого проекта мы покажем, как сделать приложение, где можно купить машину в два клика и записаться на тест-драйв без телефонных звонков.

С чего всё начиналось

РОЛЬФ — дилер, которые продаёт новые автомобили и автомобили с пробегом. В рейтинге крупнейших частных компаний Forbes 2019 РОЛЬФ признан лидером автомобильного ритейла в России.

Ещё в 2017 году клиент пришёл с задачей: сделать приложение с личным кабинетом, каталогом машин, программой лояльности и десятком других функций.

До этого у РОЛЬФа не было нативного приложения. Поэтому нам за 3–4 месяца нужно было с нуля создать проект под две платформы и с внушительным набором функций:

1) авторизацией пользователей;
2) каталогом автомобилей (новых и с пробегом);
3) информацией о страховке;
4) чатом для общения с поддержкой;
5) пуш-уведомлениями;
6) сезонными предложениями;
7) программой лояльности;
8) картой дилерских центров с возможностью построить маршрут прямо в приложении.

Функции внедряли постепенно начиная с самого нужного: интеграции с системами заказчика, каталога автомобилей и информации о страховке.

Помимо приложения, мы также переработали административную панель, которую используют редакторы РОЛЬФа. Но обо всём по порядку.

Под капотом

Мы сделали админку для управления приложением. В ней можно редактировать сезонные предложения, информацию по салонам дилера и контентный раздел «РОЛЬФ Эксперт» со статьями для автовладельцев.

Админка главного экрана и общий принцип дизайна:

Прежде чем проектировать дизайн приложения, мы изучили приложения конкурентов. Например, посмотрели на других дилеров: у большинства из них использовалось коробочное решение Bright Box, но были и исключение — у Major было нативное приложение.

Мы тоже проектировали нативное приложение — «коробка» ограничена и по дизайну (нельзя придумать полностью свой интерфейс), и по функциональности.

Помимо дилеров, мы обратили внимание на приложения автобрендов (KIA, Hyundai, BMW) и ведущих банков вроде Тинькова, Райффайзен-банка. У всех круто сделан интерфейс. Отдельный интерес представляло то, как они спроектировали «главную».

Главный экран

Для нас главный экран стал самым большим вызовом с точки зрения дизайна. Это точка входа пользователя в приложение, и нужно сделать так, чтобы там он мог получить самое нужное: каталог, чат, информацию о страховке.

Затем по аналогичному принципу мы сделали все остальные разделы приложения, везде показывая сначала самое нужное.

Главный экран подстраивается под пользователя: если у пользователя в «Гараже» (о нём ниже) нет машин, то мы предлагаем их добавить. Если их несколько — появляется карусель для прокрутки.

Так же и с картой лояльности: нет карты — предлагаем оформить. Если оформлена, сообщаем о привилегиях и скидках.

Онбординг

Когда пользователь впервые заходит в приложении, его приветствует интерактивный гид. В нём рассказываем об основных возможностях приложения: от онлайн-оплаты до персональных предложений.

Так как мы сделали упор на понятный дизайн и лаконичность, онбординг тоже выглядит просто и понятно, чтобы не отвлекать пользователя ненужными инструкциями.

Тест-драйв и сервис

Раньше для того, чтобы записаться на тест-драйв, пользователю приходилось заполнять множество полей с данными. Вот как выглядит запись на тест-драйв сейчас:

То же с записью на сервис. Чтобы упростить процесс, ввели автозаполнение полей. Пользователь может использовать информацию, которую до этого вводил в профиле, например, данные об авто, информацию об избранных мастерах.

В приложении можно выбрать день, время, а также мастера, к которому вы хотите записаться.

Гараж

Здесь собрана вся информация об автомобилях клиента: номера, пробег, полисы, история обслуживания. Поэтому больше не придётся запоминать сложные цифры для оформления КАСКО.

У каждого автомобиля в «Гараже» есть собственный раздел. Можно записаться на сервис, отслеживать статус ремонта автомобиля, оставить заявку на тест-драйв.

Каталоги транспорта

В приложении РОЛЬФ есть внушительный каталог автомобилей и мотоциклов, а фильтров для работы с каталогом — ещё больше. Отталкиваясь от принципа «главной», мы сразу решили спроектировать раздел так, чтобы все фильтры, даже если их много, отображались на одном экране.

Мы предложили клиенту несколько вариантов дизайна на выбор. Ниже — одна из концепций каталога и карточки автомобиля. Иконки, понятное дело, мы бы заменили.

В итоге вместе с клиентом решили выбрать выпадающие списки, так как они хорошо сочетаются с общей концепцией дизайна. К тому же, они аккуратные. Так каталог выглядит сейчас:

Поиск по каталогу сделан максимально подробно: к примеру, можно сделать запрос «Mercedes E класса с автоматической коробкой передач, седан, на дизеле, до 2,5 млн ₽, мощность 150 л.c. в дилерском центре на Варшавке» — и у вас будет 14 предложений.

Вдобавок у каждого транспортного средства — своя карточка. Всё вместе превращается в «Ламоду» для мира автомобилей — просто и понятно.

Покупка в несколько кликов

Начало года. Мы все сидим дома и ждём окончания самоизоляции. В квартире тесно, у соседей нескончаемый ремонт — кажется, что звук перфоратора уже начинает сниться. Хочется выехать на дачу, а каршеринг не работает.

Похоже, пора покупать машину, тем более, права есть. Да только до дилера не добраться: все офисы закрыты. И тут РОЛЬФ предлагает купить машину онлайн. Заказал продукты, заказал вещи, заказал машину — и уехал дышать свежим воздухом.

Пользователь вносит предоплату, а дилер доставляет ему машину. Также вы можете оплатить сервис и внести предоплату за будущие услуги: осмотр или ремонт.

Чат

Мы использовали решение LiveTex, которое интегрировано с популярными мессенджерами: Телеграмом, Вайбером, Вотсапом, мессенджерами Фейсбука и ВКонтакте. Сейчас клиент перешёл на «Открытые линии» Битрикса24 — это его внутреннее решение.

Стоит сказать, что дизайн чата у нас полностью нативный. Битрикс24 даёт интерфейс скорее для внутренних систем заказчика. Чат поддержки в РОЛЬФе:

Как выросло количество пользователей

Сейчас в базе дилера — 100 тысяч пользователей. На старте количество пользователей в месяц (MAU) было в районе 5–10 тысяч, а сейчас — 41 тысяча пользователей. Нас такая динамика только радует.

Что дальше

В следующих версиях мы выпустим промежуточный API для мобильных приложений, чтобы клиенту было проще работать с данными клиента.

Ещё планируем добавить предоплату автозапчастей. Скоро вы сможете заказать воздушный фильтр, зеркала или фары для конкретной машины и забрать их в удобное время.

Что касается дизайна, мы готовим обновление по UX/UI раздела каталога. Там будут доработаны фильтры, корневой раздел и карточки автомобиля.