Apollo Music Store | iOS

Canada's First iOS Native Musical Instruments Shopping App: Apollo

‍

‍

‍

PART 1 - EMPATHIZE

‍

My first step was to research and understand more about users. My exploratory research phase started with secondary research.

‍

01. Secondary Research

I looked at government agencies and media sources for the information I needed to start with. I started my research broadly, gathered data and tried to understand my target audience in order to design a better product than current products. I created charts and conducted competitive analysis as well. As I go trough my desk research, I started tailoring my research for mobile e-commerce for musical instruments.

‍

I have learned about the following and created charts;

a) Retail e-commerce sales in Canada

b) Online shoppers by age groups

c) Changes in In store vs. Online sales

d) Mobile e-commerce sales (worldwide)

e) There is only one existing solution (music store e-commerce app)

‍

‍

‍

‍

‍

Insights

a) There is a visible spike of the change % trough out the pandemic, however the growth in numbers is consistent.

b) Between 2019 and 2021 there was a 75% change of an increase of retail e-commerce sales in Canada; of course that spike is related to the pandemic, but the current increase and expected increase also support the importance of digital retail experience and potential revenue for the e-commerce providers.

c) On the right side, the chart shows the changes in store and e-commerce sales during the pandemic, February - September 2020. Music stores also had an e-commerce boost during the hot days of pandemic.

‍

‍

Understanding Why Mobile E-commerce is Valuable

‍

Insights - Importance of eCommerce Apps

a) I have learned that 67% of all eCommerce sales across the globe is done with mobile devices.

b) Conversion rate is 140% higher compared to mobile websites and 130% higher than desktop sites.

c) Mobile apps have a lower rate of shopping cart abandonment at only 20%. Desktop sites follow at 68% and mobile sites at 97%.

d) 78% of users would rather retail mobile app than mobile site.

(Source: Statista - Number of smartphone users world wide, must know mobile commerce trends 2017)

‍

‍

Competitive Analysis

I conducted competitive analysis to discover relative strengths and weaknesses of competing designs. Hoping to find out how they’re doing it, what’s working and what’s not; strengths and weaknesses, trends and patterns.

I found out that Long and McQuade is the only competitor that has an app for both iOS and Android platforms. Other competitors, Steve's Music and Cosmic Music do not have an app. I downloaded the app and explored it, read the reviews online. There are a lot of user frustrations and usability problems on the app however some key ones are the following;

a) The L&M app mimics the website's mobile breakpoint on their app for both platforms; iOS, and Android.

b) Users find the navigation and the filtering painful to use.

d) The app is not tailored for neither iOS or Android.

‍

‍

‍

02. Primary Research

‍

Interviews

I conducted semi-structured interviews with five people to gain qualitative insight; I asked open ended questions to understand general attitudes, explore more about what they care, challenges they face and what is essential for them while shopping online for an instrument or any other musical essential. The participants were 18+ and purchased at least one musical instrument or related items in the past online.

‍

Participant 1: A rock solid return policy is a must for me if I am getting an instrument online.

Participant 2: For me price tags, and shipping is very important. I often check for new and used items. I think product dimensions, weight, specs often effect my decision making.

Participant 3: I would want to get the item fast If I really want it or need it in short time.

Participant 4: I check for reviews and price, and then YouTube for product videos. At least that's what I did when I got my ukulele!

Participant 5: They were giving free one month class if you bought Hohner brand, so I got that brand harmonica

‍

‍

Surveys

I collected 88 survey responses in total over 5 days. I asked close ended questions to quantify users' perceptions in both surveys. The first survey had 45 participants and the second one had 33 participants. The goal of the very first survey was to confirm that I was on the right path to create something users needed and wanted. The data was collected from Musicians thread on Reddit.

‍

1) Have you ever purchased an instrument or accessories on mobile using an app?

‍

‍

2) What is the most important factor when buying an instrument online?

‍

‍

‍Surveys and interviews helped me discover 5 key themes

1) Shipping is important for users. They would like to know if the product can be delivered fast

2) Users care about price tags and would like to see products based on their budget

3) Users would like to see high quality photography and videos if possible, because they would like to know about tones, and specs. I also discovered that musicians go on YouTube to get an objective review from owners of the product they are looking for

4) They always check reviews on the product page

5) Musicians care about the return policy. Since it is online shopping they want to have a good return policy

