mPAANI
I wanted to do a UX audit for mPaani a startup in India, now known as LoveLocal
Service
Identity & Branding
Client
mPaani
Duration
1 Week
Year
2017

THE CHALLENGE
Download and browse the “m.Panni Shop Smart App” from Android Playstore.
Browse all the features in the app. Your challenge is to assess and recommend UX design changes for B2C products.
Also attach a few design samples to communicate you vision for the product.
01. HOW I STARTED
This strategy defines the key principles and considerations- i.e. the important things to think about - when assessing Smartphone apps, in order to identify what and how to improve the user experience, optimize conversion, and better measure app performance.
In the small span of time I am not able to touch on the every
aspects of the strategy.
I have done few parts of adoption & usage to review the experience.
02. UX AUDIT
I have to download the application and keep its review based on the mobile app user journey
ONBOARDING SCREEN



UX Review
-
Tips/help or an onboarding sequence should only be employed if necessary - so as not to interrupt users - but when used appropriately they can guide the user in their initial experience and adoption.
-
If onboarding is used, the user can choose to skip it (put the user in control) users should be able to skip the onboarding sequence if they wish not to be interrupted by it or do not perceive a benefit in swiping through it. Put the user in control of their time and initial experience of the app.
Improvisations
-
Instead of giving info about the results try to give them information about how the system works and what they are able to do with the application.
-
It is good to give user control, the use of skip will be appreciated
LOGIN SCREEN


UX Review
-
If app sign-up is mandatory, the user can choose to demo it first (the user is in control) Users should be able to choose to ignore registration and continue as a guest, where they can sample and assess its value to them, before committing to register. This is even more important for apps from unknown brands or apps that provide engaging content and which are dependent on users experiencing them before they can make a registration decision. Always put the user in control of their time and initial experience of the app.
Improvisations
-
Use of “Take a experience/Try now” will be appreciated.
HOME SCREEN



UX Review
-
An app homescreen should provide the user with journey(s) andfunctionality to complete their priority tasks, and provide content that meets their needs and expectations. Navigation should be clear, task-oriented, logical (e.g. screen controls suggest how to use it), and navigation location (e.g. menu bar) consistent throughout. Only primary navigation and content should be visible by default, with secondary content hidden - but available via tap or swipe - off-screen.
-
Brand logos are used subtly and sparingly (app screen space is limited) Apps are not sites, and they do NOT need a brand logo on every screen that link to the home screen. App screen space is limited. And, users’ have already made the effort to download - so they know your brand - and use your app, so reinforce your brand identity subtly, i.e. instead of your full brand name, use an icon, or a colour; and apply it sparingly, i.e. only on splash screen and home screen.
-
App purpose and priority user journeys are clear. For users who’ve make the effort to download your app, you now need to satisfy their expectation of what your brand and proposition will deliver, i.e. by communicating the priority user journeys and need states that your target customers will want to act on.
Improvisations
-
Please provide the tasks according to the priority which is important for user to complete and the tasks due to which the user has downloaded the application.
-
Don’t make users scroll.
-
Use of logo is required it gives brand essence to the product and saves the real esatate.
-
Interactions sholud be crystal clear and well defined, it should not be repetetive i.e. from three different buttons from the same screen user should not be directed to same screen.
HOME SCREEN



UX Review
-
Reasons to buy / book are clear (to encourage usage and conversion) This applies to all brands, whether they are unknown or renowned. Unknown brands need to give users reasons to adopt them and their new proposition, whereas well-known brands need to create position themselves and differentiate from the competition. Reasons to believe could be related to things such as price, discounts, features, fulfillment, customer service, luxury, heritage, etc
-
Only primary content and functionality is on-screen by default (all secondary things are off-screen and available from a menu) Users should not be presented with an app that replicates the brand's mobile site, nor contains too much content and functionality on-screen by default. Apps should be clear and journeys / tasks obvious, and so the brand should have prioritised the primary functionality and content, and put all else off-screen, e.g. accessible with a swipe from a menu, above, aside or below the screen.
Improvisations
-
Use of the hero product/offers on the top of the screens would be appreciated and will increase the conversion rate.
HOME SCREEN



UX Review
-
Long app screens don’t have dead-ends(e.g. so the user continues to discover and explore) If your app has long screens of content, make sure that when users reach the footer of the screen they can continue to discover and explore, and don’t encounter dead-ends that cause them to abandon the app.
-
Users can swipe horizontally to quickly navigate laterally Good mobile app design enables users to quickly swipe to navigate laterally to the next screen, instead of being forced to hierarchically navigate -pogo - up and down.
Improvisations
-
Use of back to top button will be appreciated and it will avoid repetitive scrolls.
HOME SCREEN



