Designing e-commerce for the elderly — a UX case study
An online florist designed for the elderly
Team: Allan Lee, Anushka Agrawal, Kate Leenutaphong, Cindy Leung (me)
Time: 2 weeks
Final deliverable: Mid-fidelity prototype
Tools: Sketch, InVision
The Opportunity
As the second project in our UX design program at RED Academy, our design challenge was to create an e-commerce website for florists — a perishable good that people don’t usually buy online. When we performed contextual inquiries at local florists, we observed that the people who were purchasing flowers in store tend to be senior citizens.
Our research further supported this:
- Online shopping has become common practice; in 2015, a survey found that 95% of Canadians aged 18 to 44 have made a purchase online in the past year, compared to 71% of Canadians over the age of 55.
- At the same time, according to Statistics Canada, the number of people aged 65 or older has been steadily increasing in proportion to the total population in the past 40 years. At current projections, the proportion of senior residents could reach 25% of the total population in 2036.
- This is a striking statistic when we compare it to the percentage of iPhone users in the world — Apple’s iOS market share has varied between 14 and 21% since 2011. We have a lot more resources dedicated to designing in the iOS space than we do for the generation who laid the foundation for today’s society.
Based on this information, we argue that the younger generation is already online, therefore we find it interesting to target the elderly demographic for this project.
Research — Florists
Interviews
As a team, we went to Granville Island to observe customer behaviour at three florists and interview the owner at two of the locations (Our Little Flower and V&J Plant Shop).
We also interviewed two senior residents who purchase flowers regularly but are not comfortable with online shopping, and three people around our age (mid-20 to mid-30’s) who have bought flowers online to understand the highlights and pain points from their experience.
Key Findings
- Observed that the owners and staff were constantly working or multitasking. They informed us that they tend to miss holidays or fun events at home because of work.
- At V&J, 80% of their customer base are regulars.
- Customers typically don’t know what they want, but they know that arrangements that are fresh + good price = value.
- People who purchased flowers online had a positive experience because of the convenience, and they enjoyed that it was easy to reach the owner over a phone call or SMS if any questions came up.
Survey #1 — Florist Experience
The purpose of our survey was to gather data on people’s prior experiences in buying flowers. The survey was deployed on Facebook and through direct messages to friends and family. At the time the survey was closed, there were 68 respondents who were 50–50 male and female.
Key Findings
- 68% of respondents (who have bought flowers before) would consider purchasing flowers online
- 6 respondents have never bought flowers, but 5 of them would consider buying flowers online
- The most important factors when purchasing flowers are: Product appearance, quality (i.e. freshness), and cost (In the store, everyone told the florist their budget when purchasing flowers)
- Senses — 82% of respondents stated it is very or somewhat important for them to see the actual product before purchasing, while 39% of respondents stated it is very or somewhat important to smell the actual product before purchasing. This is good news, as sight is something we can bridge with e-commerce.
Research — Designing for Senior Citizens
Survey #2 — Online Activity
As we were lacking information about the elderly demographic, we deployed a second survey with questions specifically about their online activity. There were 10 respondents as we wanted to responses from people older than 40, and the responses needed to be gathered over the remaining two days that we had to wrap up the research portion of the project.
Key Findings
- 100% of respondents prefer to be guided through a new process,
60% prefer to be guided through a tutorial, 40% through a video - 78% prefer instant messaging to interact with an online service, while
22% want to speak to a real person when purchasing online. - 89% want to know about a company before buying from them.
Usability for the Elderly
We then looked at studies conducted by the Nielsen Norman Group to find out what UX means for an elderly person.
We learned that the elderly find websites more difficult to use, have a lower success rate of completing tasks online, and are more likely to abandon the task. This research informed us that there are a few ways to make websites a bit easier for the elderly to use by:
- Avoid dividing the users’ attention between multiple tasks or parts of the screen
- Allow for greater time intervals in interactions (i.e. limit pop-ups and slow things down)
- Don’t be afraid of long-form text and deep content
I personally found this point very interesting. From NN Group’s testing sessions, they observed that an elderly person would take more time to explore the website, while a younger person would skip over some things right away.
This quote stood out to me from Ollie Campbell’s article on Smashing Magazine on this topic:
“Growing up with computers, we take interface elements for granted, like scrollbars and search fields, but older people may not have used them”
–Ollie Campbell, co-founder of Milanote
Based on our research, we created a checklist to ensure usability for the elderly:
Planning
To analyze this information, we each picked a few important points from each source and created an affinity diagram.
Storyboard & Scenario
We created a storyboard for our user, Morgan.
Customer Journey Map #1 — in-store experience
Using a customer journey map, we plotted out what it’s like for Morgan to go to the florist.
The dips are the pain and inconvenience of travelling to and from the store, but she actually really loves the experience as you can see from the high points in the middle.
Customer Journey Map #2 — online experience
For comparison’s sake, we referenced a CBC Marketplace video on an elderly shopper’s experience when she ordered flowers online.
The shopper was hesitant about the process and struggled to navigate the website. When she finally received the product, it looked nothing like the picture on the website. Overall, it was a negative experience.
User Persona
We summarized this information and created a user persona for Morgan.
Her Goals
As a team, we agreed that her goals were four-fold:
Feature Prioritization
Having all this information, our group came up with a list of features that could improve the experience of buying flowers online for an elderly person. However, we realized that a lot of the features were “nice to haves” and not integral to an e-commerce site.
At this point, it was time for each of us to use the research we collaborated on, and diverge to make four unique websites. For my website, I narrowed down to a few core functionalities: features in white are must-haves, features in red are specific to Morgan’s goals.
As a last check, I mapped these features back to the four goals we established for Morgan:
- To emulate the in-store interaction online, I wanted a page for Morgan to see what the freshest flowers are in store each day, so she can be in the know even though she can’t be there.
- To ease her navigation, I included the interface elements from our checklist, taking into consideration what it’s like to be online as someone who’s just stepped into her 70s.
- I included a tutorial video that is easily accessible at all times, as our research informed us that 60% and 40% of respondents preferred tutorials or videos when learning a new process.
- For the layout of the website, I wanted to mimic the experience of browsing products on a catalogue magazine because that is a behaviour that is familiar to this demographic. This layout would also allow for minimal scrolling.
- At the very end, after her arrangement is put together, we will email her a photo before it’s delivered so she knows what to expect.
Design
Having a good idea of what the website might look like, I quickly moved on to create the design of the site, starting with the user flow, wireframes, paper prototypes, then digitizing in Sketch and InVision.
Testing
At each stage, I performed testing to gather feedback and adjusted accordingly.
- My checkout flow was too long with 5 screens, therefore I combined some of the fields to shorten to 4 screens.
- Making the “Close” button bigger on the page with the tutorial video.
- Include payment options for cash. Make it apparent that they cannot pay with cash in-store, unless they are picking up the arrangement in-store.
- Enable the Viewing and Sorting functions work on each page.
Unfortunately, the animations available on InVision were limited, so it wasn’t possible to show the “page-flipping” motion. Later when I showed the prototype to my teammate Allan, he felt that there was a missing piece to my prototype if the catalogue layout wasn’t shown, so he helped make a gif to show the animation:
Thanks Allan!
Final Prototype
With the feedback in mind, I created my final prototype, which can be viewed here:
Conclusion
When reflecting on this project, I learned a lot going through the whole design process from start to end, although I wish we had more time to do more research. I really enjoyed learning about usability for the elderly, and I’m glad we took a more challenging route to stretch our minds for this two-week project.
