Overview
In this 4 day sprint, our challenge was to improve Nini & Loli’s online presence and help them increase revenue. My team and I decided to redesign their mobile site and create a positive online experience for customers. The first thing we did was to go their store and talk to the owner and a few staff members.
Roles
User Researcher
UI Design
Interactive Design
Design Tools
Invision
Adobe Photoshop
Sketch
Miro
“I love Nini & Loli, but I only shop there in the store. ”
Secondary Research
New and expecting parents are 2.7x more likely than non-parents to use a smartphone as their primary device. The overall use of mobile devices as the primary search tool has grown steadily from 2007 to 2014 and is expected to increase. Furthermore, Mobile searches related to babies and parenting have grown 25% since 2013 (Google Consumer Surveys).Views of parenting videos on YouTube were up 329% on mobile devices this year. This data shows that the most convenient screen wins, regardless of size (Google Data).
User Research
My team and I conducted 14 interviews and sent out a survey that gathered 32 responses. We learned that the majority of users like to shop online in “one stop shop” websites; Amazon being everyone’s favorite. Clothes and more luxurious items were preferred as in store purchases because the quality of products presented online often didn’t match in person. Another common issue, was the inability to gauge how large or small some items were.
“When shopping online, I appreciate curation. Too much variety is overwhelming.”
Affinity Map
We utilized Affinity Mapping to organize our data. We wanted our design to focus on our target user(s); their habits, pain points, and goals. Our tribe consisted of busy professionals, ages 35 to 45, parenting infants and toddlers, who value quality and convenience. We also took into consideration gift givers, such as family and friends who may be seeking unique luxury items.
Top Pain Points
• Parents often don’t have time or energy for shopping
• There is uncertainty in size and quality for each product
• There is no transparency in shipping and pricing
• Customer service is difficult to find
Top Gains
• There are good product descriptions
• Parents like the convenience of online shopping
• Delivery helps save time
Our Affinity map was composed of all the information we had gathered from our quantitative and qualitative data. It allowed us to stack the common pains and gains and created a clearer picture of our user’s mental model.
User Persona
We gathered our information and from our data created a user persona to better understand our users’ mental model. Loving Linda is a working mother who doesn’t have the time to shop for her children. She shops on Amazon to buy all of her things but she wants to buy something special for her child’s upcoming birthday. She wants to buy something unique rather than the usual mass-produced items she gets online.
Linda represents the consistent need to save time as a busy parent. Parents are hard workers and are always looking for ways to alleviate stress. Saving energy and spending more time with their family or by themselves was the most common gain expressed in our surveys and interviews.
Our task analysis revealed that important information was very hidden. A user needed to make several clicks before arriving to their desired page.
Task Analysis
We noticed how feeling lost was common place when navigating the site. Sometimes clicking through several pages to find the information needed. The overall layout was overwhelming and had an uneasy flow. There was no call to action for customer service even within the customer care tab. Simplifying the entire site was required for a better user experience.
Heuristic Analysis
The main page would obscure content and information, making users scout for information usually readily available on competitors’ websites. There is no information about shipping or return policy. The price of an item wasn’t revealed immediately and was only available towards the end of purchase. Products lacked suggestive tasks and had zero reviews.
Nini & Loli’s site map needed a clean up to avoid the feeling of being lost. Finding information about products was unnecessarily challenging.
We reduced the steps a user must take in order to find details about the product they are interested in purchasing. We included shipping information and payment options which were previously missing.
User Flow
Our user flow consisted of fully completing an online purchase. Testers would have to search for their item, Select an option, complete check out and purchase the item.
Lean UX Canvas
We created a Lean UX Canvas to help us understand the current landscape of business and customer needs, and create a hypothesis to later validate.
Hypothesis
”We believe we can increase online sales from parents and family members looking to buy high end items by providing inspirational images of products.”
Value Preposition Canvas
Using a Value Proposition Canvas helped us refine Nini & Loli’s existing website and the services being offered. At the moment user needs such as transparent pricing, customer service and payment options were missing.
Competitive Feature Chart
Compared to its competitors, Nini & Loli’s had very few features on their website. Chat functionality, reviews and easy navigation were missing and by including them, user experience would increase. These features were necessary in order to compete with the online stores currently available.
Ideation
We brainstormed individually doing How Might We’s and then plugged in all our information in a mind map, connecting similar ideas together. We selected the highest priority ideas and ended up with three How Might We’s.
• How Might We Design a modern e-commerce platform for busy working parents that helps them efficiently navigate the mobile site to purchase baby items when they have minimal time and energy.
• How Might We Design a modern e-commerce platform for busy working parents that helps them obtain merchandise which matches online depictions.
• How Might We Design a modern e-commerce platform for busy working parents that helps them feel confident that they are receiving fair shipping rates and return policies when making purchases remotely.
MVP
We concluded our MVP by bringing together all our information using The Moscow Method. Our MVP is to redesign Nini & Loli’s mobile site, so customers can search and browse efficiently, have a transparent shipping and return policy, and have access to immediate customer care. Our hypothesis didn’t match our findings but we were happy to be guided by the data.
Lo-Fi
We tested our prototype with 5 users and learned that our interface needed a clean up and that our main menu needed a clearer call to action. There were too many options in each page; causing confusion amongst testers.
We ran some usability testing during our lo-fi prototypes. These heat maps reveal testers not knowing where to click to proceed forward.
Mid-Fi
In the mid-fi prototype, we introduced a quickly accessible chat button. The chat would connect customers with store staff directly. Nini and Loli would be able to address concerns instantly. We cleared up the excess information found in certain pages and made the check out page easier to navigate. Additional options for shipment and payments were added as well.
Hi-Fi
I followed the color scheme of Nini and Loli’s logo throughout the mobile site. I made the site’s aesthetic more contemporary, modern, clean and sleek. I picked an elegant font to compliment the store’s high end brand. I also fixed the layout issues that were brought to our attention during mid-fi testing.
View prototype Here
Homepage
Search Results
Product Details
Product Description and Review