logo
bondar.design
загружаемся так сказать

bondar.design/eu_webshop

Шаблон онлайн магазина для ресторанов Европы
b2b2C
Android
ios
WEB
Ux research
design system
food tech
Product
webshop
Этот проект был посвящён редизайну и систематизации кроссплатформенного решения для интернет-магазина (Web, iOS и Android) для B2B-клиентов в сфере foodtech на рынках Германии, Дании, Великобритании, Польши, Австрии и Ирландии. Цель заключалась в улучшении пользовательского опыта, увеличении конверсии в ключевых точках взаимодействия и обеспечении долгосрочной масштабируемости через создание прочной, масштабируемой дизайн-системы.
Задачи по дизайну, которые я выполнил:
Разработал end-to-end пользовательские флоу: оформление заказа и оплату, навигацию по меню, вход в систему, предзаказы, часы работы, push-уведомления, баннеры миграции, состояния ошибок, согласие на использование, принудительное обновление, информацию об imprint и другие элементы.
Разработал интерфейс настройки НДС и улучшенный dashboard для администраторов.
Разработал 90% компонентов дизайн-системы, заложив основу для масштабируемого и поддерживаемого интерфейса.
Провёл глубокое UX-исследование, выявив критические ошибки юзабилити, которые стоили компании десятки тысяч евро в день. Спроектировал стратегические улучшения UX, что напрямую способствовало росту ежедневного дохода на несколько тысяч евро.
Предложил и реализовал 16 детализированных идей по улучшению продукта на основе исследований, мнений заинтересованных сторон и выявленных пробелов.
01
Шаблон онлайн магазина для ресторанов Европы
B2B2C
ANDROID
IOS
WEB
UX RESEARCH
DESIGN SYSTEM
FOOD TECH
PRODUCT
WEB SHOP
Ilya Bondar, app, mobile, app, hunger.de, hunger, hunger, foodtech, food, restaurantsIlya Bondar, app, mobile, app, hunger.de, hunger, hunger, foodtech, food, restaurants
Что мне дал этот проект
Я отточил свои навыки в UX-анализе и научился напрямую связывать полученные инсайты с дизайн-гипотезами и улучшениями функций. Получил гораздо лучшее понимание того, как учитывать крайние сценарии через дизайн — например, в сложных процессах работы с адресами. На собственном опыте убедился, насколько критична локализация для удобства использования в разных странах. Также я создал масштабируемую дизайн-систему.

UX и аналитика

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

• Провёл исследование приложений конкурентов на рынке ЕС.

• Тесно сотрудничал с командой маркетинга и product owner, проводя углублённое исследование особенностей рынков ЕС, выявляя культурные, правовые и поведенческие инсайты, которые легли в основу дизайн-решений, tone-of-voice и понимания региональных UX-паттернов.

• Я составил структурированный список из более чем 34 UX и функциональных багов, классифицированных по степени влияния и приоритету. Некоторые из этих проблем напрямую влияли на конверсию и доход, включая блокеры на этапе оплаты, непонятные сообщения об ошибках и несоответствия в верстке на мобильных устройствах.

• Это исследование не только выявило проблемные моменты, но и сформировало дизайн-гипотезы, которые привели к значимым улучшениям. Исследование помогло команде разработки лучше понять болевые точки пользователей и заложить основу для дальнейших итераций работы над UX.

• Сформулировал две базовых persona’ы, чтобы глубже изучить пользовательские задачи и потребности (JTBD) в рамках проектируемого продукта.

UX и аналитика

UX исследование и отлов багов

B2B persona (кто покупает сервис для своего ресторана)

Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI

B2C persona (кто заказывает еду в приложении)

Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI

Флоу и фичи, которые я переработал

• Я доработал навигацию по меню, процесс ввода адреса и переработал карточки товаров для ускорения сбора заказа, введя более понятную иерархию продуктов, фильтры по диетическим предпочтениям и более интуитивные модификаторы.

• В флоу оформления заказа и корзины я упростил редактирование товаров, улучшил видимость скидок и уменьшил “трение” при переключении между доставкой и самовывозом. Я переработал процесс оформления покупки, минимизировав количество шагов и сделав более понятными детали доставки и оплаты. Всё с учётом региональных особенностей для Великобритании, Дании, Польши и Германии.

