Background

This is a M-commerce project that combines flows of customizing products, template editing, online payment, checkout... which complete a unique mobile application experience. 

 
Users can make their own phone case through the following steps:

1. Choose a phone case design template

2. Edit the template into the style users like

3. Order the customized design product

I worked with different teams including the product managers, engineers, marketers, stakeholders to develop the solutions in order to bring the best experience to life. 

Challenges

People often encounter a difficulty to imagine when looking at a 2D design graphic and imagining how it could look like if it is a real product. With the belief that there has a better way to lower the barrier to entry for creating self-styled products, the solution was the creation of Qsire, an app to customize 3D phone case design with 2D rendering on mobile devices.

-

Solutions

In order to shorten the imagining gap between the own design on the mobile application and the real outcome product, I developed the system of "Layers" in the template editor, using different shades of color to show the height of each element and helps users to imagine the real outcome. 

-

 Outcomes - Style Guide

-

UI - Flow Maps

(Click on each flow map to expand the image)

-

App Demo

Download