[Разработка мобильных приложений, Интерфейсы, Разработка под e-commerce, Дизайн мобильных приложений] 5 000 000 строк кода, 500 репозиториев: зачем мы адаптировали приложение AliExpress для Рунета

Ответить на тему

Автор

Сообщение

news_bot ^®

Стаж: 6 лет 9 месяцев
Сообщений: 27286

news_bot ^® написал(а)
17-Июн-2021 17:34

Цитировать

Привет, Хабр! Мы продолжаем рассказывать о развитии «AliExpress Россия» (об истории этого проекта можно почитать здесь), и сегодня речь пойдёт о том, почему нам понадобилось сделать версию мобильного приложения маркетплейса для Рунета, чем китайские интерфейсы отличаются от европейских и как адаптировать приложение на пять миллионов строк кода под локальный рынок на лету. Особенности азиатских интерфейсовУже много лет люди во всем мире используют глобальное приложение AliExpress. Оно доступно в более чем 200 странах. При этом приложение, конечно, глобальное, но его корни — в Китае. А представления о дизайне интерфейсов в Поднебесной и Европе различаются довольно сильно. Китайские продукты, которые нравятся местным пользователям и кажутся им сверхудобными, выглядят инопланетно для европейцев или американцев. Разницу легко показать на примере. Возьмем сайт одной из авиакомпаний Китая. Вот как он выглядит для пользователей внутри страны:

А вот так его видят в Европе и США:

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

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

Но стоит ли делать локальную версию приложения с полностью своим бэкендом, чтобы лишь немного поменять интерфейс? Очевидно, нет, ведь локализация подразумевает не только «игру со шрифтами». Но она была нужна по целому ряду причин.Почему нельзя было оставить только одно приложениеПосле выхода локального приложения наш покупатель, который решит скачать апп, увидит два его варианта — в AppStore и Google Play. Дальше мы расскажем, зачем нужно было именно локализованное приложение.Если говорить коротко, то добавить в глобальное приложение фичи, нужные только пользователям Рунета (например, Сбер ID), не всегда возможно. Если каждая страна будет «пушить» локальные фичи, то продуктом в целом станет невозможно пользоваться, да и весить он будет больше всех разумных лимитов. В главном приложении уже «ютится» четыре команды (Китай, Россия, Турция, Испания), существует множество подбрендов: plaza, tmall, trendyol, а размер напрямую влияет на частоту его скачивания.Нельзя не упомянуть и достаточно высокий порог входа в технологии Alibaba:

собственный react native;
два движка по трансляции html css в натив;
собственные dsl для кросс-платформенного описания UI;
8 cms для удобной конфигурации всего и вся;
самописные корутины для iOS;
кастомизированные системы dependency management;
собственные системы сборки;
самописный мобильный CI, раздающий более 400 приложений;
backend for front-end, написанный на котлине и задеплоенный в Function as a Service.

А еще есть собственные системы фиче-тогглинга, A/B-тестирования, сбора аналитики и логов. Не говоря уже о собственной джире, confluence и надстройки над gitlab. Из всего этого вытекала довольно крутая learning curve для новых инженеров.Помимо этого, если бы мы выбрали путь подпиливания глобального приложения под нужды пользователей, каждое изменение пришлось бы согласовывать. Это было бы слишком медленно, нам требовался более быстрый прогресс. Был и целый ряд фич, которые мы хотели переделать, чтобы они лучше работали именно для русскоязычных пользователей.ПоискВ нашей прошлой статье мы затронули проблему неадаптированности созданного в Китае поискового движка для работы с русским языком. В китайских сервисах поиск, «заточенный» под работу с иероглифами, обрезает часть поисковых запросов на других языках, непривычным способом формирует выдачу и отображает результаты. К примеру, сами иероглифы не так просто прямо перевести на русский. Поэтому для многих товаров на AliExpress система сначала выполняла автоперевод на английский, а уже затем на русский. В результате мог теряться контекст и страдало качество поисковой выдачи. Кроме того, китайские и европейские пользователи в целом по-разному ищут информацию. Если в Азии запрос вроде «носки, пара, синие, мужские, купить» — абсолютная норма, то в Европе люди просто будут искать «синие носки».

