This is my individual design challenge with Prolific Interactive. The aim was to research and recommend an improved gift card purchasing experience to help increase sales during the upcoming holiday season for Forever 21 iOS app.
ABOUT THIS PROJECT
I independently completed user workflow analysis, competitive analysis, usability testing, created high-fidelity mockups for redesign solutions
The Forever 21® business team has been noticing diminishing returns on gift card purchases through their current mobile iOS app.
Get to Know Forever 21 and Its User
It's always impoartant to know who we are designing for. Forever 21 is one of the most popular fast fashion retailers. It's fast, it's cheap. It targets towards mostly females. Mostly: Young Adults (17-24), Teenagers (13-16), Pre-Teens (12-13), Fashion directed/ Models. This group of users are social, outgoing, creative, active, trendy, leisure time consists of shopping or hanging out with friends. I also digged into the reason that people purchase on mobile, to know more about what they value and struggle with. More than one-third of US smartphone users use a retail app at least weekly. Mobile purchase is convenient, anywhere, any time
USER WORKFLOW ANALYSIS
Current Gift Card Purchasing Experience Is Confusing.
To get an innitial idea of some the issues with current gift card experience, I went through the gift card purchase experience on Forever 21 mobile app. I divided the experience into four steps: find out gift cards, choose gift cards, fill in information, and checkout. I then identified the potential UX issues with each step:
1. Find Out Gift Cards: The gift card option is buried deeply in the side menu, which might be hard to find out.
2. Choose Gift Cards: There are lots of gift card options for customers to choose from, while the experience might not smooth enough.
3. Fill in Information: This requires the customer to fill in the information of the receiper and the sender, while the guidance might not clear enough.
4. Checkout: The checkout page allows customers to have a final review for the order, but does it provide space for change?
Goal, Participants, Tasks, Scripts, Process
By conducting usability studies on Forever 21 iOS app, I wanted to
Identify obstacles for users to successfully find the Gift Card option
Identify obstacles for users to successfully choose Gift Cards and fill in related information
Understand which pain points disrupt the Gift Cards purchase experience
I recruited three participants for the test. In order to get an unbiased result, I paid attention to the demographics of participants:
Female, 23 years old, iPhone user, frequent online shopper
Male, 25 years old, iPhone user, seldom uses mobile for shopping
Female, 25 years old, iPhone user, frequent online shopper
I used Lookback mobile app for testing and recording. Tests were conducted in participants' bedrooms, with appropriate lighting and stable Wi-Fi.
iPhone 4S with Lookback app for testing and recording
2 Females, 1 male, iPhone users
Participants' bedroom, appropriate lighting and stable Wi-Fi
Shopping for a $50 gift card for your sister via Forever 21 iOS app. You just downloaded it and will open it for the first time. You are not sure about whether to buy a e-gift card or a physical one.
Find Gift Card Options
Explore physical card and e-card
Go ahead and choose the one you want to buy, add to your cart
What was that process like?
Did you feel you have all the options you needed, in terms of gift card customization?
What was your favorite part about this experience?
What was that experience like choosing a gift card?
Any changes you would want to see happen?
Main Issues: Gift Cards Findability and Customization
01 Poor Findability of Gift Card Option
All participants were struggled with finding the gift card option at the first time. Is it in the catergory of Women? Men? Sale? Accessories? They tried different places and were confused about the placement of the Gift Cards option, which is under accessories.
02 Inefficient Overview of Options
There are two kinds of Gift Cards: Physical ones and E-Gift Cards. While participants needed to scroll down to access the E-Gift Cards option.
03 Customization is A Pain
When participants finally got to the E-Gift Crads page and tried to customize the style, amount and quantity, the experience involved lots of scrolling up and down, which is inefficient, and inconvenient.
When participants tried to fill in the receiper's and sender's information, the guidance was not clear to follow along, which caused an average of 4 minutes to finish this step.
When participants finally added gift cards to shopping cart, it turned out that you cannot make change to the style, amount and quantity information, unless you start over again.
Learn from The Good and The Bad
To gain more insights for the redesign, I also downloaded other retail apps to see what are their gift cards purchase experience like. I looked at ASOS, H&M, Zara, Macy's, Walmart, Startbucks, Amazon, etc. It turned out that Amazon and Starbucks got the most enjoyable gift cards purchase experience. Here is why:
Amazon sets Gift Cards as a stand-alone category, which is easy to locate. It also provides smart completion when seaching key words, make it more efficient to find the thing you want.
Starbucks provides this smooth gift cards purchase experience that you can make changes to your selection all the time, and there is an efficient overview of gift cards information.
01. Improve Gift Cards Findability
- If the user can’t find the product, the user can’t buy the product.
01 Make Gift Cards Easier to Find
Move the Gift Cards option from sub-category of Accessories to a stand-alone category.
02 Make Search Bar More Helpful
Noticed that no participants used search bar when they were struggeling with finding gift cards option, the search bar is not prominant enough to attract attention, and there is no smart completion of key words searching. So I made the search bar more prominant, and smarter.
02. Improve Customization Experience
- People use their mobiles to enhance productivity, comfort and pleasure.
01 Make Preview More Efficient
I placed gift cards styles thumbnails and preview within one screen so that users do not need to scroll up and down to preview each style.
02 More Friendly Guidance
I changed the wording in the form which users need to fill in information of receipient and sender, as well as highlighted mandatory information. This way users will be more clear of what they need to type down in each blank space.
03 Check Out: Changes Made Easier
On the checkout page, I enabled overview of oder information, including amount, value, receipient's email, sender's email, and message. And the amount and value are editable with a scroller. This way, users are able to check if all those information are correct. Even users want to make a last-minute change, they do not need to start over again.
Quick Tests for Informed Decision Making
I finished the whole planning, testing and redesign recommendations by meyself within 10 hours. There were definitely more things I can do to improve the results, like Card Sorting, Comptetive Usability Tests. However, the most important thing here is to get quick results to move forward with the design. And during my internship at Bose, this kind of things did happen. The user researchers in my team had to conduct usability tests on a new design among 60 participants, and we only had two days for planning, testing, and analyzing. I was asked to join this urgent task, and we conducted tests in one of the Cafeteria at Bose, with 60 participants recruited within Bose.
What I learnt was things happen, as a UX designer, we ought to take the ownership, carry out our responsibility, test quick, and advocate for our users.
Also note that this project was done in April, 2015. Now the Forever 21 iOS app has made some improvements and some of them match with my recommendations.