Интернет-сервис по поиску и заказу аптечных товаров

Главное о кейсе

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

***

At start, the customer already had his own app, but it was slow and lacked all the necessary features that competitors had that competitors had. It hadn't been updated for a long time, and the interface was outdated and no longer met modern usability requirements. The audience of pharmacies is mostly people of age, so it was especially important to make a modern and clear app with all the necessary features. So instead of rewriting old code, we developed our application from scratch.

Как проект изменил жизнь пользователей

За 8 месяцев разработали мобильное приложение с удобным функционалом и полностью переработали дизайн — пересобрали UI/UX, добавили удобные фичи и сделали современный и интуитивно понятный интерфейс с заботой о возрастной аудитории.

***

In 8 months we developed a mobile application with convenient functionality and completely redesigned the design - rebuilt UI/UX, added convenient features and made a modern and intuitive interface with care for the age audience.

Бизнес-задача и ее решение

Задачи:
1. Разработать новый стильный и удобный дизайн приложения по брендбуку;
2. Создать надежную платформу, которая позволит быстро адаптироваться к рыночным изменениям и легко расширять функционал приложения;
3. Сделать интуитивно понятный интерфейс;
4. Оптимизировать и ускорить процесс выбора и покупки товаров.

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

***

Objectives:
1. Develop a new stylish and user-friendly app design according to the brandbook;
2. To create a reliable platform that will allow to quickly adapt to market changes and easily expand the functionality of the application;
3. Make an intuitive interface;
4. Optimize and speed up the process of selecting and buying products.

Challenge: to make the app with special care and attention to the elderly, so that the interface would be simple and convenient, and the shopping process would be clear and fast.

Крафт (мастерство), реализация, технические детали

Изучили 8 самых крупных аптечных сетей проанализировали их функциональность для юзеров. Выделили 8 фаворитов для анализа: сети аптек «Столички», 36.6, Асна, Ютека, Горздрав, Ригла, Здравсити и Еаптека.

Самые частые проблемы в приложениях конкурентов:

1. Неудачное сочетание цветов, из-за чего сложно акцентировать внимание на нужных деталях.
2. Устаревший дизайн.
3. Нагромождение нечитабельного текста и блоков на главной странице.
4. Неэффективная реклама и нарушение композиции, что мешает восприятию.
5. Разная стилистика иконок и их неравномерное выравнивание.

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

Чтобы обеспечить комфортное взаимодействие с приложением, выделили несколько ключевых аспектов:

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

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

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

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

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

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

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

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

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

***

We studied 8 largest pharmacy chains and analyzed their functionality for users. We selected 8 favorites for analysis: Stolichki, 36.6, Asna, Yuteka, Gorzdrav, Rigla, Zdravsity and Eapteka.

The most frequent problems in competitors' applications:

1. Unsuccessful combination of colors, which makes it difficult to focus attention on the necessary details.
2. Outdated design.
3. clutter of unreadable text and blocks on the main page. 4.
4. Ineffective advertising and violation of the composition, which interferes with perception.
5. Different style of icons and their uneven alignment.

Based on the results of the study of competitors' applications, they have highlighted must have-features for their design concept with special attention to the elderly. For example, visual impairment can make it difficult to read small text and distinguish color contrasts, motor problems complicate interaction with the screen, especially if the buttons are too small or close to each other. In addition, older adults may have difficulty learning new technologies, making it tedious and sometimes frustrating for them to use complex apps.

To ensure a comfortable interaction with the application, we have highlighted several key aspects:

1. Appropriate color. Red was originally in the customer's brandbook, so we worked with its shades. Often, bright red is associated with aggression, so we chose a softer color so that it would not cause wrong emotions and eye strain. And to complement the comfortable palette, we diluted it with pastel colors.

2. Increased font size and elements. We made the text larger and the buttons more visible to improve the perception of information and simplify navigation.

3. intuitive interface. We developed a minimalistic design, where every detail is in its place, so that navigating through the application was quick and convenient.

We made a modern and convenient design so that the user could understand the new functionality without prompting. Much attention was paid to the space of the main page and the sequence of blocks on it - now you can see the products clearly and click on them conveniently.

At the same time, important functions were left in plain sight. For example, the main page has quick access to the “Care” loyalty card, which allows you to instantly open it at the checkout. Below is the search, which appears on the main screen and is fixed in the top when scrolling the catalog.

If a person is used to picking up goods at a specific pharmacy, he/she can select it in the application header and it will be saved by default. The catalog for the selected point will immediately show the availability of goods that can be picked up on the same or next day. You can also track the delivery time there.

You can add items to your cart directly from the product list or search. And in order not to search the catalog for the necessary dosage of the drug or color, we have made more detailed pages of product cards.

We paid special attention to the shopping cart, because in most applications it is located in the toolbar and is not displayed when selecting products. We also considered this option, but based on the results of our research we decided to make the cart visible.

We also added captions to the product characteristics: the number of pills, milliliters in the package, etc. The choice between the characteristics is made without reloading the page.

Инсайты, гипотезы, процесс создания и взаимодействия с заказчиком

1. Первоначально наша команда занималась исключительно разработкой на Flutter, но ближе к завершению проекта начали работать совместно с командой backend-разработчиков клиента в одних Scrum-процессах;
2. Вместе с клиентом провели скоринг бэклога, чтобы и дальше улучшать мобильное приложение;
3. Чтобы гарантировать комфортное использование приложения для каждого пользователя, мы несколько раз провели регрессионное тестирование, а позже клиент проверил его работу с помощью коридорного тестирования.

***

1. Initially our team was exclusively developing on Flutter, but closer to the end of the project we started working together with the client's backend development team in the same Scrum processes;
2. Together with the client, we conducted backlog scoring to further improve the mobile app. 3;
3. to ensure that each user is comfortable using the app, we performed regression testing several times, and later the client verified its performance with corridor testing.

Скриншоты