UX Research, & Design

Case Study

a live screenshot of thengine's homepage on a macbook pro

Thengine is a startup for local musicians and their fans. Thengine's founders wanted to create a multimedia content platform where fans could subscribe to their favorite musicians and receive a stream of curated content in return.

The Story

While Thengine's founders were attending The Founder’s Institute, they learned how User Experience Design is an integral part of building a product people actually use. I held a stakeholder workshop with Michael Catlin, Thengine's CEO, and combed over the concepts that he and his partners had developed over their year at the Founder’s Institute.

The Problem

Thengine’s founders had dozens of brilliant ideas, but didn’t have a clear vision about how to execute it or what the actual product would look like.

Thengine's initial concept was to provide a music streaming service that rivaled the likes of Spotify and Pandora. Not only were those behemoth competitors with millions of dollars in funding, but they also wanted to make a curated mutli-media platform which seemed nearly impossible for their shoestring budget.

With all these big concepts, we needed a clear definition of what we would actually build to test Thengine's product-market fit.

a sketch of the thengine's problem
A sketch to illustrate all the concepts and philosophies behind Thengine and our need to prioritize them into a single Minimum Viable Product ("MVP").

The Goal

The goal was to create a MVP that would allow Thengine to prove their business model to its funders and establish an initial userbase of local musicians and their fans.

The Team

My Process

I used this opportunity to implement the user-centered design process I had been studying for the first few months of my freelance career. This was the first project where I was designing a user's experience rather than just a website. While my process most certainly wasn't perfect, I wanted to share my journey and what I learned along the way.

Step 1. Discovery

I began the project by facilitating a stakeholder workshop with Thengine's founders that included:

  • Defining objectives
  • Defining target audiences
  • Brainstorming business concepts / feature ideas
  • Prioritizing based on viability and value

I was reading UX for Lean Startups by Laura Klein and used her approach to help craft our iteration/validation process and to communicate the concept of Lean UX to Thengine's founders.

I used three guiding questions from Laura Klein's book to help guide the project definition:

  • What is the root of the problem that local musicians face in making a living?
  • How does our product solve that problem?
  • How do we measure the success of our efforts?
  • a third whiteboard image showing a brainstorm for thengine
  • brainstorming my first ux project ever. whiteboard image 1
  • another brainstorming session for thengine's mvp

Step 2. User Research

When we arrived at a clearer problem definition and target audience, I invited Thengine's founders to join me in an initial user research phase. I wanted to validate the premises behind our thinking before we started designing and building the MVP.

“The biggest improvements in user experience come from gathering usability data as early as possible in a project”
Outlining the elements of user research during a planning meeting.

I researched venues in Denver that had the strongest community of local music, and scheduled research events with Thengine's team in Denver.

After attending a few shows, we identified several musicians that fit our segment definition: local musicians that were determined to make a living playing music and were dissatisfied with the existing platforms (Spotify, iTunes, Pandora, CDBaby, etc.).

  • josh blackburn local denver musician
    Josh Blackburn
  • josh blackburn local denver musician
    The Electric Gypsies

Step 3. Research Analysis

analyzing research findings

We extracted snippets from our interview notes and placed them on a wall. During our discussion I had a realization: Rather than create a multi-media platform and compete with the current media giants, we needed to build a tool that facilitated a 'back-stage' relationship for local musicians to exchange authentic experiences with their fans.

That type of intimate relationship wasn't available anywhere else and would allow Thengine to monetize the relationship between a musician and their fans (like they envisioned). We needed to bridge the digital/physical context of creating and experiencing music. We needed to reward fans for subscribing to their favorite musicians and reward musicians for sharing their most intimate process.

I called the concept 'The Songwriting Room'. It would be a place where musicians released version-controlled tracks to a subscription-only fanbase. This would fulfill the fan's desire to have a deeper relationship with their favorite local artists, and would allow musicians to open their songwriting process to a core fanbase that could support them both financially and emotionally.

While Thengine's founders appreciated and resonated with The Songwriting Room concept, they bought into it only as far as committing to 'add it to version two'. They determined to persist with their original concepts despite our research and as a result we seemed headed towards building a halfway MVP that wasn't focused on solving a specific problem for a specific audience.

I think part of this was because two of the founders worked remotely and didn't participate in the research with the local Denver team. This made pivoting through research findings particularly difficult.

Also, none of Thengine's founders had ever built a digital product before so it seemed to create a barrier to implementing the iterative process of research and design.

Step 4. Create a Lean Hypothesis

Before starting the design process, I pushed Thengine's founders to boil Thengine down into a single sentence.

I suggested the following: A subscription-based Songwriting Room that allows local musicians to create an intimate back-stage relationship with their fans.

