ASHAN

ASHAN: Online grocery store

ASHAN: Online grocery store

ASHAN: Online grocery store

ASHAN: Online grocery store

  • Design concept

  • UI kit + states

  • New typography

  • Color palettes

  • Layouts in 3 resolutions

  • Design concept

  • UI kit + states

  • New typography

  • Color palettes

  • Layouts in 3 resolutions

  • Design concept

  • UI kit + states

  • New typography

  • Color palettes

  • Layouts in 3 resolutions

  • Design concept

  • UI kit + states

  • New typography

  • Color palettes

  • Layouts in 3 resolutions

Audit Usability

Analyzed the main competitors in food delivery (Yandex.Eda, Lavka, Lenta, Magnit, 5ka, Samokat). Recorded the shortcomings of the existing web and mobile versions.


Hypotheses Presentation

Compiled a list of problems and solutions that raise questions. Then we formulated a list of hypotheses that are likely to simplify the order process and, as a result, increase loyalty and purchase conversion.


Design Concept

The main idea of the design concept: nothing extra, everything you need is nearby. The shopping cart should be at hand, as if you were walking in an offline store. Navigation through the assortment should be logical and intuitive.

Дизайн-концепт: Дизайн-концепт: Проектирование интерфейса интернет-магазина продуктов питания


Profile and My Orders

Added reminders to the "My Orders" sections and to the successful payment page. Simplified navigation, added quick access to the order from the successful payment page.

Профиль и Мои заказы: Проектирование интерфейса интернет-магазина продуктов питания


Shopping Cart

The buyer can choose which products to buy now and which to leave in the cart for the next purchase.

Корзина товаров: Проектирование интерфейса интернет-магазина продуктов питания


Interface Adaptability

Created layouts for 3 screen resolutions. The mobile version has the same functionality, including additional product orders.

Адаптивность: Проектирование интерфейса интернет-магазина продуктов питания


Additional Product Orders

If you forgot something, simply add the missing items to the cart and click "Add to this order." We came up with a way to introduce additional orders without major modifications, without disrupting the user's familiar path.

Дозаказ продуктов: Проектирование интерфейса интернет-магазина продуктов питания


Business Logic

We communicate that you cannot add products that are already in the order. If there are 18+ products in the cart, we inform that they cannot be added.

Бизнес-логика: Проектирование интерфейса интернет-магазина продуктов питания


Design Project

Identical points of contrast to white/black for each set of colors allow the use of colors to define context (destructive, informational, etc.) without violating the minimum contrast.

Дизайн-проект: Проектирование интерфейса интернет-магазина продуктов питания


New Typography

We left the branded headers, but supplemented them with a more suitable typeface for content and UI elements. We chose Nunito Sans. It differs little from the branded font, but its wider range of styles allows for customization of small texts for easy reading/scanning with the eyes.

Новая типографика: Проектирование интерфейса интернет-магазина продуктов питания


Systematic Approach in Design

Layouts are assembled using autolayout. Dimension and color variables have been added.

Системный подход в дизайне: Проектирование интерфейса интернет-магазина продуктов питания


Homepage

There is nothing superfluous left on the main page. There is no need for additional modes and catalog filtering. The additional order block is displayed only if the buyer has current orders in "Waiting for Assembly" status.

Главная страница: Проектирование интерфейса интернет-магазина продуктов питания

Audit Usability

Analyzed the main competitors in food delivery (Yandex.Eda, Lavka, Lenta, Magnit, 5ka, Samokat). Recorded the shortcomings of the existing web and mobile versions.


Hypotheses Presentation

Compiled a list of problems and solutions that raise questions. Then we formulated a list of hypotheses that are likely to simplify the order process and, as a result, increase loyalty and purchase conversion.


Design Concept

The main idea of the design concept: nothing extra, everything you need is nearby. The shopping cart should be at hand, as if you were walking in an offline store. Navigation through the assortment should be logical and intuitive.

Дизайн-концепт: Дизайн-концепт: Проектирование интерфейса интернет-магазина продуктов питания


Profile and My Orders

Added reminders to the "My Orders" sections and to the successful payment page. Simplified navigation, added quick access to the order from the successful payment page.

Профиль и Мои заказы: Проектирование интерфейса интернет-магазина продуктов питания


Shopping Cart

The buyer can choose which products to buy now and which to leave in the cart for the next purchase.

Корзина товаров: Проектирование интерфейса интернет-магазина продуктов питания


Interface Adaptability

Created layouts for 3 screen resolutions. The mobile version has the same functionality, including additional product orders.

Адаптивность: Проектирование интерфейса интернет-магазина продуктов питания


Additional Product Orders

If you forgot something, simply add the missing items to the cart and click "Add to this order." We came up with a way to introduce additional orders without major modifications, without disrupting the user's familiar path.

