Happs is an early-stage startup aiming to revolutionize live news production and distribution. Happs harnesses a global network of independent journalists who can instantly livestream from the company's mobile app. The heart of this operation is a "virtual newsroom" where story ideas are cultivated and potential contributors are identified. Happs producers then work to transform these concepts into compelling live news content. Initially, the company utilized Slack as a temporary platform for this virtual newsroom. However, as their community expanded, it became clear that a custom-built solution was necessary to fully support their unique workflow and growing user base.
Video Walkthrough

About the project

Company

Happs

June 2019 - March 2020

Contribution

Lead Product Designer

Team

Head of Product

2 Full Stack Engineers

2 Research Interns

4 Broadcast Producers

My role

I led all design efforts on the project including discovery, ideation, design, prototyping and user testing.

The challenge

Happs had successfully cultivated a thriving community of passionate contributors who were consistently pitching story ideas through Slack. Our primary challenge was to extract valuable insights from this engaged user base, identifying both the strengths of the current system and the critical features it lacked. Our goal was twofold: to ensure a seamless transition for our community into the new platform, and to enhance collaboration between contributors and our production team, ultimately leading to higher-quality stories. This user-centric approach was crucial in designing a bespoke solution that would not only meet but exceed the needs of our growing network of independent journalists.

Problem Statements

  1. Contributors are not effectively using the Slack community to contribute to the development of stories, causing the quality of our broadcasts to suffer.
  2. Broadcast producers are struggling to find the best stories. They also lack the right tools to develop the stories they select for broadcast.

How might we...

  • ...build a bespoke virtual newsroom solution?
  • ...smoothly transition our community from Slack?
  • ...improve the story pitch process for the contributor?
  • ...surface the most interesting and relevant stories to our producers to be considered for broadcast?
  • ...make it easier for people to explain Happs to other potential users??

Discovery

Research Methodology

I aligned on a qualitative approach to better understand the wants and needs of our Slack community and identify pain points as well as potential solutions for our product.

12 interviews with very active users

8 interviews with new or somewhat new users

2 Happs producers were interviewed various times throughout round 1

Research analysis

Three key insights emerged during our research that led us to three opportunity areas worth exploring:

Key Insight #1 - New users are unclear about how to start participating.

There is somewhat of a learning curve to the Happs process, new users of the Slack community don’t know where to start or how they fit into the overall equation.

“I love what Happs mission, but the Slack community is just overwhelming to me. I’ve used it before for work, but I’m really not sure what you guys want me to do in there.”

Adam Lucente, Freelance journalist based in Iraq

Key Insight #2 - The majority of users expressed a desire to establish a personal identity within the community.

The biggest reason for users wanting a social identity on Happs is to showcase their contributions that have lead to broadcasts.​

“I’m proud of my pitches that have turned into broadcasts. I have them all bookmarked and saved”

Lucia Aybar, Architect and Happs Community Leader in Dominican Republic

Key Insight #3 - Producers need an easier way to find, keep track of and develop promising stories.

The virtual newsroom should surface interesting stories that are garnering a lot of interest from the community to our production team. There needs to be a way for our producers to flag and keep track of these stories as they develop.

“Sometimes Slack is like a firehose, I try to catch all the pitches that have potential but I know I’m missing some.”

Andi Johnson, Happs Producer in Los Angeles

Ideation

Design Studio

To rapidly generate a diverse array of viable solutions, I facilitated a design studio involving our entire team. This collaborative approach encouraged each participant to quickly sketch proposed solutions, prioritizing quantity over perfection. By fostering an environment of rapid ideation, we aimed to explore a wide spectrum of ideas and uncover innovative approaches to our challenges. This method not only accelerated our problem-solving process but also tapped into the collective creativity of our team, ensuring we considered a broad range of perspectives in a condensed timeframe.

Round 1

  • 8 sketches in 8 mins
  • Present ideas, feedback

Round 2

  • 2 sketches in 10 mins
  • Present ideas, feedback

At the end of our design studio we aligned on a few potential solutions that we moved forward on.

Solution #1 - Community Education

Based on our insight that there was a lack of understanding in our Slack community, we created educational content that would be served to new users of the platform.

We created an introduction video featuring one of our founders David Neuman. I wrote a script and in true startup fashion, we made a teleprompter out of a shoebox, some string, a mirror and an iPad.

We also designed an onboarding overlay that would appear on the home screen, pointing out key features and explaining functionality for first-time users.

We also did some additional ideation around how we might redesign a contributors initial experience signing up for on the platform.

