The all-new Reliance Digital — App redesign — A UX/UI case study (MVP).
Disclaimer —
This is a personal project. I was not in a contract or commissioned by Reliance Digital to redesign their mobile app.
About Reliance Digital App —
The Reliance Digital App helps you discover and shop for electronics and accessories from anywhere, allowing you to search from a collection of thousands of products, across international and national brands.
Why this redesign?
I was personally not impressed with the User Interface and the User Experience of the app. The core architecture of the app could be strong but, in comparison with today’s apps in the Online eCommerce sector, but a lot has to be changed to improve the UI and UX for this app. So, for this Reliance Digital application as it stands as an eCommerce application users visit the app to buy products they need, but looking at the current UI one can easily get lost where to look for the right product as shown in the figure (Left Figure), because of which users may have second thoughts. I am more into minimalism, I always like to simplify the steps for the user to reach his/her goal.
Why did I choose Reliance Digital Application for the redesign?
With the reasons mentioned above —
I’m slowly trying to make a move towards product design. For the same I am going through several blogs, social media networking with many professional designers, reading, analyzing, and mimicking their styles.
One of my learnings here is —
Pick an app/website for which you think you would be an apt user. That way, you can think in terms of the user and make good design decisions. (Chethan KVS).
And also from my personal experience where recently I bought a washing machine, which I will be using as a scenario to design the application.
Let's start —
Here I’ll talk about my research wireframes and sketches. This is my first attempt in writing medium blogs and first steps towards Product Designing, also I am not an expert in copywriting so for all the experts out there please bear with the mistakes I made and reach out to me for suggestions and feedbacks. Thanks.
Wireframes —
Research Conducted —
From the above research conducted it is clear that we need to guide this 91% of users to their desired product.
Typography & Color —
Final Design
I would highly recommend to take it a little slow from here so as to really understand the design changes I have made. Appreciate your valuable time.
Onboarding Screens —
The existing application did not have any onboarding screens so I introduced onboarding screens so as to inform users of the services and features that are made available to them.
User Registration Screen—
Users can register using Google & Facebook or can create a new account if they want to.
Homescreen —
For homepage most importantly added some whitespace, some space to breathe, I found the existing homepage was cluttered, had too much information and it was difficult to understand what to do next or where to go next.
So with my redesigned homepage, as said earlier introduced whitespace, moved the cart button to where it was easily accessible, removed the bottom navigation as it was hardly getting noticed/used and I changed the location of the bottom navigation links to the top right corner menu (Figure ahead).
Empty cart and Menu Screens—
On clicking the cart button, initially, the cart will be empty and so it is necessary to guide the user to add new products to the cart, this is exactly why empty states are necessary.
Category Screen—
Scrolling down from the homepage will display categories. I decided to add images to represent the categories more visually.
I did the same with the sub-categories page. In my opinion, it becomes more clear to the user when text is represented with an image.
Filters—
Rearranged the filters, added some whitespace(again), also notice I have added Mode as a filter where user can select between fully automatic and semi-automatic.
When show results are clicked without any filters selected, it’ll display a message (figure below) and on all filters applied (see figure below).
Filtered products —
Notice the green box message, where I have kind of informed the user why the particular category was a great choice. This is optional but I found it useful so that the user feels he/she has made the right decision.
Product page —
Place an order, order confirm —
And that’s a wrap.
Now I know there are some changes that you guys might be thinking of, but I designed this as a Minimum Viable Product (more about this here) so that I can understand how users use the product and what are the necessary changes I need to make based on the information gathered.
Again I thank you for your valuable time, I hope you guys found it useful, and if so please give it a clap!
Find me here —
