Instashop Website


This is a personal project where I wanted to create an online grocery store as the market for online grocery shopping is increasing. But before we build an online store, we really need to understand the problem space of online shopping a bit better and to build some empathy with the customers to really create a good product - and find out what really drives customers to shop online.


My role as the UX designer is to empathise with users to see what their online and offline shopping habits and preferences are. We need to understand if users are actually receptive to doing their grocery shopping online in the first place. What makes them choose one particular retailer over another, empathise with their pain points and discover what kind of people will actually make the effort or even have no choice but to do online grocery shopping.

01 Research

I conducted a survey, interviews, secondary research and competitive analysis of features offered by online grocery stores. Results of all the research showed that only a certain demographic of people are open to doing online grocery shopping due to their pressing schedules such as full time mothers and busy professionals. The type of items which users were most likely to buy include heavy household items and non-consumables. And factors which persuaded users to choose certain retailers over others included free delivery incentives, good service, brands and easy to navigate website.


I created a persona to represent a full time stay at home mum who didn't have time to go grocery shopping due to her child card commitments. I explored the pain points of this persona when it comes to online grocery shopping so I could use it for creating the wireframes.

02 Strategy

After the results of my research, I created the information architecture which I analysed to come up with the wireframes in the next stage. The strategy for Instashop is made up of a userflow, sitemap, business goal analysis and card sorting.

03 Design

I created wireframes based on my research findings which is to focus on making the interface as easy to navigate as possible. I wanted to make use of carousel banners which can be used to make users stay lingering on a website longer and clear call-to-actions.

04 Testing

I did heat map testing and preference testing before conducting further tests on the Invision prototype built from wireframes. Only after this stage did I start to build high-fidelity screens based on the results of the testing.