Вот здесь пользователь поделился результатами поиска пуфикаРекомендацииДатасеты AliExpress GlobalAlibaba по понятным причинам главным образом состоят из данных по активности иностранных пользователей. Не смотря на то что Россия самая большая страна в AliExpress отсутствие локальной разработки не позволяло заточить алгоритмы на аудиторию рунета и показывать релевантные рекомендации.

А это рекомендации для пользователя, который часто ищет товары XiaomiКроме того, рекомендательные алгоритмы заточены на то, чтобы давать больше трафика популярным товарам. Для локальных маркетплейсов, предлагающих товары не только из Китая, но и от местных продавцов, это не работает, так как возникает проблема курицы и яйца. В AliExpress много разного вида фрода и некачественных товаров, и система не продвигает товары без хороших отзывов, в такой системе российский продавец, который предлагает товар часто более качественный чем его китайский конкурент, может, чуть дороже, но с быстрой доставкой и понятными вариантами возврата, никогда не попадет в рекомендации.Описания товаровЕще одна масштабная проблема, которую тяжело решить в глобальном приложении, — это отображение описаний товаров. Речь идет не только о знаменитых кривых автопереводах (голубой цвет кошка конопли), но и о чисто интерфейсных моментах вроде наличия хороших видео, фото и отзывов, позволяющих получить реальное представление о товаре.

ИсточникРабота с таймзонами, промоакциями и т. п.Китай – большая страна, но при этом в нем один часовой пояс, а в России их несколько – и это нужно учитывать в том числе при расчете длительности акций для польователей из конкретного региона. Есть и другие связанные с временем трудности. Одна из них — странные для российских пользователей промоакции в глобальном аппе, которые основаны на китайских праздниках и отмечаемых в этой стране датах. При этом система автоматически не умеет промоутировать, к примеру, зимние шины перед стартом зимы, цветы и подарки накануне Восьмого марта, предлагает пляжные юбки зимой, и так далее.Как решали задачи: 5 этапов запуска аппаОбъем глобального приложения AliExpress не позволял просто взять и сделать его копию для Рунета. Чтобы хотя бы начать первые эксперименты, нам нужно было «поднять» свою копию аппа, работающую уже не с бэкендом глобального приложения, а с нашим собственным. Этап #1: запуск полной копии приложения на нашей инфраструктуреДля начала требовалась небольшая команда, полностью владеющая ситуацией. Мы разделили зоны ответственности и стали исследовать текущую инфраструктуру. Параллельно часть ребят «прикрывали» нас, развивая русский сегмент в глобальном приложении при поддержке коллег из Ханчжоу и Испании.Пара цифр, чтобы был понятен объем задачи «просто скопировать приложение, ничего не меняя»:

5 000 000 — количество строк кода приложения, в который предстояло вносить изменения;
500 — количество репозиториев, которые нужно было перенести;
5-40 — число разработчиков, занимавшихся проектом;

