Have a good read!

Halfway there!

Thanks for reading!

An event creator and organiser built within WhatsApp that helps stay in touch with loved ones in time of crisis easy(-ier).

Conceptualisation
User Research and Testing across 3 different continents and languages
Inclusive Design
Design System (Android)
UX Writing
Prototyping

Speculative feature for WhatsApp
Year: February 2020

My Role

Project Type

Problem

WhatsApp users have to switch apps or rely on other means to create and organise events. This means they don’t have a centralised way to communicate:

  • Event Details (Date, Time, Time zone differences)

  • Event Updates (Changes, Share, etc.)

Making it much harder to decide on a common time to keep in touch.

Solution

A centralised event management system on WhatsApp that allows:

  • Creating events with the people in the same group chat -> Automatic reminder for participants

  • Suggesting changes right on the app -> Automatic update, notifications.

  • Managing events without switching apps

  • Sharing events with other contacts on WhatsApp.

Ultimately reducing time-lag between responses, making picking a time easier.

“Keeping in touch should be as easy as having an Apéro.”

User Research

9/10 people agreed that a built-in event organiser within WhatsApp would make keeping in touch easier:

Click image to enlarge

Personas

To understand the users’ pain-points, I created two personas: Alex (Event Creator) and Céline (Participant)

Alex

32, Designer
San Francisco, US

Background

Being confined at home, Alex wants to create an event to keep in touch with his mum Céline in Paris and his sister Anne in Tokyo.

Pain-points

  • Create an event in the middle of the conversation.

  • Having to remind his family.

  • Having to switch apps to change event details and communicate those changes.

  • Having to switch apps to manage events.

Needs & Goals

  • Having to switch apps to create events.

  • Invite his family.

  • Set reminder, in different time zones.

  • Easily change event details and communicate changes.

  • Organise and manage his events.

Céline

60, Retiree
Paris, France

Background

Living on a different continent from her children, Céline wishes to keep in touch with them even more during the confinement.

Pain-points

  • Having to switch app to note down events.

  • Having NO direct way to suggest or modify event details.

  • Having NO direct way to share events.

  • Having to switch apps to manage events.

  • Having a hard time learning new features.

Needs & Goals

  • Functions easy to discover and understand.

  • Easily see events created.

  • Easily keep track of events.

  • Easily suggest changes.

  • Share the event.

  • Organise and manage her events.

Despite having different roles, Alex and Céline both need to communicate updates quickly and easily to finalise the event.

Challenges

The User Research also revealed that there are 2 main types of users: the tech-savvy Alex and his mum Céline, who is much less so.

This means the feature needs to be easy to discover and learn to use for different users.

Human Challenge

The feature also has to comply with WhatsApp’s principles and challenges:

Technological Challenges

  1. Unintrusive UI
    Simple Interface with simple interactions.

  2. Effortless introduction
    New features should provide obvious utility that requires little introduction.

  3. No auto-detection

    of the date and time and making it clickable as in the case of Facebook’s Messenger since WhatsApp is an encrypted platform.

Design

Creating events with the same people and without switching apps

Event feature integrated in the chat screen to create events without leaving the conversation. This automatically:

  • Converts the event's time into participant's local time.

  • Reminds participants in their respective time zones.

Different versions of copy tested for participants' location text label:

  • 'Set participant's time zone'
    Too long, implies GMT system

  • 'Set participant's location'
    Too long

  • 'Set local time'
    Implies time and location

To ensure discoverability, the 'Calendar' icon is placed in the top menu bar next to the 'Call' button.

Automatic Reminder

Set in the Participant's time zone.

Flexible response system to cut down time-lag

A flexible response system helps both Alex and Céline response to events and pick a time more easily.

Updates and Notifications are sent to other participants automatically.

Direct Reply to event

An Accelerator to help advanced users suggest changes easily as they would reply to a text.

'More options' to offer the sense of possibilities

making it clearer for older users that they can propose changes through the event invite.

Checking schedule with shortcut to Event Menu

to quickly resolve schedule conflicts.

Having multiple ways to suggest changes help a wide range of users find a time slot in a flexible and comfortable manner, more efficiently.

Making changes instantaneously on the app to reduce time-lag

Updates and Notifications are sent to other participants automatically.

From Event Menu

Direct tapping on invite

Sharing Events with others WhatsApp contacts without leaving app

by taking advantage of WhatsApp's message forwarding function.

Updates and Notifications are sent to other participants automatically.

Managing events right on the app with Event Planner

Helps cutting down on time-lag of switching back and forth between apps.

Any change or notification is seen right on the app.

Filters

Filter by Month

Weekly View

Filters by Today or Latest.
Users can quickly see their events based on urgency.

Horizontal Navigation allowing seeing the events by month.

Users can also see organise their events from a Weekly view.

Designing a new feature for an existing app means following the app’s design system and philosophies.

To ensure learnability, the interface needs to blend in whilst remaining discoverable and decipherable through icons, texts, colours, interactions and information hierarchy.

Design System

System Thinking for Scale

Three out of four WhatsApp users are on Android (source). The Design System was created based on Material Design to provide a centralised and consistent visual language.

Using Visual Hierarchy to make data discernable

Two levels of Visual Hierarchy: Micro and Marco to help users grasp the information easily.

Macro

Notification

  • A red dot to signify notifications. Usability Testing confirmed that this is clearer than WhatsApp’s default green dot.

  • Red is also used to emphasise changes throughout the feature.

Colour Code

  • Same colour for Event Creator's name and event tag to quickly see whom the event belongs to.

  • Same colour for Message Seen, ‘Going’ button as confirmation.

  • Same colour for Message Sent but not Seen, Participation not yet confirmed.

Click image to enlarge

Takeaways

Learning #1:
Design for Inclusiveness using Heuristics

Older users have a hard time figuring out new features. But they pay a lot of attention to shared media (photos, videos, etc.) as they wish to cherish those moments.

Event Invite designed to mimic WhatsApp’s shared media to :

  • Make it more familiar to discover and to learn the feature (Adhere to Standards).

  • Let it blend in with the app. (Internal Consistency)

Learning #2:
Be ready to step outside of your comfort zone

A/B Testings revealed that the GMT system isn’t popular outside of the English-speaking countries.

That’s why it’s important to test early, test often and with as many people as we can.

  • 'GMT + 1'
    Unfamiliar outside English speaking countries

  • 'Paris'
    Intuitive, recognisable for everyone