- Mobile App
- Made for
- The Body Shop
- November - Desember 2020
Feed your skin with nourishing ingredients
We created design of E - commerce store application for cosmetics shops of all types natural cosmetic lines of The Body Shop brand. Where people can buy and collect the natural cosmetics. Mobile app is perfectly suitable for natural beauty store, perfumes and etc.Created with Figma
© 2021 SnapTec · All rights reserved
Our products are made with natural extracts
The Body Shop is an original, natural and ethical beauty brand. The Body Shop's wide range of products includes body, face and make-up cosmetics, including vegetarian and vegan products.
The Body Shop is looking for unique and natural ingredients for cosmetics in every corner of the world, while trying to use natural resources wisely.
Our desire to enrich, not use the environment as never. for us, this means enrichment of both society and the planet.
The Body Shop is the first beauty company to introduce the principles of fair trade in the beauty industry.
Raise awareness of organic skin care products
How can we inform people about the benefits of using organic skin care products over their conventional counterparts?
Our task in this project was to raise awareness of organic skin care products and their benefits and create an online platform that will provide people with these products.
We wanted to create a product to raise awareness of the overall brand. Get more traffic to sell more onlin.#Challange
- Understand users buying behavior when buying natural cosmetics and their reasons for shopping, expectations and problems;
- To inform people about the benefits of using organic skin care products;
- Create a user-friendly and easy-to-use mobile application;
- To raise awareness of the overall brand.
It was user - centered design process, focused on the users and their needs in each phase of the design process. In the process we involved the users throughout with variety of research and design techniques, so that we can make an really useful and usable product for them.
In the first phase of the project, we focused on research, user flows, mapping the information architecture, and creating wireframes.
After wireframes were initially tested by users, we proceeded to UI creation of high-fidelity mockups. With a solid basis of UX findings, the visual part of the app was designed, including interactions.
In the final stage, we created a comprehensive style guide with a basic description for the development process.
User pain points
Low fidelity wireframes
High fidelity wireframes
Research helps to define the challenges and goals
The goal of the research phase was to gather crucial insights about natural cosmetic market as well as understand the perspective of the end - users - store customers.
We explored the topic using desk research, competitive analysis and user surveys, which led us to formulate a set of recommendations for features and build user flows.
Saudi Arabia is a leading market for cosmetics and personal care products worldwide. Growing self-awareness of one's appearance, ability to spend more, as well as increasing middle-aged population and growing demand for men's care products are stimulating the growth of the cosmetics and personal care industry.
The Saudi Arabia pharmaceutical drugs market is to be valued at
Expected to exhibit a CAGR of 10.9% over 2021-2027.
63% of cosmetics consumers are loyal to brands that remember their shopping habits and customize their online experience accordingly
- Saudi Arabia is one of the leading markets for cosmetics and perfumes in the Middle East. The market is developing and making a significant contribution to the economy of country;
- The growing demand for natural / organic, herbal, halal products and innovative and environmentally friendly packaging designs explain the growth of the market in the country;
- Facial care products have dominated the skin care market;
- Dermocosmetic products are becoming increasingly popular in the market, as they provide both decoration and proper skin care;
- Jeddah and Riyadh are two cities that make up the bulk of the young population, indicating larger consumption patterns in the cosmetics and fragrances market;
- In Saudi Arabia, strong Internet penetration has greatly contributed to raising consumer awareness of cosmetics and cosmetics. Social media plays a very important role in shaping people's opinions and attracting their attention and awareness to any brand;
- Specialized retailers are better known in the country, as customers like to check the product themselves before buying. The online segment is growing at an impressive rate due to the ease of access and greater availability of products.
The increase in the number of organic brands is due to consumers who are increasingly aware of what is included in the production of the products they use and what is the long-term impact on their overall well-being. Therefore, we conducted research to analyze the needs and pain points of consumers.
When shopping for cosmetics on the Internet, look for honest reviews of products in the Internet, and also watch videos on YouTube where someone tries this product.
When shopping online, I can't rub the products with my hands to check the color and feel, I can't talk directly to the seller to ask questions.
I don't often change brands of skin care products when found one that suits my skin type well.
Create user-friendly online store of organic skin care products
After conducting the initial research of these pain points, our goal is to create e -commerce online store app that mimics a similar experience as shopping in store.Projects goals
Creating online store that mimics a similar experience as shopping of products in -store while providing solution to solve the pain points in order to drive frafic to the app.Users goals
- Be able to quickly find and easily buy necessary quality skincare product online;
- Easy and simple mobile app to place orders;
- Provide an intuitive jorney with easy steps from start to finish;
- Get discounts and free shipping of products.
- To increase sales and revenue by reaching more customers;
- To use internet as platform spread awareness of good results of using organic skincare products;
- To satisfy customers by providing premium quality products and recommendation for customer retention;
- Reach the targeted customers and increase the customer base.
What do you expect to get from the mobile app?
It is also important to note the expectations of users from the design and structure of the mobile app. And give some explanation of their opinion.
- App is beautifully decorated, there are large images of high-resolution products and user can check the product;
- It is easy to understand exactly how to find the right, clear product categories, easy to find info about the necessary products;
- Noisy and distracting design, non-professional UX - design, too many pop-ups, too much marketing should be avoided.
- Easy navigation and checking, perfect speed of downloading, good filtering and sorting;
- Useful products categories, filters, perfect visualisation of search field and easy checkout process.
- The user should feel comfortable on the pages;
- Should to avoid situations with excessive requests for information, simple and clear pricing;
- Advice and tutorials on how to use the product, clear description of the product, reviews of customers, more images and visuals of the products .
User Personas are your Target Audience for whom we are making the Product so in the Research phase. I also created Persons to Create a Better Experience for user.
Age: 26 - 30 years
Djamila is a 26-year-old woman who works as a marketer in Riyadh. This is a beautiful young woman with a kind and hardworking character. She reads many articles on skin care, watches videos on YouTube, where she learns about skin care products. She has started using natural products and considers them very safe and effective. She likes to take care of her face skin every evening.
Skincare product categories are interested for Djamila:
- cleansers & toners;
- eye care products;
- face masks;
- scrubs & exfoliators.Needs
- To be a beautiful women;
- Easily find and buy original a high - quality natural skincare product onlin for a good price.
- Easily and understandable mobile app to find necessary products and informations about them, to place orders.
- To get discounts and offers or free shipping when purchase is above some specific amount;
- Honest reviews from other users. She follows skincare specalists and reads their articles;
- Ability to get her questions answered fast.
- Absent or slow customer support in online shops;
- Not being able to find the needed information immediately;
- Gets confused when someone says organic products are not effective;
- Panic of not using right product to skin.
Since the development of User Persona, Empathy Mapping has been very helpful in identifying the gaps between users' needs and the current solution they have experienced.
The empathy map helped to get a deeper idea of our users by putting us in their place. See things from their point of view and better understand the problem.
Information architecture was created to organize and label the content to be easily understood by users and ensure it's usability and findability.
Simple Sign In & Sign Up process
I made the registration and login part very easy for users. Users can create an account on Google, Facebook, Apple. Enabling using Gmail or Facebook login can be easier for user since they do not nee to do through all the steps of account creation. The verification process is provided by phone number. This is the easiest and fastest way to purchase goods.
The Home page is moved immediately when the user sign in successfully. Here the user can get all the important information.
1.Search bar. Allows users to make the specific selections based on their requirement.
2.Main advertising banner.This is the perfect way to visualization Ad promotions.
3.Best Sellers. Scrollable list of the most popular beauty products that correspond to the category.
4.Scrollabel List of Category banners. Allows users to select the specific type of product based on their requirement.
5.Subcategory banners. Element that are used as a link to the product subcategory page.
6.Scrollable List of Products. List of the newest beauty products that correspond to the category.
7.Products item. The component consists of important elements: labels of promotional offers, the icon of adding to the wish list, the product name and the brand name.
The autocomplete features was used to the text input (enhanced by a panel of suggested options). May suggest similar or previous searches to save the user time.
The user can easily search for the cosmetic product by name. This program also allows you to find products by category, offer, saggesins. Also offers you popular products through your order and search results.
For the user's convenience, products are separated into many categories. The most popular sections are at the top, and the less popular ones are at the bottom.
Customers can navigate into the catalog through the types of products and using the search. Depends on how and what they are looking for. And they can easily filter out what they need inside the catalog.
Product card displays detailed information about the product. The easy ”add to cart” option gives user to buy their desired product in desired quantity.
1. App bar:top. Tap on the back button to go back to the Category page.
2. Customer reviews. After purchasing this good, the customer has the opportunity to write his own review.
3. App to Wishlist. Allows users to save their products which they like and want to buy in future in folder named Wishlist.
4. Product Picture. Provides several images to view the product details.
5. Available sizes. Apply preference from the available sizes.
6. Product description. Product cart displays detailed information about the product.
7. Related Products. Shows products that are most often bought together. This will allow user to check out the similar products as option.
8. Add to cart. Add items to cart to include in purchase.
Cart & Checkout Pages
The "Add to Cart" button allows users to add any desired product to the cart at any time. User can easily check the cart list, can manage the quantity, get coupon and get informed about order processing. User can also remove an item from the list.
During the checkout process, the customer follows a series of steps to purchase the items in their shopping cart. This includes shipping details, payment options.
With thoughts on our customers
An application turning shopping process into simple end-to-end experience of buying the best natural products shopping with the least possible time and effort