Thengine's founders came back with: A lean start-up experiment for musicians and their fans.

I expressed my concern that Thengine's definition seemed too vague for an MVP, but I also understood that they had ultimate ownership of their product and decided to move forward with creating an aesthetic that would capture the vision of the product they envisioned.

As a result, I tried to involve them as closely as I could in the rest of the design process—keeping my feedback/validation cycles as small as possible.

Step 5. Low-Fidelity Prototyping

For several months I read Zurb Foundation's Product Design Lessons and learned the merits of ideating at very low-fidelity: it was fast and focused on concept rather than detail.

  • low-fidelity ux prototyping for thengine
  • another low-fidelity sketch for thengine ux project
  • a third sketch for the low-fi prototyping stage of the project
  • a fourth sketch for the low-fi prototyping stage of the project
  • a fifth sketch for the low-fi prototyping stage of the project
  • a sixth sketch for the low-fi prototyping stage of the project

After receiving a thumbs-up on the initial low-fidelity prototypes for Thengine's homepage, I transitioned to higher fidelity. I thought we could use the home-page as an atom around which the rest of the design and business concepts would evolve. I urged Thengine's founders to write content that would further define what we were building so we could design the interface according to the content rather than inserting the content into the design as an afterthought.

Step 6. Medium-Fidelity Prototyping

I transitioned from my pen and paper prototypes towards medium-fidelity with Adobe Illustrator.

  • bringing together a higher fidelity prototype for thengine's app concept
  • another screen for thengine prototype showing search navigation
  • a prototype showing one possible share-button design for thengine

Step 7. Live Prototyping

I decided to use Foundation 5 to develop a live prototype of Thengine's MVP so I could test the design at local music venues. I would arrive early to a show and ask fans to use their own devices to look at the landing page. I would ask simple questions like "What do you think this website is about?" "What does this website have to offer?" "Does the offering interest you?" "If you were interested, how would you sign up?" "How would you share this with a friend or family member?".the desktop version of my live prototype of thengine - verson 1.0the tablet version of my live prototype of thengine - verson 1.0the mobile version of my live prototype of thengine - verson 1.0

Step 8. Remote Usability Testing

We recruited a handful of musicians and local music fans from around the country to participate in remote usability testing. With the live prototype up and running, I collaborated with Thengine's marketing contractor to test the usability of our prototypes. We usually started the testing process with a short user interview to get to know the person and their context before asking them to perform tasks on the website.

Step 9. Microinteraction Design

In our usability testing sessions, we discovered that the ability to easily share a musician's page was a major feature that was lacking from the MVP.

I read Dan Saffer's Microinteractions: Designing with Details and was compelled by the power of small visceral components.

Inspired by Path, I designed a share icon that rotated and spun out buttons when clicked.I wanted it to feel fun and encourage users to use it again and again.

  • thengine's microinteractoin button in its normal state
  • thengine's microinteractoin button in its clicked state

The Outcome

After several iterations, we passed along the live prototypes to Thengine's Ruby on Rails developers. Unfortunately there wasn't a whole lot of collaboration with the developer before that hand-off as there had been some contract negotiation issues with the previous developers. I don't think having a cold hand-off like that is in any way desirable.

My work helped Thengine's founders take thousands of concepts and distill them into a tangible MVP through authentic user insights. My work allowed Thengine to test their startup concept and seek funding for the next round.

It did seem as though Thengine's founders, in attempting to create a platform that did 'everything' they may have approached creating a platform that provided little to no value to anyone. We will see how the story unfolds for Thengine as they seek further funding.

Michael Catlin
Principal, Genius Media

“John understood our vision and crafted it into reality. He was the guy who took charge and made it happen. From business strategy to user needs, he was a rockstar.”


Courtesty of Browserstack
a live screenshot of thengine's homepage on a samsung galaxya live screenshot of thengine's homepage on an iPada live screenshot of thengine's about page on an iPada live screenshot of thengine's homepage on a macbook pro

Room For Improvement

Throughout the project I identified some places in my work where I could most certainly improve. Here are a few takeaways:

  • The project should have taken place in a much shorter amount of time and with physical co-location. Working remotely seemed to be the biggest obstacle to lean processes.
  • I should have clarified the importance of all members of Thengine's team getting out of the building and talking to local musicians and their fans. This would have created universal buy-in to the research insights and would have resulted in a better MVP.
  • My design process needed a tighter validation cycle. I should have created a weekly sprint schedule with team-wide user research planned for the same day of every week so we were never more than five days away from validation.
  • I wish we would have set aside budget to outsource user recruitment. It was amazing how much time it took to manage the user recruitment process and how little energy it left over to do the actual research and testing.

Want to Work Together?

Contact Me