Yon-Ka Case Study
Yon-Ka is a well-known manufacturer of beauty products, and the main focus of which is the production of cosmetics based on natural ingredients, herbs, and plants. The product line of this brand is extensive and includes cosmetics for face, body, sun care products, as well as an exclusive line of cosmetics for men.
Clients goal
We were glad that such a well-known cosmetic brand turned to us for our technical expertise. The task that the customer set for us was to transfer the online store’s functionality from Magento 1 to Magento 2 and to carry out a small redesign with the addition of several features that Magento 1 could not support.
Our approach
The main condition that was set before us is the preservation of the visual style of the website, which clients associate with ease and tenderness. And in order to keep this vibe, we worked closely with the customer in order to fully understand the vision of the future product. The biggest part of the work was creating a Progressive Web App (PWA) solution for the client.
CORE PLATFORM Magento 2
Result
TRANSFORMATION IN PWA
The transformation of the website into a Progressive Web App allowed the store to get some of the features of native applications and also provide a smoother user experience on the screens of any device.
go to site
REDESIGNED HOMEPAGE
We decided to combine large images of beauty products and ingredients together with the overall light tones of the site for an eye-catching design. We have also put the main values of the brand and its achievements in numbers.
go to site
REPLACED MENU SECTION
The client asked us to move the main menu, hiding it behind a button. The menu itself became sliding after a click on the button. Besides that, we have highlighted the main and secondary sections of the website with fonts and their sizes. Each section has a drop-down list with product categories.
go to site
REWORKED PRODUCT SECTIONS
For an easier search for products, we decided to mark up images with short descriptions of each type of product, depending on the selected section. In addition, below we have placed filters that help you find a specific type of cosmetics to deal with specific skin problems, as well as a choice by skin type.
go to site
REMADE PRODUCT PAGE
We've redesigned the product page by placing a photo in the center of the page and a description of the product on the left. In addition, we added a section with instructions for using a specific product, as well as additional cosmetics recommended for this product for complete skincare.
go to siteFeatures
01 Search bar
This feature was one of the most unusual options for everyone's familiar functionality. When clicking on the bar, a large white canvas appears where the customer can enter a request. Depending on the request, photos with product descriptions will appear on the canvas, which greatly simplifies the search for the necessary cosmetics.
02 Spa locator
The company also owns various spa salons, and for a more convenient search, we have implemented a spa locator connected to Google maps. We also made several filters where the customer can select a specific country or current location. All spa salons are displayed on the map using descriptive labels. In addition, the customer also has access to the exact address, phone number and can view information on how to get to the spa.
03 Skincare page
We've reworked this section to make it more intuitively pullable. We have made several blocks where the main methods of skincare are indicated with brief explanations. We have provided each block with “Get Started” buttons that take the customer to a page with relevant cosmetic products for a particular skincare method.
How our expertise helped the business
Work on migrating the store to a new platform and redesigning some elements went like clockwork. We measured the website’s performance, and the client was amazed at how much faster the website started to work. Besides that, the move to the new Magento 2 platform made it possible to turn the website into a PWA, which significantly increased the usability of the whole store on mobile devices. In addition, customer metrics showed an increase in sales of certain product lines, to which customers came from the skincare page. And the final benefit was the increased number of visitors to spa salons, thanks to an intuitive search and accessible contact information for each spa. The client was extremely pleased with the entire redesign and improved performance of the website.
Development stages
Business discovery, Magento Development, website pages development, web engineering, testing, release
Tech stack
PHP, MySQL, JavaScript, CSS, AJAX
Platform
Magento 2
Development team
1 project manager, 1 DevOps, 1 QA engineer, 3 Magento developers,
Time
5 months