UX Review
-
The focus at this stage is to enable people to use your app in the way that they intend to. An excellent search facility will help users find what they want quickly and easily, in order to satisfy their needs and drive conversion. In our experience, app search has a far higher conversion rate than non-search app usage, reflecting the higher intent of the shopper. There are a number of ways to enable search, from keyword to product scanning and image search.
-
Recent searches are displayed (to accelerate their experience) Apps should store all interactions, including recent searches, in order to provide this data to the user the next time they conduct a search. It benefits the user by saving them time and effort in searching for the same item again and improves the user experience. This is especially important for travel apps, where users often repeat the same searches and would benefit greatly.
Improvisations
-
Introducing universal search will be nice and help user to use the app according their need.
-
In the search, recent searches should be reflected.
ONBOARDING SCREEN


UX Review
-
User can easily filter search results Provide the user with filtering options that are relevant for their search, and enable them to select / de-select multiple options each time they apply the filter to the results.
-
Hero product image is above the fold (to merchandise your priority offerings) Don’t make users scroll in order to see the hero image for a product (i.e. the first and main image). There may be additional images below that users can scroll to view.
-
The first few search results are highly relevant (mobile real estate is limited!) With Smartphone screens being so limited in the number of results they can display without the need for scrolling, ensure the user sees a set of - e.g. 3 to 5 - highly relevant results by default; and only after that do they need to scroll
Improvisations
-
Search results with filter options will taken in consideration any user as it give them the required result and save their time.
-
Search result should include the hero product on the top.
-
In search suggestion should be relevant and if no relevant suggestion are there don’t suggest dead ends.
03. UX WIREFRAMES
Create a smart shopping experience which wil be helpful to fulfill their daily needs with customer loyalty program
Design Process
1. To understand the brief.
2. To understand the user and business needs.
3. * User Research
4. * Live Interview & Ethanography
5. Empathy Mapping
6. Analytics & Heuristic.
7. * Competitive Analysis
8. * Insight Generation
9. * Persona Generation.
10. User Story & Journey .
11. Mental Model & IA.
12. Paper mockups & Wireframing.
13. * A/B Testing
14. * High-Fidelity Visual Design
15. * Accessibilty & Usability Testing.
16. * Feedback Interaction
17. * Release
Note : * points are not taken in consideration
Onboarding

-
Educating users about the tasks they can perform and the benefits what they will get from the application
-
User in control: They can choose to skip if they are not interested in onboarding.
-
Clear and direct message to user what are the next step they have to take, i.e. Login/Skip
Login

-
The essence of the brand: Usage of logo and to tell them what this product is about
-
User in control: Providing users to try the product first and then let them decide.
Home Screen

-
Flip-card: For users to quickly get the information about the stores without leaving the home screen.
-
Flip-card - On tapping this button card will be flipped and will show the quick bytes of the store.
-
Locate the store easily and get directions upfront and in one touch.
-
Making the Floating button consistent in all tabs and contextual.
-
Moving my profile inside the hamburger menu as it once in a while accessible item.
-
Introducing universal search.
-
Informing users about the store, i.e. offers, distance, and last activity upfront and in a clear manner.
Home Screen : Floating Button

-
Making floating button contextual: Users can access help and related info from every tab with a single click
-
Making floating buttons consistent in every tab.
-
Use of iconography to reduce the cognitive load of users.
Universal Search



-
Universal Search: Helping users to get their intended at their fingertips.
-
Categorization of the search result with help of iconography for users to easily identify their results.
-
Providing a filter option for a search result in a floating button gives users an easy option to perform their tasks.
-
Providing only relevant suggestions to users.
-
Providing the results for recent searches so that user can easily perform their search
-
Filters for search results
Three Dot Menu

-
Three dot menu to provide users with essential things at their fingertips.
-
Introducing My Cart: Ease for the user who wants home delivery & to easy access to the cart.
-
Introducing points: Users can easily check their points and learn how to earn more points.
Menu

-
User can easily check their mPoints upfront in the menu.
-
Easy way of changing the profile picture just by tapping on it
-
Single screen menu: Now users don't have to scroll in the menu to see the items.
04. VISUAL DESIGN
Once my wireframes are matured enough I jumped into Visual Design conceptualization
05. CONCLUSION
Once my wireframes are matured enough I jumped into Visual Design conceptualization

























