Designing the outer layer of the product experience
Type
UI/UX
Year
2022
Role
Head of CX

Designing the outer layer of the product experience

This one is a bit of a departure from other case studies. Starting by addressing the elephant in the room: the company shall not be named, the product shall not be showcased, trade secrets shall not be spilled.
The following case study may or may not be inspired by my previous position as head of customer experience at a venture-backed Silicon Valley startup. Names, location, and dates have been changed to maintain anonymity. * wink, wink *

Approach to CX: developing a two-way connection between customers and the company

When I joined Seedling (fictional name), I was shocked to see the discrepancy between the core product experience and its outer layers—from account management to basic email interactions.

I embarked on leading the customer experience efforts—spanning across all touch points with our users.

During design reviews, I would wear the customer hat and communicate certain patterns and point holes in upcoming releases.

The first step was to ensure that learnings and the voice of the customer is clearly communicated back to the product & engineering teams.

There was much more to do than pointing at holes. Plugging them became the day job.

Identifying a gaping hole: the lack of customer interactions system

When I joined, Seedling relied on emails to communicate everything and anything to its users. Most transactional emails lived in a dark corner of the codebase while non-mission-critical (and non-GDPR compliant) emails were being sent from Hubspot.

As a whole, communications were sparse and the users where essentially on their own.

Actual footage of a Seedling user. Source: giphy

A clear issue was the lack of alignment in the design, voice & tone of our emails communications. More critically, they were seldom aligned to the user journey throughout the product, nor were they bringing much value.

Data soup: defining the checkpoints of the user journey

Seedling’s product spans across multiple platforms, browsers, and operating systems. At the time, this permeated into a rather complex telemetry data set to parse in order to gain insight into user behaviours.

Some things were tracked. Some were not. Some were simply wrong—or partially right.

Attempt to explain the data pipeline.
Source: Seedling's archives. (but really...source: giphy)

And so, from the get go, the approach was to play it safe and work with generic storylines triggered by generic events—that occurred across all use cases.

Building the foundation: sound data pipeline & good eyes

For the next couple of months, I began developing the foundation for our user communication stack. At its core, the data piped into our automated messaging platform (I opted to use Customer.io for this) had to be accurate and shed light into key user activities.

Raw events & data didn’t cut it. At the time, there were inconsistencies with the way events were recorded, and what they actually meant.

And so, I wrote some SQL poetry to extract key events and attributes that would help trigger our emails—and ensure their relevance.

I then used HighTouch to sync customer data from our warehouse to our messaging platform.
Then, finally came the time to ditch the data engineer hat and put on the designer beret.

Designing the outer layer of the product

As stated earlier, Seedling’s core product was rock solid… what wasn’t was everything surrounding it. Leading to a confusing onboarding and haphazard feature discovery.

The idea was to develop a strong set of behavioural & transactional emails to support the core product experience.

Developing a bolt-on design system

Seedling has its design game on lock. And so, to keep the everything tidy, we agreed that developing a distinct design system in Figma to handle the periphery of the product (marketing website, email communications, etc).

This allowed me to expand further on the design system which was by nature restrictive when used for web design & email development.

Going live with words, components, assets, and happy emails

With the foundation in place and a solid plan, I began executing on our user messaging strategy: designing & shipping a revamped onboarding sequence, trial notifications, workspace notifications, etc.

Source: Giphy

Unfortunately, my time at Seedling came to an end before I could see the fruits of this email communication overhaul. It was definitely off to a good start! I'm sure my successor will take it to the next level—or they might just decide to throw the baby with the bathwater.

For a better experience, give it a shot in full screen!
For a better experience, give it a shot in full screen!