loader-logo
Introduction

Live events re-imagined with Web3 Smart Ticketing

78%

reduction in customer onboarding expenses

5x

improvement of design productivity

YellowHeart is a platform born in New York using NFT technology and blockchain to create live event ticketing and collectables exclusively for the benefit of artists, teams, and their most devoted fans.

Challenge

YellowHeart had developed a Web3 ticketing platform to cater to a wide range of customer needs, relying on a done-for-you business model. While their platform offered tremendous flexibility to customers, it was complex to maintain and required a small team to manage.

Solution

My primary focus at YellowHeart was on the design of a new self-service event management system. This product allows event organizers to mint NFT tickets, manage ticket stock, monitor analytics, and promote events through token gating, promo codes, and push notifications. In addition, we developed a comprehensive design system, component library and Design Ops strategy.

Research & Discovery

Audit & analysis of existing functionality

In order to understand the existing system in detail, I conducted a series of interviews with internal platform administrators. To document my findings we used Dovetail to tag video insights and Miro for User Story Mapping. This allowed me to break down each step of the administration journey into individual user stories with key team members and build a deep understanding of the system. From here we could confidently identify potential areas of improvement.

Design Planning

Building alignment with the whole product team

Taking the User Story Map from our audit, we were able tag what might migrate to the new, customer-facing system and what might be redundant. We created a new Story Map and brought over what would be included in the new system. Story Maps are fantastic for release planning. Being an MVP our goal should be to only include functionality that is essential for users to reach their core goals while building the simplest, cheapest, most user-friendly solution for each user story.

Rapid Wireframing

Work fast, learn fast

We used the official material design component library for figma as Material Design was already in use, and gave ourselves 6 weeks to go from nothing to testable wires. Tight time-frames with user testing scheduled and unmovable forces the team to cut the fat and focus on what’s essential. Do as little as you can to learn as much as you can as fast as you can.

User Testing

Customer Interviews

For this body of work we conducted live interviews with existing customers and new leads. I introduced a user testing product called Maze, helped the business to understand mothods of recruitment and also trained the team to build reports based with the insights we generated.

Design System

Re-create or Re-use?

When it came time to move into high-fidelity design, our first consideration was our Design System. Do we create a custom design system, adopt a new one, or stick with the one we already have. It was clear that the current platform was using Material Design, but upon closer inspection, we discovered that an existing component library for Material Design – MUI – was already in use. I suggested that we stick with what we have – after all, this is MVP. Any opportunity to cut costs and development time should be considered to increase our velocity. Sticking with MUI would save time on front-end testing, and reduce overall design and development costs. Our focus should be on creating a delightful experience for our customers that delivers on what we promise, not on re-inventing the wheel…. 
Not now, anyway.

UI Design

High Fidelity Prototype

Using an existing design system shouldn’t stifle creativity and doesn’t stop you from creating bespoke components/styles in the future. It’s simply a great place to start. As a designer, I have no problem working within the boundaries and limitations of an existing design system – it’s the common language that will bridge the gap between the design and development teams. I helped the YellowHeart design team become custodians of their design system and component library, improving upon what they have using Material UI instead of starting from scratch. With this approach annotations, design notes, and acceptance criteria can all reference (and link to) existing Material UI documentation.

Design Process

Enhanced Design Operations across time zones

YellowHeart wanted to make use of my experience with frameworks and processes that enable better remote collaboration. Working closely with the Product Manager, Chief Product Officer, and Lead Architect, I helped to implement highly efficient processes that allowed us to work with minimal daily overlap. Utilizing both asynchronous and synchronous communication, we were able to optimize our team’s performance with just two to three hours of daily overlap. To aid in this process, I introduced tools such as Loom and Dovetail, along with an improved process for managing design and research tickets in Jira.


Design Process

Remote Workshop Facilitation & Training

As an experienced workshop facilitator, I introduced a number of workshop formats. From design team retrospectives and planning sessions to Business Model Innovation, Jobs to be done and market definition workshops.

Design Process

Lean & Iterative

By introducing lean design methodologies, speed of execution increased without effecting other processes that were functioning well. Design retros & planning sessions helped identify improvements that were testable in one month cycles.

For example, creating better design and research tickets in Jira, improving the use of Jira roadmaps and planning product releases with Story Maps.