Digital product · AI · Research

Andy at Area22

How might the user express their tastes in an accessible and digestible fashion?

Five phones running the Andy app, standing on a pale lilac floor: the home screen, with “Try saying…” and a watchlist, in front; the My Taste moods and the filters either side; and two softly blurred wireframes behind.

At a glance

Role
Product Designer
Team
Worked with the founders, in a cross-functional team of designers, engineers and management
Tools
Figma, Adobe XD
Timeline
September 2020 – September 2021
Status
Area22, an early-stage start-up, was later acquired by TELUS

What it shows

  • User interviews and insight statements
  • Blue Sky mapping
  • Wireframing in Adobe XD
  • User testing, and the changes it led to
  • Final screens from the Andy app

Discover

Andy is an artificial intelligence assistant that helps its user reach their viewing content in a faster, more accessible fashion, by learning from the user’s personality and mood. Doing this allows Andy to identify the user’s tastes, likes and dislikes, allowing Andy to give the user more accurate and consistent content as it learns more about its users.

Throughout the process it has been a vital point to understand the user base, what they want from an app like this, and how they might want to interact with it. This has led to some very interesting explorations and feature developments.

I was Area22’s product designer from September 2020 to September 2021, working with the founders. The start-up was later acquired by TELUS.

How it came together

4 steps · 1 rework · 1 milestone

  • Step
  • Rework: went back and changed something
  • Milestone
  1. 1Discover and define2 steps
  2. 2Design1 step
  3. 3Deliver1 step · 1 rework
  4. 4Outcome1 milestone

  1. 1Discover and define

    1. Step 01

      Blue Sky mapping

      How can the user express their tastes? Ideas from Netflix, Tinder, weighting systems, sliders and filters.

    2. Step 02

      Interviews and insight statements

      Two interviews showed the lack of control over tastes, and how much they change with mood.

  2. 2Design

    1. Step 03

      Wireframes in Adobe XD

      Tastes split into likes and dislikes, with a slider for each actor, genre or theme.

      Reworked later in05

  3. 3Deliver

    1. Step 04

      User testing with family and friends

      The test group was briefed, tried each feature and reported any confusion.

    2. Rework 05

      Likes and dislikes merged into one list

      Back to 03: Wireframes in Adobe XD

      Tastes became one list rated from −100% to 100%, with a search bar, rating and year filters, and slide to delete.

      Why: Testers said splitting likes and dislikes created extra steps.

  4. 4Outcome

    1. Milestone 06

      The final Andy app

      Screens for My Taste and filters.

How might the user express their tastes in an accessible and digestible fashion?

The design question
Hand-drawn Blue Sky map. In the centre: “How can the user express their tastes?” Branches explore inspiration from elsewhere (Netflix bases taste on what you watch; Tinder on the decisions you make; sharing opinions with friends is less honest in public), making tastes more digestible (a weighting system, tiered results based on scores), making it accessible (recognisable slide bars, filters, sorting, buzz words and niche tastes) and reusing other features (recently watched, year ranges).
Blue Sky map: how can the user express their tastes?

Define

Interviews

Jack

Student

Pain points
Still haven’t figured out how to control what shows Netflix shows him.
Key insight
Lack of accessibility and control lead to longer times spent for Liam to consume content.
Opportunity
Give the user more control over their tastes through a potentially physical location within the app.

Liam

Student

Pain points
Has very niche tastes depending on time of day and what’s going on around him.
Key insight
Liam often feels like the content that he knows he wants to watch is not readily available to him.
Opportunity
Give the user the ability to adjust their niche tastes according to their mood. This could lead to more accurate content retrieval.