Дозаказ продуктов: Проектирование интерфейса интернет-магазина продуктов питания


Business Logic

We communicate that you cannot add products that are already in the order. If there are 18+ products in the cart, we inform that they cannot be added.

Бизнес-логика: Проектирование интерфейса интернет-магазина продуктов питания


Design Project

Identical points of contrast to white/black for each set of colors allow the use of colors to define context (destructive, informational, etc.) without violating the minimum contrast.

Дизайн-проект: Проектирование интерфейса интернет-магазина продуктов питания


New Typography

We left the branded headers, but supplemented them with a more suitable typeface for content and UI elements. We chose Nunito Sans. It differs little from the branded font, but its wider range of styles allows for customization of small texts for easy reading/scanning with the eyes.

Новая типографика: Проектирование интерфейса интернет-магазина продуктов питания


Systematic Approach in Design

Layouts are assembled using autolayout. Dimension and color variables have been added.

Системный подход в дизайне: Проектирование интерфейса интернет-магазина продуктов питания


Homepage

There is nothing superfluous left on the main page. There is no need for additional modes and catalog filtering. The additional order block is displayed only if the buyer has current orders in "Waiting for Assembly" status.

Главная страница: Проектирование интерфейса интернет-магазина продуктов питания

Audit Usability

Analyzed the main competitors in food delivery (Yandex.Eda, Lavka, Lenta, Magnit, 5ka, Samokat). Recorded the shortcomings of the existing web and mobile versions.


Hypotheses Presentation

Compiled a list of problems and solutions that raise questions. Then we formulated a list of hypotheses that are likely to simplify the order process and, as a result, increase loyalty and purchase conversion.


Design Concept

The main idea of the design concept: nothing extra, everything you need is nearby. The shopping cart should be at hand, as if you were walking in an offline store. Navigation through the assortment should be logical and intuitive.

Дизайн-концепт: Дизайн-концепт: Проектирование интерфейса интернет-магазина продуктов питания


Profile and My Orders

Added reminders to the "My Orders" sections and to the successful payment page. Simplified navigation, added quick access to the order from the successful payment page.

Профиль и Мои заказы: Проектирование интерфейса интернет-магазина продуктов питания


Shopping Cart

The buyer can choose which products to buy now and which to leave in the cart for the next purchase.

Корзина товаров: Проектирование интерфейса интернет-магазина продуктов питания


Interface Adaptability

Created layouts for 3 screen resolutions. The mobile version has the same functionality, including additional product orders.

Адаптивность: Проектирование интерфейса интернет-магазина продуктов питания


Additional Product Orders

If you forgot something, simply add the missing items to the cart and click "Add to this order." We came up with a way to introduce additional orders without major modifications, without disrupting the user's familiar path.

Дозаказ продуктов: Проектирование интерфейса интернет-магазина продуктов питания


Business Logic

We communicate that you cannot add products that are already in the order. If there are 18+ products in the cart, we inform that they cannot be added.

Бизнес-логика: Проектирование интерфейса интернет-магазина продуктов питания


Design Project

Identical points of contrast to white/black for each set of colors allow the use of colors to define context (destructive, informational, etc.) without violating the minimum contrast.

Дизайн-проект: Проектирование интерфейса интернет-магазина продуктов питания


New Typography

We left the branded headers, but supplemented them with a more suitable typeface for content and UI elements. We chose Nunito Sans. It differs little from the branded font, but its wider range of styles allows for customization of small texts for easy reading/scanning with the eyes.

Новая типографика: Проектирование интерфейса интернет-магазина продуктов питания


Systematic Approach in Design

Layouts are assembled using autolayout. Dimension and color variables have been added.

Системный подход в дизайне: Проектирование интерфейса интернет-магазина продуктов питания


Homepage

There is nothing superfluous left on the main page. There is no need for additional modes and catalog filtering. The additional order block is displayed only if the buyer has current orders in "Waiting for Assembly" status.

Главная страница: Проектирование интерфейса интернет-магазина продуктов питания

Audit Usability

Analyzed the main competitors in food delivery (Yandex.Eda, Lavka, Lenta, Magnit, 5ka, Samokat). Recorded the shortcomings of the existing web and mobile versions.


Hypotheses Presentation

Compiled a list of problems and solutions that raise questions. Then we formulated a list of hypotheses that are likely to simplify the order process and, as a result, increase loyalty and purchase conversion.


Design Concept

The main idea of the design concept: nothing extra, everything you need is nearby. The shopping cart should be at hand, as if you were walking in an offline store. Navigation through the assortment should be logical and intuitive.

Дизайн-концепт: Дизайн-концепт: Проектирование интерфейса интернет-магазина продуктов питания