После чего начали дублировать модули, пытаться независимо собрать их на другой базе приложения, параллельно убирая всё лишнее для СНГ. Также с помощью китайских коллег, но в основном своими силами, мы работали над включение поддержки Swift для iOS. Это была очень большая работа, связанная с обновлением настроек сборки более 50 модулей. Аналогично, в Android-проекте появился последний Kotlin и Android X.Этап #2: первые попытки измененийКогда приложение вроде стало работать, наступила стадия “move fast and break things”. Начали стыковать с локальным бэкендом, смотреть, почему же что-то не срастается: аналитика, авторизация, рекомендательные системы и т. п. Очень помогли внутриофисные альфа-тесты, на которых мы смогли отловить множество проблем на раннем этапе.Этап #3: бета-тестДальше пошла стадия бета-тестирования. Большое спасибо ребятам, всей душой любящим «Алиэкспресс», благодаря которым мы смогли отловить упущенные баги. Мы вас искренне любим! Для удобства сбора обратной связи пришлось написать независимые системы запроса фидбэка и оптимизировать саппорт для нового источника багов.Этап #4: тихий запускПосле бета-тестирования, дождавшись наконец завершения очередной распродажи – время повышенного спроса, не подходящее для релизов – мы решили выпустить наше приложение на публику, без анонса. Делали мы это, всё еще опасаясь того, что некоторые механики не будут работать как нужно, и собственных ошибок. Однако всё оказалось не настолько плохо: ни одного блокера. Это мы отпраздновали шампанским и церемониальным битьем в гонг: жизнь независимого приложения «Алиэкспресс» началась.
Этап #5: начало развитияНапомним, что запустили мы приложение, которое по факту было таким же, как и прошлое. В самой первой версии нового приложения не стали внедрять даже самые маленькие изменения интерфейса. Из-за масштаба глобального аппа в случае каких-либо проблем это бы помешало нам понять, где дело в технических багах, а где ошибка в тестируемой гипотезе.После запуска множество пользователей ожидаемо указали нам на то, что наше приложение почти ничем не отличается от того, с которым они взаимодействовали ранее. Но теперь мы уже были готовы к изменениям! Теперь началось настоящее развитие, которое шло параллельно с ростом нашей команды. За несколько месяцев мы изменили логин, главную страницу, программу лояльности и поиск. Значительная часть модулей была переписана практически с нуля. Также мы приступили к разработке собственного движка для backend-driven UI — используем для него kotlin multiplatform.Не все пользователи видят весь объем изменений, потому что мы активно проводим А/Б-тесты. Если говорить в целом, то мы сделали приложение более «спокойным», адаптировали интерфейс к привычному пользователям Рунета виду, переработали фильтры в выдаче поиска товаров:

Что дальше: от китайского форка к суперприложениюНашему приложению предстоит пройти долгий путь от «форка», то есть частично переписанного аппа, до полностью обновленного приложения на базе решений open source и части лучших глобальных решений Alibaba Group. У нас большие надежды и на технологическое развитие: собственная дизайн-система, инфраструктура, автотестирование с фермой девайсов, layout engine, стриминг, кодогенерация ui компонентов из figma, backend-driven UI.Поскольку наше приложение — «суперапп», то бизнесовых задач при работе над ним тоже море: развитие направления FMCG (сервис доставки продуктов питания), собственная соцсеть и интеграции с VK, OK, e-commerce и даже игры. Так что мы активно расширяемся и ищем специалистов.

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

===========
Источник:
habr.com
===========
Похожие новости:

Теги для поиска: #_razrabotka_mobilnyh_prilozhenij (Разработка мобильных приложений), #_interfejsy (Интерфейсы), #_razrabotka_pod_ecommerce (Разработка под e-commerce), #_dizajn_mobilnyh_prilozhenij (Дизайн мобильных приложений), #_aliexpress, #_mobilnoe_prilozhenie (мобильное приложение), #_elektronnaja_kommertsija (электронная коммерция), #_dizajn (дизайн), #_interfejsy (интерфейсы), #_blog_kompanii_aliexpress_rossija (
Блог компании AliExpress Россия
), #_razrabotka_mobilnyh_prilozhenij (
Разработка мобильных приложений
), #_interfejsy (
Интерфейсы
), #_razrabotka_pod_ecommerce (
Разработка под e-commerce
), #_dizajn_mobilnyh_prilozhenij (
Дизайн мобильных приложений
)

Профиль ЛС

Ответить на тему

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

Текущее время: 22-Ноя 23:05
Часовой пояс: UTC + 5