En
Проекты Вакансии Блог

Оказание услуг дизайна мобильного приложения для российского стартапа ViewEvo

IT-решение российского стартапа ViewEvo распознает товары на фото и видео – а главное, находит их в интернет-магазинах. Мы в SimbirSoft разработали дизайн мобильного приложения ViewEvo, чтобы «подружить» пользователей с инновационным умным алгоритмом.

По данным исследования TAdviser, с 2018 по 2023 год объем рынка CV (computer vision, компьютерное зрение) в России увеличится почти в 5 раз. Одним из факторов роста станет широкое применение CV в розничной торговле.

Продукт

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

Цель

Разработать удобный и визуально приятный интерфейс мобильного приложения для iOS и Android на русском и английском языках.

Что сделали

UX/UI-аудит

Мы начали с UX/UI-аудита уже готового, более раннего решения. Нашли в интерфейсе несколько недостатков, которые могли создавать препятствия для пользователей, например:

  • низкая контрастность экрана;
  • отсутствие единого подхода к расположению текста;
  • избыточные элементы на экране.

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

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

3
месяца работы над проектом
1
дизайнер
280+
макетов экранов приложения

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

Разработка интерфейса

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

  • Главный экран. Основные возможности: загрузка фото для распознавания товаров; навигация по разделам (видео, новости, избранное); выход в меню, где доступен личный кабинет, техническая поддержка и другие настройки.
  • Видео. В этом разделе пользователь может смотреть партнерские телеканалы в прямом эфире и уже выпущенные сюжеты с видеоплатформ. Для некоторых видео составлены готовые подборки образов.
  • Новости. Здесь можно найти различные статьи с подборками образов и релевантными новостями. Позже в разделе будут доступны категории: ТВ, Кино/сериалы, Соцсети.
  • Избранное. В разделе отображаются «Товары» и «Кадры», которые сохранил пользователь.

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

Как это работает

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

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

Продуктовый подход к разработке

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

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

«Изначально мы создали интерфейс под iOS, а параллельно адаптировали его под Android. После отрисовки большинства экранов мы реализовали англоязычный вариант. Для удобства разработчиков визуально отразили переходы между экранами в Figma и добавили вспомогательные комментарии».

Владимир, арт-директор SimbirSoft

Дополнительные инструменты

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

  • распознавание контента по звуку,
  • поиск похожих товаров,
  • ПО для ручной разметки контента и непосредственно само приложение ViewEvo.

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

Результаты

  • Разработали полный комплект макетов и состояний приложения – более 280 экранов;
  • сформировали дизайн-систему с UI-Kit для быстрого и оптимального взаимодействия между дизайнерами и командой разработки;
  • создали макеты для AppStore и Google Play, которые видят пользователи перед скачиванием мобильного приложения;
  • создали лендинг продукта;
  • разработали интерфейс виджета для медиаплееров;
  • реализовали интерфейс легкой веб-версии приложения, в том числе десктопной.

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

Технологии

Figma, Photoshop, After Effect

Мы начали сотрудничать с SimbirSoft в начале 2022 года, когда нам понадобился дизайнер для разработки интерфейса мобильного приложения. Специалист с самого старта проекта влился в нашу команду, так что мы быстро наладили контакт и дальнейшее взаимодействие было комфортным и продуктивным. Он предлагал идеи по развитию продукта и комплексно подходил к решению задач. Мы довольны как процессом, так и результатом нашей совместной работы, которая сейчас продолжается. Благодарим SimbirSoft за плодотворное сотрудничество!
Александр Лигер
Генеральный директор ViewEvo
Другие работы
Создание приложения управления сном для компании «Аскона»
Создание единой системы авторизации для крупной российской компании
Анализ процессов крупной производственной компании
Разработка мобильного приложения для «Подели»
Усиление команды по разработке системы управления грузоперевозками для компании «ТЕХНОНИКОЛЬ»
Автоматизация финансовой аналитики: модернизация сервиса
Разработка корпоративного портала для обучения сотрудников крупной технологической компании
Развитие приложения Askona Sleep для компании «Аскона»
Создание приложения управления сном для компании «Аскона»
Создание единой системы авторизации для крупной российской компании
Анализ процессов крупной производственной компании
Разработка мобильного приложения для «Подели»
Усиление команды по разработке системы управления грузоперевозками для компании «ТЕХНОНИКОЛЬ»
Автоматизация финансовой аналитики: модернизация сервиса
Разработка корпоративного портала для обучения сотрудников крупной технологической компании
Развитие приложения Askona Sleep для компании «Аскона»
Оставьте заявку на проект
Оставьте контакты, чтобы обсудить проект и условия сотрудничества, или позвоните: 8 800 200-99-24
Прикрепить файл до 10Мб
Файл выбран
Можно прикрепить один файл в формате: txt, doc, docx, odt, xls, xlsx, pdf, jpg, jpeg, png.

Размер файла до 10 Мб.
Написать нам
Оставьте контакты, чтобы обсудить проект и условия
сотрудничества, или позвоните: 8 800 200-99-24
Прикрепить файл до 10Мб
Файл выбран
Можно прикрепить один файл в формате: txt, doc, docx, odt, xls, xlsx, pdf, jpg, jpeg, png.

Размер файла до 10 Мб.
Оставьте свои контакты
SimbirSoft регулярно расширяет штат сотрудников.
Отправьте контакты, чтобы обсудить условия сотрудничества.
Прикрепить резюме, до 10 Мб
Файл выбран
Можно прикрепить один файл в формате: txt, doc, docx, odt, xls, xlsx, pdf, jpg, jpeg, png.

Размер файла до 10 Мб.
Написать нам
Расскажите, какие задачи сейчас на вашем проекте.
Проконсультируем и предложим подходящих специалистов, а также сориентируем по ставкам на аутстаф.
Направление
Количество специалистов
Middle
TeamLead
Senior
TechLead
Прикрепить файл до 10Мб
Файл выбран
Можно прикрепить один файл в формате: txt, doc, docx, odt, xls, xlsx, pdf, jpg, jpeg, png.

Размер файла до 10 Мб.
Экспресс-консультация
Заполните все поля формы.
Эксперт свяжется с вами в течение рабочего дня.
Тематика
Прикрепить файл до 10Мб
Файл выбран
Можно прикрепить один файл в формате: txt, doc, docx, odt, xls, xlsx, pdf, jpg, jpeg, png.

Размер файла до 10 Мб.
Порекомендуйте друга — получите вознаграждение!
  • Angular-разработчик
  • Node.js-разработчик
  • Middle Vue.js / Frontend-разработчик
  • Системный аналитик
  • QA Engineer Fullstack (Python)
  • Инженер по нагрузочному тестированию
  • DevOps-инженер
  • 1С-аналитик
  • Юрист
  • Разработчик на C++
  • UI/UX дизайнер
  • 1С-разработчик
  • Data Scientist (NLP)
  • SDET (Python)
  • Аналитик DWH
  • Технический писатель
  • SDET (Java)
  • IT сорсер
  • DBA
  • QA с опытом в автоматизиции Java
  • Коммуникационный/графический дизайнер
  • Ассистент руководителя
  • MLOps инженер
  • SDET разработчик C#
  • Руководитель отдела 1С
  • SDET (Swift)
  • React native-разработчик
Прикрепить резюме, до 10Мб
Файл выбран
Можно прикрепить один файл в формате: txt, doc, docx, odt, xls, xlsx, pdf, jpg, jpeg, png.

Размер файла до 10 Мб.