Solution #2 - Newsroom Feed and Broadcast Development

The solution we came up with for the feed/timeline addresses multiple needs of our producer persona as well as contributors.

Contributors can compose a pitch in multiple forms (text, link, photo and video) and that pitch can be voted on by the community after posting. Pitches that garner a lot of attention from our community are surfaced to our producers who can flag them and develop the story all the way through to broadcast.

Solution #3 - Newsroom Feed and Broadcast Development

It was clear  that our users wanted to establish an identity within their community,  they wanted a role and to showcase how they contribute to the Happs  mission. We created a basic profile for V1, a chance to establish this  identity, and as a primary feature of these profiles we included an activity feed. The activity feed would be a chance for users to show off each of the stories they have been involved in. We would eventually gamify the social features, create a badging system to reward users for  their accomplishments. We also experimented with showcasing contributors on social media and designing shareable “Baseball Cards” for key participants in our newsroom.

User Story Mapping

Following our broad ideation phase, the next step was to strategically narrow our focus to explore the most promising solutions in greater depth. I proposed a user story mapping exercise as the optimal approach to maximize our efficiency and insights. This method allowed us to systematically analyze and prioritize potential features and user interactions.

The outcome of this exercise was twofold: it provided a well-defined roadmap for our design phase, ensuring a user-centric approach, and simultaneously generated a comprehensive, prioritized backlog for our engineering team. This dual-purpose output streamlined our transition from ideation to implementation, aligning both design and development efforts with user needs and project goals.

The map consists of three layers: 1. User activities (orange/yellow) which would serve as the backbone 2. Tasks (blue), and 3. Sub-tasks or details (pink).

Description of an activity that a user performs that could include multiple steps.

The potential steps the user takes during an activity.

Each feature that needs to be designed and built.

During the course of a week, our team set aside an hour or two per day to focus on the user story map. By the end of our last session we had a very clear roadmap of what needed to be built.

Here is an actual example of some of the post it notes from our exercise.

Design & User Testing

During the course of three weeks, I designed the entire UI for the Happs Virtual Newsroom. We worked in agile sprints, our developers were in the same room as me every day which made things a lot easier.

User Testing Methodology

We conducted moderated usability testing of our first prototype with both contributors and producers. We used the following metrics:

  • Task success rate (behavioral, quantitative)
  • Overall system usability (attitudinal, quantitative)
  • User pain points & needs (attitudinal, qualitative)

Findings

  • 81 A rank (SUS score indicating the usability of the product)
  • 86% of tasks were completed successfully
  • 22 unknown issues were caught before product rollout
  • Users felt confident using the product and feel like it is a major upgrade from Slack
  • Users were unclear about how to compose their pitches, how to word it and what to include. (This finding led us to add prompt text to the compose window, explaining how to compose a pitch.)
  • Users want the ability to share photos that we could potentially use during livestreams

Takeaways & Impact


Our agile and collaborative approach proved invaluable in minimizing surprises throughout the development cycle. The engineering team's high level of accessibility and active participation in exercises like user story mapping, as well as their willingness to discuss UI nuances during the design phase, fostered a seamless integration of design and development efforts.

This project underscored the critical importance of continuous user validation. Our iterative testing process not only confirmed many of our design decisions but also illuminated numerous small yet significant details, ultimately contributing to a refined product at launch. We were fortunate to have a dedicated group of passionate users who provided invaluable feedback at every stage.

Upon reflection, the only adjustment I would make to our process would be to recruit more new users from our Slack community during the research phase. The insights gained from these fresh perspectives proved to be the most crucial in shaping our final product.

Project impact

The Happs Virtual Newsroom product proved to be a cornerstone in our fundraising efforts, playing a crucial role in our pitch for post-seed financing. This innovative platform significantly bolstered our value proposition, demonstrating both our technological capabilities and our deep understanding of the evolving news media landscape. Our strategic vision and execution paid off handsomely: in June 2021, Happs successfully secured a substantial $4.7 million in funding. This financial milestone not only validated our approach but also provided the necessary resources to further develop and scale our disruptive news production and distribution model.

More Projects

UI DESIGN • BRAND IDENTITY • RESEARCH

Facebook Portal
Brand Refresh

UI Design explorations for the brand refresh of the Facebook Portal device.

Read case study

UX/UI DESIGN

Drop Zone Mobile App

Partnership with Doritos and Mountain Dew for a mobile, AR style scavenger hunt game.

Read case study
View All Projects
“Design is the intermediary between information and understanding.” - Hans Hofmann

Resume