top of page
![](https://static.wixstatic.com/media/136390_357fe4ee09ad4c57a5a2e9acc4198c78~mv2.jpg/v1/fill/w_288,h_162,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_auto/136390_357fe4ee09ad4c57a5a2e9acc4198c78~mv2.jpg)
![deneiyi.jpg](https://static.wixstatic.com/media/136390_1b945195af914c23bcfe63452108c41c~mv2.jpg/v1/fill/w_487,h_476,al_c,q_80,usm_0.66_1.00_0.01,enc_auto/deneiyi.jpg)
1. Project Overview
deneiyi
Design an e-commerce website for a store selling lingerie
![figma.png](https://static.wixstatic.com/media/136390_ff6f5279ee5b4846864c689d17d51fb7~mv2.png/v1/fill/w_32,h_32,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/figma.png)
![image 37.png](https://static.wixstatic.com/media/136390_ce8d031bb7194839bbddf3abb3800793~mv2.png/v1/fill/w_32,h_32,al_c,q_85,usm_0.66_1.00_0.01,enc_auto/image%2037.png)
deneiyi
Design app and website for a store selling lingerie. They want to build a platform to attract and retain customers. The website pages should be aesthetically pleasing, intuitive to use.
They hope that the website will be a delicate and simple design, and which is pleasing to use.
Project
- Responsive e-commerce website
Tools
- Figma and Maze
Duration
- About 56 hours
2. Design process
Step 1: Assumptions
deneiyi & products
Target audience
Requirements
Main competitors
- Deneiyi is a store selling lingerie with a simple and attractive design.
- Focus on women between the ages of 22 and 35 who prefer simple, comfortable products but still sexy with quality materials
- Variation products
- Simple purchase process
- The search box displays full information (name + image + price) about related products.
- Focus on mobile interface
- Set of sticky icons for social networking and contact on mobile interface
![image 116.png](https://static.wixstatic.com/media/136390_8cfce02d6c314a4994e6b1fc001ee029~mv2.png/v1/fill/w_172,h_50,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/image%20116.png)
![image 113.png](https://static.wixstatic.com/media/136390_5725d10c200b4d158aa0b7fc22b50869~mv2.png/v1/fill/w_172,h_50,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/image%20113.png)
![Group 34.png](https://static.wixstatic.com/media/136390_8d1309d15dcc4397a85dca833c23e2b0~mv2.png/v1/fill/w_172,h_50,al_c,q_85,usm_0.66_1.00_0.01,blur_3,enc_auto/Group%2034.png)
Step 2: Wireframe Sketches
I started sketching different versions and capturing my ideas by pen and paper quickly. Then I sketch carefully in my final version which it enables me to examine my ideas before putting everything in the daunting process of digitizing.
- Because this website focus on the mobile interface, so I started all of my design mobile-first.
![Group 36.png](https://static.wixstatic.com/media/136390_dcfcc6a0b5f94e27953a1be5db098680~mv2.png/v1/fill/w_74,h_50,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Group%2036.png)
Step 3: Low-Fi and Responsive Wireframes
Once I decided the visual direction of the layout I want to go for, I started to produce a digitized, low-fi version of wireframes based on sketches. Responsive wireframes are created for mobile.
![Group 28.png](https://static.wixstatic.com/media/136390_6c13948a8c3349118fe1de358ad7e7ff~mv2.png/v1/fill/w_60,h_73,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Group%2028.png)
Step 3: Mockup & Hi-fi Prototype
Final mockup for lingerie website. Responsive mockups are created for mobile & desktop.
Mobile interface design
![Group 215.png](https://static.wixstatic.com/media/136390_05d05747e91d41d1a87fa806b64b9914~mv2.png/v1/fill/w_60,h_58,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Group%20215.png)
Desktop interface design
![Group 213.png](https://static.wixstatic.com/media/136390_be12ac550efb4cb3b63158bdc4bf51a6~mv2.png/v1/fill/w_60,h_55,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Group%20213.png)
Step 4: Survey design on Maze
Finally, I make a survey for this project to receive feedback and improve the website. I will pursue more usability testing on the updated and enhanced features of the prototype.
![Group 216.png](https://static.wixstatic.com/media/136390_0f5b65db622541968e309a55f8b9d611~mv2.png/v1/fill/w_60,h_28,al_c,q_85,usm_0.66_1.00_0.01,blur_2,enc_auto/Group%20216.png)
bottom of page