Zhiznmart is a franchise of health food stores. At the moment several shops have been opened in Ekaterinburg, an online shop with delivery of food and ready meals is working. It is organized and developed by a team of restaurant chain "Sushkof", which has been successfully operating for over 12 years.
Scales connected to a POS-terminal with an interactive touch screen are installed in retail stores in Zhiznmart. Both customers and employees use the scale. Our task was to develop the interface of the terminal - it had to be performed in the corporate style according to the guidelines in order to further increase brand recognition among customers. Naturally, one of the requirements was the convenience of using the scale in offline environment. Any user, at least a buyer, at least an employee, should quickly understand how to work with the scale, find the right product, weigh it, see the cost and get a sticker to pay at the cash desk. All this directly affects the store: the speed of service, the emergence of queues and the level of customer loyalty.
Objective
In a short period of time to design, develop and program interface for the touch screen terminal scales, which are used by customers and employees in retail stores chain.
What we did
The terminal initially used a standard interface and software developed by Sushkof, they had to be re-branded both stylistically and functionally.
Buyers and sellers work with the interactive touch screen display of scales: choose a category and a product, can use the search, see weight and cost.
It was necessary to understand how users work with scales, which functionality is used more often, which is less often, and on the basis of this to make scenarios of interactions, determine the necessary functional elements, their location on the screen.
We studied the company's brandbook and started working on design layouts. Two interface variants were made:
Branded in the style of Zhiznmart - for customers.
For the customer interface, a listing of goods is displayed, divided into categories, in which the goods cards are located. The main user scenarios here are as follows: the buyer puts the product on the scale, selects the category, and in it the desired product. After that a sticker with weight and value is printed, you can go and pay for the purchase.
Here we have seen the possibility to bring the user to the result faster. Why scroll through the entire range of categories when you can simply search for the right product? This is how the product search button by name and number appears. It is easy to notice and use, and the search results are loaded in real time as you type in the product name.
To speed up the process we placed a block with the cards of popular products on the category page - here are added products that are weighed more often than others, so they do not need to look for a long time, everything is done in one touch.
Visually simplified, but with a large amount of content and productivity gradient - for employees.
Interface for employees is less saturated with visual elements, in its development we focused on improving the efficiency of work. There are more product cards on the employee's screen. This helps to navigate the assortment more quickly and optimizes the work. The search function, which we have made available to the customer interface before, is also very useful here.
Заказчик
Жизньмарт - это франшизная сеть магазинов здорового питания. На данный момент открыто несколько магазинов в Екатеринбурге, работает интернет-магазин с доставкой продуктов и готовых блюд. Организована и развивается командой ресторанной сети “Сушкоф”, которая успешно работает уже больше 12 лет.
В розничных магазинах Жизньмарта установлены весы, подключенные к POS-терминалу с интерактивным сенсорным экраном. Весами пользуются и покупатели, и сотрудники. Нашей задачей стала разработка интерфейса терминала - его нужно было выполнить в фирменном стиле согласно гайдлайну, чтобы дополнительно повысить узнаваемость бренда среди покупателей. Естественно, одним из требований стало удобство использования весов именно в оффлайновой среде. Любой пользователь, хоть покупатель, хоть сотрудник, должен быстро разбираться, как работать с весами, найти нужный товар, взвесить его, увидеть стоимость и получить наклейку для оплаты на кассе. Все это напрямую влияет на работу магазина: на скорость обслуживания, возникновение очередей и уровень лояльности покупателей.
Задача
В короткий срок разработать дизайн, сверстать и запрограммировать его для сенсорного экрана терминала весов, которые используются покупателями и сотрудниками в розничных магазинах сети.
Что мы сделали
На терминале изначально использовался стандартный интерфейс и ПО, разработанное в компании “Сушкоф”, их нужно было переработать под новый бренд как стилистически, так и функционально.
Покупатели и продавцы работают с интерактивным сенсорным дисплеем весов: выбирают категорию и товар, могут воспользоваться поиском, посмотреть вес и стоимость.
Нужно было понять, как пользователи работают с весами, какой функционал используют чаще, какой - реже, и на основе этого составить сценарии взаимодействий, определить необходимые функциональные элементы, их расположение на экране.
Мы изучили брендбук компании и начали работу над дизайн-макетами. Вариантов интерфейса было сделано два:
Брендированный в стилистике Жизньмарта - для покупателей.
Для интерфейса покупателя отображается листинг товаров с разбивкой на категории, в которых располагаются карточки товаров. Основные пользовательские сценарии здесь такие: покупатель кладет товар на весы, выбирает категорию, а в ней нужный товар. После этого печатается наклейка с весом и стоимостью, можно идти оплачивать покупку.
Здесь мы увидели возможность привести пользователя к результату быстрее. Зачем скроллить весь ассортимент категории в поисках нужного товара, если можно просто найти его через поиск? Так появилась кнопка поиска товара по названию и по номеру. Ее легко заметить и использовать, а результаты поиска подгружаются уже по мере ввода названия продукта.
Для ускорения процесса на странице с категориями разместили блок с карточками популярных товаров - сюда добавляются товары, которые взвешиваются чаще других, поэтому их не нужно долго искать, все делается в одно касание.
Визуально упрощенный, но с большим объемом контента и уклоном в производительность - для сотрудников.
Интерфейс для сотрудников менее насыщен визуальными элементами, в его разработке мы сфокусировались на повышении эффективности работы. На экране сотрудника располагается большее количество карточек товаров. Это помогает быстрее ориентироваться в ассортименте и оптимизирует работу. Очень пригодилась здесь и функция поиска, которую мы до этого сделали для интерфейса покупателя.
Results
Within three weeks we have developed and launched a new interface of the terminal, adapted both for the buyer and the employee.
Zhiznmart has received an effective solution, which can be used on POS-terminals working with any compatible scales. The interface is customizable according to the needs of the company, and the corporate identity will help to increase brand recognition.
Separately, it should be noted that the cost of such a solution is much lower than the cost of expensive professional scales with touch screen.
In the process of working on this project we have gained additional experience working with systems for retail, POS-terminals, Vue.js and Electron, with offline user scenarios.
This is what Ivan Zaichenko, the founder of "Sushkof" network, says about the updated scales:
"Scales for grocery stores with medium quality touch screen and constant glitches cost a little less than 1400$, and the good ones that buy large chains, at 2800$.
Surprised by the prices, we supplied our equipment set for 900$ and wrote our software for 1000$.
Now it is not only a fully customizable solution that meets all our wishes, but also a product made in our corporate style.
What is my point? It seems that the market for professional touchscreen scales is wildly lacking in competition."
Результат
За три недели мы разработали и запустили в работу новый интерфейс терминала, адаптированный как для покупателя, так и для сотрудника.
Жизньмарт получили эффективное решение, которое можно использовать на POS-терминалах, работающих с любыми совместимыми весами. Интерфейс кастомизируется в соответствии с потребностями компании, а фирменный стиль поможет повысить узнаваемость бренда.
Отдельно стоит отметить, что стоимость такого решения гораздо ниже стоимости дорогих профессиональных весов с сенсорным экраном.
Мы же в процессе работы над этим проектом получили дополнительный опыт работы с системами для розничной торговли, POS-терминалами, Vue.js и Electron, с оффлайновыми пользовательскими сценариями.
Вот что говорит об обновленных весах основатель сети "Сушкоф" Иван Зайченко:
Zhiznmart is a franchise of health food stores. At the moment several shops have been opened in Ekaterinburg, an online shop with delivery of food and ready meals is working. It is organized and developed by a team of restaurant chain "Sushkof", which has been successfully operating for over 12 years.
Scales connected to a POS-terminal with an interactive touch screen are installed in retail stores in Zhiznmart. Both customers and employees use the scale. Our task was to develop the interface of the terminal - it had to be performed in the corporate style according to the guidelines in order to further increase brand recognition among customers. Naturally, one of the requirements was the convenience of using the scale in offline environment. Any user, at least a buyer, at least an employee, should quickly understand how to work with the scale, find the right product, weigh it, see the cost and get a sticker to pay at the cash desk. All this directly affects the store: the speed of service, the emergence of queues and the level of customer loyalty.
Objective
In a short period of time to design, develop and program interface for the touch screen terminal scales, which are used by customers and employees in retail stores chain.
What we did
The terminal initially used a standard interface and software developed by Sushkof, they had to be re-branded both stylistically and functionally.
Buyers and sellers work with the interactive touch screen display of scales: choose a category and a product, can use the search, see weight and cost.
It was necessary to understand how users work with scales, which functionality is used more often, which is less often, and on the basis of this to make scenarios of interactions, determine the necessary functional elements, their location on the screen.
We studied the company's brandbook and started working on design layouts. Two interface variants were made:
Branded in the style of Zhiznmart - for customers.
For the customer interface, a listing of goods is displayed, divided into categories, in which the goods cards are located. The main user scenarios here are as follows: the buyer puts the product on the scale, selects the category, and in it the desired product. After that a sticker with weight and value is printed, you can go and pay for the purchase.
Here we have seen the possibility to bring the user to the result faster. Why scroll through the entire range of categories when you can simply search for the right product? This is how the product search button by name and number appears. It is easy to notice and use, and the search results are loaded in real time as you type in the product name.
To speed up the process we placed a block with the cards of popular products on the category page - here are added products that are weighed more often than others, so they do not need to look for a long time, everything is done in one touch.
Visually simplified, but with a large amount of content and productivity gradient - for employees.
Interface for employees is less saturated with visual elements, in its development we focused on improving the efficiency of work. There are more product cards on the employee's screen. This helps to navigate the assortment more quickly and optimizes the work. The search function, which we have made available to the customer interface before, is also very useful here.
Results
Within three weeks we have developed and launched a new interface of the terminal, adapted both for the buyer and the employee.
Zhiznmart has received an effective solution, which can be used on POS-terminals working with any compatible scales. The interface is customizable according to the needs of the company, and the corporate identity will help to increase brand recognition.
Separately, it should be noted that the cost of such a solution is much lower than the cost of expensive professional scales with touch screen.
In the process of working on this project we have gained additional experience working with systems for retail, POS-terminals, Vue.js and Electron, with offline user scenarios.
This is what Ivan Zaichenko, the founder of "Sushkof" network, says about the updated scales:
"Scales for grocery stores with medium quality touch screen and constant glitches cost a little less than 1400$, and the good ones that buy large chains, at 2800$.
Surprised by the prices, we supplied our equipment set for 900$ and wrote our software for 1000$.
Now it is not only a fully customizable solution that meets all our wishes, but also a product made in our corporate style.
What is my point? It seems that the market for professional touchscreen scales is wildly lacking in competition."
