My role: Concepting, Wireframing, Prototyping, & UI Design
Team: Ana Urena (Art Director),  Dan Ramirez (UX Designer), and the development team
Tools: Adobe Photoshop, Illustrator, and, Invision
Duration: 6 months
Background
FactoryOutletStore is a consumer electronics retail website dedicated to top brand-name manufacturers and specializes in the categories of GPS, home/office phones, personal care, pet products, etc. Majority of its customers are older male age 40 and above. 

Problems & Challenge 
FactoryOutletStore has excellent conversion rate on desktop. However the performance on mobile is not doing well. One of the problem is that the site is not optimized for mobile devices. Another problem is that the visual design of the website looks outdated. The challenge of this project is that the majority of their customers are old and not tech-savvy, so making changes on the website might be risky. There are also constraints on the budgets and IT that we also have to take into consideration when creating design for the mobile site. ​​​​​​​
Goals
1) Create a user-friendly mobile site that is suitable for the main customers (40+ years old men).
2) Increase engagement rate on mobile site.
3) Design better UI while maintaining the overall visual identity of FactoryOutStory
Process
Our team attended Google Mobile Workshop to get an overview and analysis of what are the most important problems that we need to tackle and what we need to improve on. We found that there are many problems that we need to address.
1) Unclear Call-to-Action
2) A long list of menus that are not suitable for mobile visitors to navigate.
3) The website does not have filters which makes it hard for users to narrow their search.
4) Our form field is too complex and difficult for users to input information on mobile phone.
5) The speed of loading the website is lower than average.
Solutions
Since we already have a pretty solid understanding of our customers, we did not spend too much time on user research. Instead, we designed our mobile website based on the existing design and data. Because of the lack of budget and resources, we referred to many successful e-commerce websites such as Amazon and Walmart and tried to learn the general best practices for e-commerce businesses. 

Results
After few months of designing and developing, we did an A/B test on the original website and few versions of the new mobile sites. We adjusted and changed our design based on the result of analytics. The mobile engaging rate has increased by and the sales from mobile websites have increased incrementally.  

Takeaway & Next
It is important to understand who are the users and design something that is suitable for them instead of following the design trends. We continue to reiterate and optimize our mobile design by implementing best practices and using technology that decreases the time of loading the webpages.

Click Here to view our prototype and visit their mobile site on a mobile phone.

You may also like

Back to Top