Happy Hour
A digital mainstream media app alternative that focuses on positive, uplifting news.
Role
Designed from start to finish, including ideation pitch, user research, prototyping, user testing, and implementing feedback for finished high-fidelity prototype.
team
Individual project from a UX/UI strategy course, supported by 42 participants through user interviews/surveys, and guided by session instructor.
TIMELINE
13 weeks.
Overview
With the rising behavior of Doomscrolling (the excessive consumption of negative media), Happy Hour is an alternative news platform that aims to counter the doom-and-gloom style of mainstream news media.
They say you build your social content brick by brick, so it could be my fault, but everything on socials is so sensationalized - and for the worse. Whether it was the pandemic, politics, or the rising costs of living, there really are no breaks to be caught. Reality is, the world isn't all bad when you disconnect from media, but we lack an effort to uplift stories that show goodness for those who stay connected.
For this project, I wanted to create a news publication platform that focused on positive, uplifting news. So, this is Happy Hour - my response to an issue of my choosing for a User Experience and Interface Design course.
They say you build your social content brick by brick, so it could be my fault, but everything on socials is so sensationalized - and for the worse. Whether it was the pandemic, politics, or the rising costs of living, there really are no breaks to be caught. Reality is, the world isn't all bad when you disconnect from media, but we lack an effort to uplift stories that show goodness for those who stay connected.
For this project, I wanted to create a news publication platform that focused on positive, uplifting news. So, this is Happy Hour - my response to an issue of my choosing for a User Experience and Interface Design course.
Product validation
The search for user data
Like all assumptions, its best to first validate biases just to ensure that you're travelling in a needed direction. To validate people's reception to news media, I conducted interviews with 5 individuals in a one-on-one format and captured responses of 42 participants in a survey, all between the ages of 21 and 35, to learn about their behaviors towards social and news media. To summarize:
- Most respondents found it easier to engage with social media for longer periods of time than reading the news. On average, respondents were able to commit 2-3 hours to social media, while capping news to no more than an hour.
- Social media did not often influence a respondent emotionally or mentally, but in circumstances where it did, it left positive feelings.
- Only 2% of respondents claimed the news positively affects them, 43% felt neutral, while the remaining 55% felt negatively.
- Respondents enjoyed the social and sharing aspects of social media, features that are typically missing in media apps, which make it less enjoyable for them
- News content lacking in quality and factuality would be faced with apprehension.
Research artifacts from the user interviews and surveys
One point of interest to note was that respondents concerned themselves with the credibility of news pieces when staying informed was the primary goal. However, if they were browsing with a leisurely mindset? Not so much.
It seems that their reason and method for consumption directly influences the validity of content. For example, news seen on social media is held to a lower standard for credibility than news presented on a proper news channel. This really sets mindfulness on how to present positivity in a consumption-space.
The interviews and surveys also gave an understanding to what respondents felt were currently missing from news media. These findings helped me pivot my concept to approaches respondents viewed positively.
It seems that their reason and method for consumption directly influences the validity of content. For example, news seen on social media is held to a lower standard for credibility than news presented on a proper news channel. This really sets mindfulness on how to present positivity in a consumption-space.
The interviews and surveys also gave an understanding to what respondents felt were currently missing from news media. These findings helped me pivot my concept to approaches respondents viewed positively.
USER PERSONA
Faces of prospective users
From the user data, the key pain points and needs of this audience group were synthesized into three personas for Happy Hour, each representing high-level findings. These personas are all willing to connect with news media to stay informed but vary in degree as contributors and consumers.
Three user personas crafted from the user interviews and survey data
Core components
Implementing what matters most
Based on all the data synthesized so far, five core components were established as the guiding principles to ensure the app was designed with user needs in mind:
- Bookmarking system that also enables folder structures
- Engaging with articles and other readers through comments and threads
- In-app and cross-platform article sharing
- An inbox for messaging friends
- Filter searching for articles using a tags system
workflow
Visualizing start to finish
Before committing to any fidelity of prototyping, I needed to work out each of the core component's interactive logic. As the actual app has five different features, for brevity, I'll be covering the process and evolution of the Bookmarking function, starting with the user flow below.
Here, I considered the complexities required of the Bookmarking function. Where would bookmarking appear? What tools and controls do users have? What methods do they have for retrieval? What is the definition of bookmarking?
Here, I considered the complexities required of the Bookmarking function. Where would bookmarking appear? What tools and controls do users have? What methods do they have for retrieval? What is the definition of bookmarking?
User flow and actions that can arise during the Bookmarking interaction
Journey Mapping
Following the Yellow Brick Road
I also created a journey map to evaluate a user's touchpoint within Happy Hour, identifying the different stages a user would take to progress through Happy Hour. By breaking down the process of content consumption, it provided an analytical overview that illustrates the resources and control a user has at each point to complete their journey.
User journey depicting the touchpoints through Happy Hour
Mid-fidelity prototype
From concept to first design
I was able to conceptualize the user flow and journey map into a series of five mid-fi (medium fidelity) screens for Bookmarking. For efficiency, Bookmarking can be initiated any time they see an article. This interaction keeps the feature fluid, so users can perform the action with respects to what they're doing, without having to break focus and dive deeper.
When a user clicks on the Bookmark icon, a pop-up appears for users to save the article. Clicking on the dropdown next to 'Save Article' will swap the layout for existing folders, while clicking the '+' will trigger the ability to create a new folder.
When a user clicks on the Bookmark icon, a pop-up appears for users to save the article. Clicking on the dropdown next to 'Save Article' will swap the layout for existing folders, while clicking the '+' will trigger the ability to create a new folder.
Wireframes for the Bookmarking flow
Iterating for improvements
Conducting usability testing rounds
To test this user flow, I recruited six potential Happy Hour users for a usability test, measuring their interaction with benchmarks that utilized time-spent and number of clicks to determine their success. Their goal was to find an article of their choosing and bookmark it to folder titled 'Emotional'. With the data I collected, I would compare it against the minimum amount of time and actions needed to complete the task.
Usability results from testing the Bookmarking interaction
While my users were successful in their endeavors, there were mixed results where participants expected a different interaction response. A few had the idea that simply clicking the icon would complete the interaction of Bookmarking. On the other hand, others had found the display of previous articles in the pop-up distracting and confusing.
How could I fix these mismatched expectation to meet with users who do value a the organization and customization of the existing interaction? To remedy this, I improved the logic of the bookmarking flow by prioritizing the expected outcome as the dominant result. Below shows the improved flow, where greyed out screens remain unchanged.
How could I fix these mismatched expectation to meet with users who do value a the organization and customization of the existing interaction? To remedy this, I improved the logic of the bookmarking flow by prioritizing the expected outcome as the dominant result. Below shows the improved flow, where greyed out screens remain unchanged.
Improved wireframes for the Bookmarking flow
To implement levels of organization, the Bookmarking interaction was also split into two forms to distinguish the control behind the feature. First, a quick tap on the Bookmark button would simply save the article. To contrast, a long-press would trigger the 'Select folder' rather than 'Save article' screen. All in all, the second screen was replaced to create consistency in the overall logic of the bookmarking process.
In practice, this would also need to be remedied with a first-time prompt that clues users into this power-feature as it cannot be expected that each user would perform a long-press for interactions without prior indication. This circumstance was added as the sixth screen.
In practice, this would also need to be remedied with a first-time prompt that clues users into this power-feature as it cannot be expected that each user would perform a long-press for interactions without prior indication. This circumstance was added as the sixth screen.
High-fidelity prototype
Introducing Happy Hour
After implementing the suggestions from the mid-fid prototypes, I moved the designs into hi-fi (high fidelity) before conducting another round of tests. In the end, there were a total of three design rounds and three user testing rounds. Below are the final results!
Onboarding
The opening screens begin with a one-time kickstart to personalize content to a user's liking. It was important to give way on how quick their onboarding should be with a skip option. If happiness is in dire need, it should be delivered stress-free!
The opening screens begin with a one-time kickstart to personalize content to a user's liking. It was important to give way on how quick their onboarding should be with a skip option. If happiness is in dire need, it should be delivered stress-free!
Exploring
Our users wanted diverse media formats, so I organized different content in an accessible manner through the toolbar. It is available from almost all screens on the app, so no news format is far from reach.
Our users wanted diverse media formats, so I organized different content in an accessible manner through the toolbar. It is available from almost all screens on the app, so no news format is far from reach.
Bookmarking
Articles can be saved for later and can be organized into folders. It was vital to create an opportunity for users to easily and quickly bookmark without having to hop into the article first.
Articles can be saved for later and can be organized into folders. It was vital to create an opportunity for users to easily and quickly bookmark without having to hop into the article first.
Commenting
As users noted, news media platforms often miss the mark on social spaces. The button to open the Comments section was moved to the top nav, so users can share their thoughts and discuss with others, no matter how far down the article they are.
As users noted, news media platforms often miss the mark on social spaces. The button to open the Comments section was moved to the top nav, so users can share their thoughts and discuss with others, no matter how far down the article they are.
Sharing
Happy Hour provides various options for sharing news articles, so senders and recipients aren't bound to the app. Happy news deserves to exist everywhere!
Happy Hour provides various options for sharing news articles, so senders and recipients aren't bound to the app. Happy news deserves to exist everywhere!
Citations
To support best practices for credible journalism, the author and contributor roles are listed at the end of each article. Citations are also displayed to support the credibility and sources of the reporting as needed. This brings forth more practices for disseminating news instead of social media buzz.
To support best practices for credible journalism, the author and contributor roles are listed at the end of each article. Citations are also displayed to support the credibility and sources of the reporting as needed. This brings forth more practices for disseminating news instead of social media buzz.
Reflections
To pull at the threads discovered along the way
Although Happy Hour was a huge undertaking being a solo-project from its ideation to execution, there was a pivotal moment in the research stage that I could've capitalized on, which could've made for a really interesting but undoubtedly different outcome.
In the end, I realize that I had created any news app, especially when I had to utilize borrowed content. But as I was reading through the headlines I had in the prototype, it made me realize that content heavily dictates the vibe of Happy Hour.
In my research, respondents concerned themselves with the credibility of news pieces, and that was something to press further on. What does credibility look like to them and how is that supported through the media they consume? Is it the practices behind the journalism methods? What design patterns could I have implemented further or created to foster credibility?
It is not uncommon for media outlets to be oriented somewhere on the political spectrum. There may have been an opportunity to create designs that help with transparency - a system that shows where the Author sits on the spectrum, social proof and accolades, community-voting on content accuracy - things like that.
That being said, although the concept could use improving, I don't think I failed at the project. I did implement what the research informed, although I do find that the premise of "positive, uplifting news" really hinges on the content instead of design, so I definitely fell short with the conceptualization and not realizing there should be more of a design element to fulfilling that need.
All in all, this project really shows me how vital it is to ask the right questions in research and it makes for an interesting thought exercise that there was a tiny thread I could've pulled at to unravel a much different project!
In the end, I realize that I had created any news app, especially when I had to utilize borrowed content. But as I was reading through the headlines I had in the prototype, it made me realize that content heavily dictates the vibe of Happy Hour.
In my research, respondents concerned themselves with the credibility of news pieces, and that was something to press further on. What does credibility look like to them and how is that supported through the media they consume? Is it the practices behind the journalism methods? What design patterns could I have implemented further or created to foster credibility?
It is not uncommon for media outlets to be oriented somewhere on the political spectrum. There may have been an opportunity to create designs that help with transparency - a system that shows where the Author sits on the spectrum, social proof and accolades, community-voting on content accuracy - things like that.
That being said, although the concept could use improving, I don't think I failed at the project. I did implement what the research informed, although I do find that the premise of "positive, uplifting news" really hinges on the content instead of design, so I definitely fell short with the conceptualization and not realizing there should be more of a design element to fulfilling that need.
All in all, this project really shows me how vital it is to ask the right questions in research and it makes for an interesting thought exercise that there was a tiny thread I could've pulled at to unravel a much different project!
The collection of all the wireframes between mid and high-fidelity
© jeffrey chan, 2025.