‍

PART 2 - DEFINE

I developed a primary persona and a journey map based on the user research previously conducted. Persona and journey map helped me with:

1) Putting myself in the user's mind space to identify expectations and pain points of the user's journey.

2) Asking crucial questions like; what is important for Taylor? What has she experienced so far and what does she know already?

3) Allowing me to find what interactions conflict with her goals and behaviors.

‍

01. Primary Persona

‍

‍

02. Customer Journey Map

To look at the entire end-to-end experience from Taylor's perspective I created a journey map. These series of interactions provided moments of frustrations, goals, and opportunities to address.

‍

PART 3 - IDEATE

HMW, and Task Flow

At the end of a discovery research and building the persona, I crafted my HMW statement.

How might we enhance users' mobile shopping experience for musical instruments?

‍

‍

Primary Task Flow

I built a task flow to map pathways that Taylor can take when interacting with my solution.

‍

PART 4 - Prototype

‍

Sketches

After completing the task flow, I started sketching my solution for an iOS app using pen and paper. I drew inspiration from existing UIs on Dribble, and other e-commerce apps on the App Store.

Down below are my sketches that were moved to low and mid fidelity wireframes/prototype.

PART 5 - Test

I designed a mid fidelity prototype to conduct a formative evaluation, in other words to make improvements, determine what parts of the design work well or don't. What can I change to improve the interface for users? It also help me to see how users interacted with the app prototype. The formative evaluation, (usability testing) was conducted with 5 participants and they were asked to perform 6 tasks.

‍

Before the test, I informed the participants I was only testing the product not them; I explained them there was no right or wrong answer here, and just wanted to hear exactly how they think, so I asked them to follow the think out loud protocol.

‍

Pre Test Task

First, I asked them to look at the home page and tell me what they made of it. What could they do here and what was it for?

Tasks

1) Find electric guitars page

2) Choose only ESP brand electric guitars

3) Find the LTD-1000 guitar and add to your bag

4) Find at least one accessory and add to your bag

5) Remove one of the items from your bag

6) Process checkout using VISA card

PART 6 - REFINE

After completing usability testing, I started working on the visual identity of my product.

‍

01. Visual Identity

I thought about what my product stands for, what should the brand feel like. The best keywords define my product were MODERN, SIMPLE, CREATIVE, FRIENDLY AND FAMILIAR. These keywords helped me design my mood board, color palette, and typography system; later my product's logo.

‍

02. A Sneak Peek to the Design System - Atoms (Some)

‍

This is a sneak peak to the component based design documentation to show my process. I did not want to crowd the case study, and show all the atoms, molecules etc here, because I am currently working on the UI Library for this project. I take advantage of the Atomic design method which Devs and Designers value.

‍

‍

‍

‍

‍

‍

02. High Fidelity Prototype

‍

After wrapping up everything I created this demo to showcase Apollo's core functions and features.

‍

‍

‍

‍

03. Summative Evaluation

Once I finished the high fidelity prototype I conducted a mini summative evaluation with 3 participants to assess the overall experience of my redesigned and finished product. The first part of the evaluation was showing them a demo reel of a competitor app's walkthrough. And second part was where I asked the participants to compare redesigned product to prior version and/or other apps they use. Discovered the following:

‍

‍

1) The app feels and flows familiar like other mainstream e commerce apps

2) Easy to navigate, find items and checkout

3) Very simple and clean design

‍

What I Learned?

1) Consistency and Standards: Users do not want to think when taking actions in certain situations. As a designer I have a responsibility to consider cognitive load when designing and I am obligated to follow platform and/or industry standards. Internal and external consistency must be maintained at all levels. Jakob's Law

‍

2) Recognition Rather Than Recall: I would argue that my only competitor Long and McQuade (I really like the store IRL) has poor reviews online, because  users face a platform unfriendly experience with poor UX/UI. My solution on the other hand was not a rocket science. I simply followed and used Human Interface Guidelines for iOS. Therefore, users did not have hard time when navigating my product, because iOS users (including myself) have been exercising the same design patterns for quite some time now.

‍

3) Aesthetic and Minimalist Design: Instead of sharing a lot of information I put only relevant information to flare-up the visibility and support minimalistic design, therefore users won't get distracted by causeless components.

‍

Next Steps?

1) A responsive website!