InstaShop
Instashop is an online grocery delivery service aiming to make online grocery shopping convenient and easy for its users.
The Design Challenge of Instashop
Hypothetically speaking, I was approached by an investor who believes that there is a big market out there for online grocery shopping. The current working title for the project is ‘Instashop’. I manage to convince her that it would be best to understand the problem space a little better, to build some empathy with the customers and find out what really drives them to online shopping.
User Research
The client provided rough details of the end users that they wanted to target initially. The collective demographics were coined as “The busy professional” – Individuals aged 20 to 50 and who work in offices fulltime.
Using this approximation, I conducted interviews with shoppers to gain a better understanding of their needs and pain points as shoppers.
Personas
Based on the the qualitative and quantitative findings in my interviews, I created a realistic representation of my key audience segment. The goal here was not to represent every possible audience member but rather to address the major needs of the most important user group.
Empathy map
Although typically a group exercise for the team, I decided to create an empathy map to help organise my research into a human-centered view of the product, and evaluate the ideas I would be coming up with for Instashop.
Business goals
After conducting several user interviews to gain a better understanding of users’ needs, I began evaluating both business and user goals.
It’s important that while we are focusing on creating a good experience for the end users, we are also setting out to fulfil the business’s objectives to generate a return on investments for the business.
Card sorting and sitemap
To ensure that the site’s structure and the way that items have been categorised matches our users’ mental models most efficiently, I conducted a series of card sorting exercises in-person with participants who represented the target audience. The results from the card sorts were then translated into a detailed site map.
User flows
We used the sitemap to see how users would complete essential tasks, and mapped these tasks out with user flows to identify any opportunity for additional streamlining of task completion.
Wireframes
Once I hashed out the overall structure and navigation patterns of the site, I drew up the product’s blueprints, or wireframes to illustrate the overall layout of the product interface, define the rules for displaying information and define the behaviour of its elements.
Low Fidelity Prototype
I used Invision to create a low fidelity prototype with which we could test user flows and then iterate the wireframes quickly and efficiently.
Feel free to try the prototype
Test Results
We tested the UI and user flows using Usability Hub and Verify to ensure that all of the most crucial user tasks were being completed with ease and that business goals were being facilitated as well.
One common observation from the initial prototype tests was that certain important elements and UI were hard to find or notice. At this stage, we assumed that this was due to the low fidelity of this prototype.
We decided that we would re-test the instances of this with the high fidelity versions at a later stage in the project, where we can utilise colour and other visual properties.
Summary
What I have found to be the most challenging part based on my research is that people have different definitions for the same object – Most still think of tomatoes as a vegetable – and it could be challenging to design a solution that caters to everyone.
I found that cross-referencing between the business and user goals has helped me to find a middle ground between both ends for my design decisions.
More case studies
Coming Soon
Amma
User Research Ideation Information Architecture Wireframing UI Design Prototyping User Testing Visual Design
Coming Soon
Glu Global
User Research Ideation Logo Design Brand Guidelines Corporate Literature UX Evaluation