Profile and My Orders

Added reminders to the "My Orders" sections and to the successful payment page. Simplified navigation, added quick access to the order from the successful payment page.

Профиль и Мои заказы: Проектирование интерфейса интернет-магазина продуктов питания


Shopping Cart

The buyer can choose which products to buy now and which to leave in the cart for the next purchase.

Корзина товаров: Проектирование интерфейса интернет-магазина продуктов питания


Interface Adaptability

Created layouts for 3 screen resolutions. The mobile version has the same functionality, including additional product orders.

Адаптивность: Проектирование интерфейса интернет-магазина продуктов питания


Additional Product Orders

If you forgot something, simply add the missing items to the cart and click "Add to this order." We came up with a way to introduce additional orders without major modifications, without disrupting the user's familiar path.

Дозаказ продуктов: Проектирование интерфейса интернет-магазина продуктов питания


Business Logic

We communicate that you cannot add products that are already in the order. If there are 18+ products in the cart, we inform that they cannot be added.

Бизнес-логика: Проектирование интерфейса интернет-магазина продуктов питания


Design Project

Identical points of contrast to white/black for each set of colors allow the use of colors to define context (destructive, informational, etc.) without violating the minimum contrast.

Дизайн-проект: Проектирование интерфейса интернет-магазина продуктов питания


New Typography

We left the branded headers, but supplemented them with a more suitable typeface for content and UI elements. We chose Nunito Sans. It differs little from the branded font, but its wider range of styles allows for customization of small texts for easy reading/scanning with the eyes.

Новая типографика: Проектирование интерфейса интернет-магазина продуктов питания


Systematic Approach in Design

Layouts are assembled using autolayout. Dimension and color variables have been added.

Системный подход в дизайне: Проектирование интерфейса интернет-магазина продуктов питания


Homepage

There is nothing superfluous left on the main page. There is no need for additional modes and catalog filtering. The additional order block is displayed only if the buyer has current orders in "Waiting for Assembly" status.

Главная страница: Проектирование интерфейса интернет-магазина продуктов питания

As a result:

We removed the chaos from the project and completely rebuilt the color palette and components. No one will get confused: which margin or color to use - all the rules are already inside the design system, and using variables will eliminate a significant part of manual settings.

More cases:

Frequently Asked Questions

Need design. What is required from me?

Send the existing requirements by email or Telegram. We will study the information and let you know if we can help.

Need design. What is required from me?

Send the existing requirements by email or Telegram. We will study the information and let you know if we can help.

Need design. What is required from me?

Send the existing requirements by email or Telegram. We will study the information and let you know if we can help.

How much does it cost?

Studio rate 2500 rubles per hour. Team cost 600 thousand rubles per month. The duration depends on the project scope. The cost includes prototype, UI-kit, color palettes, typography, layouts in Figma for 3-5 resolutions.

How much does it cost?

Studio rate 2500 rubles per hour. Team cost 600 thousand rubles per month. The duration depends on the project scope. The cost includes prototype, UI-kit, color palettes, typography, layouts in Figma for 3-5 resolutions.

How much does it cost?

Studio rate 2500 rubles per hour. Team cost 600 thousand rubles per month. The duration depends on the project scope. The cost includes prototype, UI-kit, color palettes, typography, layouts in Figma for 3-5 resolutions.

How much time is needed for design?

For large projects it usually takes 2 months. For small tasks - estimation is usually a few days.

How much time is needed for design?

For large projects it usually takes 2 months. For small tasks - estimation is usually a few days.

How much time is needed for design?

For large projects it usually takes 2 months. For small tasks - estimation is usually a few days.

Where to start?

Compose a list of user roles, a list of required functionality, and a list of website and personal account sections. This is sufficient for evaluation.

Where to start?

Compose a list of user roles, a list of required functionality, and a list of website and personal account sections. This is sufficient for evaluation.

Where to start?

Compose a list of user roles, a list of required functionality, and a list of website and personal account sections. This is sufficient for evaluation.

Wadline Logo

In the top 10 design studios according to Wadline

Ratingruneta Logo

In the top 10 corporate solutions developers according to Ratingruneta

Ratingruneta Logo

No. 2 among agencies for support and development in the opinion of Ratingruneta

Accredited IT company AO-20220418-4218209153-3

Open to interesting projects

Describe the task informally to estimate the amount of work. Write, we will be glad to be useful.

Open to interesting projects

Describe the task informally to estimate the amount of work. Write, we will be glad to be useful.

Open to interesting projects

Describe the task informally to estimate the amount of work. Write, we will be glad to be useful.

SPAR
Biocad
Senior Group
Moscow Digital School
TRNR

and more than 25 companies have ordered interface design from us

and more than 25 companies have ordered interface design from us