• Для маркетинговых подписок я переработал компонент с согласием на них и провёл A/B-тестирование. Это изменение, в сочетании с детальными отчётами про UX-проблемы и инсайты, привели к увеличению ежедневного дохода компании на более чем €10 000.

• Спроектировал систему баннеров для увеличения охвата промоакций.
Ниже представлен полный процесс оформления заказа на мобильных и десктопных устройствах после внедрения изменений.

Флоу и фичи, которые я переработал

Мобильная версия

Play Video
Pause Video
Volume
0:00
 / 
0:00
Restart Video
Loop
Mini Mode
Full Screen

Desktop-версия

Play Video
Pause Video
Volume
0:00
 / 
0:00
Restart Video
Loop
Mini Mode
Full Screen

Дизайн система

Создал с нуля кроссплатформенную дизайн-систему для Web, Android и iOS.
Создал с нуля кроссплатформенную дизайн-систему для Web, Android и iOS.
Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI
Я разработал более 90 % основных UI-компонентов и гайдлайнов по их использованию, включая отступы, типографику, цветовые токены, состояния и UX паттерны. Дизайн система обеспечила визуальную и функциональную консистентность на всех платформах и позволила ускорить и масштабировать разработку продукта. Она также помогла при онбординге новых дизайнеров. Улучшилось взаимодействие между дизайном и разработкой.
Я разработал более 90 % основных UI-компонентов и гайдлайнов по их использованию, включая отступы, типографику, цветовые токены, состояния и UX паттерны. Дизайн система обеспечила визуальную и функциональную консистентность на всех платформах и позволила ускорить и масштабировать разработку продукта. Она также помогла при онбординге новых дизайнеров. Улучшилось взаимодействие между дизайном и разработкой.
Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI
Один из самых сложных и интересных компонентов, которые я разработал - карточка блюда. Из-за большого числа необходимых свойств (например, модификаторы, теги, состояния доступности, форматы цен, локализация) получилось более 720 вариантов. Создание этого компонента помогло спроектировать переиспользуемые паттерны структурированной логики, использованной позднее для других компонентов.
Один из самых сложных и интересных компонентов, которые я разработал - карточка блюда. Из-за большого числа необходимых свойств (например, модификаторы, теги, состояния доступности, форматы цен, локализация) получилось более 720 вариантов. Создание этого компонента помогло спроектировать переиспользуемые паттерны структурированной логики, использованной позднее для других компонентов.
Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI
Подготовил подробную документацию для разработчиков для поддержки внедрения дизайн-системы. Включающую поведение компонентов, состояния, рекомендации по использованию, правила адаптивности, структуру токенов (отступы, цвета, типографика) и платформенные вариации правил для Web, Android и iOS. Это обеспечило понятную передачу дизайна в разработку и единообразное внедрение во всех командах.
Подготовил подробную документацию для разработчиков для поддержки внедрения дизайн-системы. Включающую поведение компонентов, состояния, рекомендации по использованию, правила адаптивности, структуру токенов (отступы, цвета, типографика) и платформенные вариации правил для Web, Android и iOS. Это обеспечило понятную передачу дизайна в разработку и единообразное внедрение во всех командах.
Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI
Курировал внедрение дизайн-системы и вел обновления в Changelog’е.
Курировал внедрение дизайн-системы и вел обновления в Changelog’е.
Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI

Еще немного дизайн решений

Ilya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UIIlya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UIIlya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UIIlya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UIIlya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UIIlya Bondar, POS, app, app, mobile, foodtech, design design, product design, UX, UI
Ключевые результаты
Я полностью переработал и оптимизировал кроссплатформенную систему заказа еды для рынков Европы. Улучшил ключевые пользовательские флоу: навигацию по меню, корзину, процесс оформления заказа и маркетинговые подписки. Также создал комплексную дизайн-систему для Web, iOS и Android. Моя работа привела к увеличению ежедневного дохода на более чем €10 000, ускорению циклов разработки и улучшению консистентности в целом.

Этот проект подошел к концу

Но впереди еще много интересного!