Insight statements

  1. Context
    Lack of accessibility and control can lead to elongated searches for content on apps such as Netflix and Prime.
    Dilemma
    An excess of content leads to indecisiveness in decision making for the user.
    Why
    Netflix etc. do not offer personalised ways to control the content that you see.
    Motivation
    Fixing this will lead to less time spent searching for content and more time actively experiencing it.
    Ideal
    Andy can immediately devise the mood a customer is in for a quick conversation and determine what content to show.
    Insight
    There are no accessible means of finding movies or shows that don’t involve spending an excess of time searching through apps, leading to anger.
  2. Context
    Niche forms of content can be difficult to find due to lack of complete control over tastes.
    Dilemma
    Finding content based on the mood a user is in is very difficult and can lead to the user settling for something.
    Why
    Leading content companies focus on common genre names and buzz words to help locate content.
    Motivation
    Fixing this and allowing the user to search for a more expansive list of categories will in turn refine their search.
    Ideal
    The user will be able to describe their mood and the type of content they plan on watching, and these are all that will be offered.
    Insight
    Settling to watch already-seen content because it is all a user can trust has become far too common, and leads to a negative relationship with this time.

Design

Wireframing through Adobe XD.

  • Wireframe of the home screen: “Try saying…” prompts, My Taste with separate Likes and Dislikes buttons, Friends, and a watchlist.
    Access Tastes from the home screen. This is divided into likes and dislikes, allowing the user to amend these at their own will.
  • Wireframe of the taste list with the sort menu open: rating high to low, low to high, what’s new, A to Z and Z to A.
    User can sort these buzzwords based on alphabetical order or rating.
  • Wireframe of the taste list: directors, genres, themes and actors, each with a percentage slider, and “Super like” stamps on the top three.
    Drag the slider up or down to change your thoughts on an actor, genre or sub-genre.
  • Wireframe of the taste list after dragging Brad Pitt’s slider up to 76%.
    By dragging the bar the user will change the percentage for this bar. 100% is super like while 0% is never show.
  • Wireframe of the taste list reordered, with Brad Pitt (76%) now above Documentary (64%).
    This will rearrange the order and allow the user to begin their search for content, with Andy now having learnt from their changes.
  • Wireframe of content search: a film poster with dismiss, add and accept buttons, tags such as “Recommended by friends”, and a suggestion from Andy.
    User can search for their content. If it is not as expected the process can be completed.

Deliver

We run all features through a rigorous testing system in order to realise their best forms. Currently this is done with family and friends as this is still a small start-up. A briefing of what the feature is is given to the test group. They are then given time to use it and report any confusion they may have had. These are then filtered and addressed accordingly.

  1. Brief the test group on the feature
  2. They use it and report any confusion
  3. Feedback is filtered and addressed
A tester at a desk trying the Andy app on a phone.
User testing with family and friends.

Outcome

Screenshots from the Andy app.

Wireframe of the home screen with separate Likes and Dislikes buttons.Wireframe
The final home screen, with a single My Taste button.Final
The home screen, from wireframe to the Andy app: likes and dislikes are no longer split.
  • My Taste screen with the Filter Type menu open, listing director, genre, language, mood, rating, subject and year.
    Access filters to allow for more digestible consumption of content. This is divided into director, genre, language, mood, rating, subject and year.
  • My Taste screen filtered to directors, showing only Quentin Tarantino at 100%, Super Like.
    Filtering will only show you the taste that you have previously added to the list, to prevent a build-up of clutter and confusion.
  • My Taste screen with Rating (minimum 8.0 out of 10) and Year (1986 to 2021) sliders, and language toggles.
    Added features of rating and min to max year bars.
Overview of the Andy app’s artboards: rows of dark phone screens laid out on a grey canvas.
The full set of artboards for the Andy app.

What’s next?

Area22 was later acquired by TELUS. Looking back, the work pointed to three next steps:

  • Test beyond family and friends. Every feature so far was tested with family and friends, because Andy was still a small start-up.
  • Let Andy read the mood. The insight statements imagine telling Andy how you feel in a quick conversation, and being offered only content that fits. The home screen’s “Try saying…” prompt is the start of that.
  • Measure the time saved. The aim was less time searching and more time watching. Timing how long people take to choose something, with and without Andy, would show whether it delivers.