top of page

KUOW Mobile Experience Redesign

KUOW is a media organization based in the Pacific Northwest, recognized for its dedication to delivering high-quality news and content to its audience. With a commitment to serving diverse communities, KUOW engages with a wide range of topics, from local stories to global events, fostering informed conversations and connections throughout the region.

​

In this UX portfolio case study, my team and I were tasked for our senior capstone to redesign the KUOW mobile app, with a focus on retaining current users and attracting a younger, more diverse audience in the Pacific Northwest (PNW) region. The ultimate goal was to position KUOW as a relevant, engaging, and inclusive platform for news and community interaction, tailored to the preferences of both current and potential users.

Introduction

“How might we reimagine the KUOW mobile experience to retain existing users and attract younger, more racially diverse users in the PNW?"

KUOW, WA

Research

Planning

During the HCDE 492/HCDE 493 courses at the University of Washington, my team and I delved into a senior capstone experience spanning two quarters, immersing ourselves in real-world problem-solving. The structured framework of HCDE 492 provided a guide to shaping our rigorous planning process with well-defined milestones and ethical considerations. This framework paved the way to deliver actionable solutions for KUOW during the subsequent phase.

​

In adherence to the HCDE 492 requirements, our strategy was charted with significant milestones that set the stage for our user-centered design process. From crafting initial email correspondences with our sponsor at KUOW to formulating project summaries and generating probing questions, each step was carefully orchestrated. Domain research, a meticulously outlined team contract, and a comprehensive project map featuring design questions, contextual analysis, methods, and rationale formed the foundation for the project. The culmination of this planning was encapsulated within a comprehensive project plan document, similar to a product requirement document (PRD), detailing deliverables, timelines, and resource allocation.

​

Our strategy, deeply rooted in meticulous research, user interviews, and robust usability testing, encompassed a dual-pronged approach. The first facet involved a transformation of the mobile app's interface, reimagining its design to meet our client's needs and the modern standards of aesthetics. Concurrently, we explored non-app solutions, recognizing the multifaceted nature of our sponsor's goals.

Project timeline

Our proposed timeline

Previous Research

In preparation for our research, we conducted a review of a previous team's research on user engagement with KUOW. The objective of their work was to revamp the KUOW mobile application to cater to a broader and more diverse audience. Their research encompassed two primary questions.

​

  1. How could the app attract and engage a younger, racially diverse demographic (ages 14-29)?

  2. How could it cater to the typical NPR audience (ages 35-55)?

​

The previous team's research spanned secondary investigations, involving scrutiny of app store reviews, a heuristic evaluation, and a SWOT analysis. The reviews unveiled instances of confusion concerning app organization and user interface. While the heuristic evaluation identified issues related to consistency and content presentation. A SWOT analysis suggested opportunities to enhance visual hierarchy, information architecture, and iconography. 

​

Subsequently, the previous team conducted user interviews, unveiling preferences for streamlined interfaces, selectable topics during browsing, personalized content, and diverse sources. Upon reviewing their research, we adopted their insights to guide our design phase. 

Literature Review

In our preliminary domain research, we formulated a hypothesis that the interaction between news and news-like content on social media shapes the news-seeking behaviors of young audiences. Expanding upon this notion, we read and analyzed eight scientific papers, which illuminated three overarching themes concerning the engagement of young individuals with local news.

​

  1. Noteworthy research by Gil de Zúñiga et al., Boczkowski et al., and Park and Kaye revealed a nuanced interplay between incidental news exposure and the perception of news finding its audience. While some studies indicated a reduction in active news-seeking due to the "news finds me" perception, others reported heightened engagement with news on social media. 

  2. Schwaiger et al.'s study emphasized that despite the limited use of conventional media, young adults value credible journalistic news and often engage with topics on social media, promoting meaningful conversations. Estonian young adults were found to appreciate news on social media or from influencers for its immediacy and simplicity. 

  3. George and Hogendorn suggest leveraging the advertising capabilities of the Internet, particularly through geo-targeted aggregators, to enhance local news consumption. While most of the studies we examined were conducted outside the US, we planned to validate their relevance through user interviews, ensuring alignment with the attitudes and habits of KUOW's target audience. 

Competitive Analysis

To better understand what aspects made a news media organization successful, we conducted a competitive analysis, examining competitors within their mobile apps and their corresponding websites. KUOW's existing user base exhibited comparably higher ratings on the app store when juxtaposed against its sibling non-profit NPR station applications. Conversely, platforms of larger stature, boasting a diverse array of content, have cultivated expansive user bases, leveraging their platform to promote their offerings. Our analysis unveiled a noteworthy distinction—while KUOW garners favorable attention for its playlist features and commendable reviews, it lags behind in certain areas, notably the absence of offline listening capabilities and personalized recommendations.

Competitive analysis sheet

The sheet we used to track competitor statistics

It's important to note the intricacies in deciphering KUOW's user base dynamics, given the variable geodemographic factors. The nonprofit nature of KUOW and its reliance on donations was often linked to a comparatively smaller user base and negative reviews. In contrast, profit-oriented models frequently had subscription-based models.

Recruiting

We sought out individuals spanning various age groups, with a particular emphasis on engaging younger, under-30 demographics to align with KUOW's target audience. Leveraging both sponsor resources and personal networks, we found a participant pool that encapsulated the vibrant spectrum of potential KUOW users. By ensuring inclusivity and representation, we aimed to extract insights from these participants, enriching our understanding of their preferences, challenges, and aspirations. 

User Interviews

We engaged in eight user interviews from both younger demographics, aged 18-29, and more seasoned individuals over the age of 30. Our interview structure was divided into two parts, a generative interview portion and a usability test. This was done to complete two objectives—gain insights into users' news consumption habits and uncover design improvements for the app.

​

Upon the completion of the interviews, a review of the interview notes ensued, paving the way for affinity mapping. This facilitated the categorization of the diverse insights into coherent themes, enabling us to unearth patterns in the dataset.

Affinity mapping

Generative interview themes

In our generative user interviews, several key themes emerged that shed light on users' preferences and behaviors regarding news consumption and engagement.

​

  1. App Variety and Convenience: Participants engage with a variety of applications, spanning both traditional news outlets and social media platforms, to aggregate news content. The convenient nature of social media appeals to users, offering a means of efficient news delivery and fostering interactions within a community.

  2. Personal Impact and Community Connection: News consumption is driven by a preference for content that aligns with individual interests. Credibility is strengthened by endorsements from family and friends.

  3. Balancing Simplicity and Depth: Users exhibit a preference for news content characterized by its simplicity, avoiding intricate terminology and embracing diverse formats such as audio and transcripts. Engaging headlines and events stimulate users to delve deeper into news stories, driving them to seek additional information from trusted sources.​

  4. Customizable Notifications and Engagement: Some participants favor frequent updates through notifications while others seek more profound and structured engagements.

  5. Complex Trust in News Sources: Credibility is intricately tied to adherence to journalistic standards, meticulous fact-checking, transparent source citations, and the avoidance of clickbait content. The weight of credibility is further bolstered by reputation. 

Usability Tests

During our usability testing of the existing KUOW app, we gained insights into areas for improvement that can enhance user experience and engagement. The findings revealed several key themes.

​

  1. Enhancing Convenience and Efficiency: Potential users communicated their desire for enhanced convenience through additional features, notably the inclusion of functionalities that allow for previewing multiple photos, effortless image-swiping, and seamless access to captions and descriptions without the need to navigate into the content. ​

  2. Optimizing UI Formatting: ​Participants consistently drew attention to issues related to readability that significantly impacted their overall experience. These challenges encompass lengthy articles featuring small text, articles with cramped margins, and an abundance of white space surrounding article names. Additionally, a noteworthy concern centered around the placement of the subscribe button, which disrupted the natural flow of the page. 

  3. Prioritizing Accessibility and App Structure: ​Participants notably stressed the importance of integrating an accessible reader function and implementing a dark mode option, catering to users who require different reading environments. Furthermore, participants brought attention to the necessity of providing alternative text and captions, specifically targeting users with visual impairments. 

  4. Addressing Visual Design and Content Consistency: ​Participants revealed banners that resembled advertisements, which contributed to a sense of uncertainty among users. One area that generated confusion was the perception of the Mixtape feature. Participants found it unclear and raised questions about its purpose. Furthermore, observations were made regarding the presentation disparities between podcasts and articles.

Affinity mapping

Usability test themes

Design

Personas

Based on research insights, we observed the following behaviors were most common, which guided the creation of three personas.

​

  1. News seeking vs. News finding: Some people actively stay updated with news, tuning into their favorite sources every day; while others prefer that news that comes to them, through friends or social media.

  2. News aggregation vs. News curation: Some people only get information through one channel or platform due to convenience, while others prefer to access news through multiple platforms.

  3. Credibility: Users defined credible sources as those trusted by their friends/family, and by how the brands presented themselves, cross-examination, or proof through citations.

 

These personas represent major user types on which we focused our redesign and user flows upon.

Generated personas

Information Architecture

Guided by the insights from our research phase and informed by our understanding of user paradigms, we began to reshape the app's core structure with a focus on enhancing usability, engagement, and seamless interaction.

Information architecture

Our information architecture flow

User Journey

A user flow diagram was created to represent the largest features and interactions of the app and interactive prototype. This diagram represented a guide to how users were expected to interact with the app and its functions, ensuring the creation of a seamless, efficient, and intuitive experience. 

User flow

The mobile app user flow chart

Wireframe

In the process of developing our app prototype, the creation of low-fidelity wireframes played a crucial role in visually defining the information architecture. However, it's important to note that our design system from the sponsor had recently been received at the time, so we could not integrate KUOW-designed colors, icons, and buttons throughout. 

Whiteboarding

Sketched initial screens on paper

We began to establish our own standardization for fonts, elements, buttons, and hierarchy. As our to-be-substituted design system continued to evolve, we would then transition elements to their corresponding counterparts, coinciding with the delivery of the KUOW design system during our sponsor meeting on April 27th. In the process of creating wireframes, we made the following changes.

​

  1. Login Description and Rationale: The login process enhanced personalization by enabling users to create profiles, select interests, and engage with creators. Tailored news feeds based on chosen categories were aimed to boost engagement, while profiles were to foster community interaction.

  2. News Description and Rationale: A search bar and a sort-by button were added to the news page to streamline content discovery. Interactive elements like polls, quizzes, and games were also added to engage users. Navigation improvements like a scroll to the top button on articles cater to the accessibility findings from usability testing.

  3. Live Radio Description and Rationale: The live radio section now features a consistent "Now playing" window and introduces video clips for sharing on platforms like TikTok and Instagram, incorporating familiar features from popular media platforms.

  4. Podcast Description and Rationale: Similar to the news page, we enhanced podcasts with search, filters, and author contact options. Offline listening is now possible through content downloads. These enhancements align with users' preferences for easy content access, community interaction, and offline availability observed during our research.

  5. Profile Description and Rationale: The profile section offers customization options, allowing users to adjust notifications, interests, and accessibility preferences like dark mode.

Screens on figma

Early login wireframe

Non-app Prototype

While brainstorming how we could redesign the app, we also wanted to explore other avenues for addressing KUOW’s issue with low audience engagement with younger and racially diverse groups.

Brainstorming new ideas

Mind mapping based on research

With our knowledge of the younger demographic, such as their desire to have news come to them rather than searching for it themselves and to have all of their content in one space/app, we decided to reexamine KUOW’s presence on popular platforms such as Instagram and TikTok.

Their Instagram page (not including their reels that are repostings of their TikToks) feels outdated. The Instagram Explore page is recommended to users depending on who they follow, their likes, and who they are connected with. Though KUOW may have little control over who a user follows and connects with, we noticed they could try to increase the likes they receive on their posts to improve findability on the app. This would satisfy user's desires to have content come to them. Thus, there was an opportunity to rebrand the profile and improve marketing, so we experimented with a few ideas. 

Social media redesign

KUOW’s current Instagram v.s. possible Instagram posts to encourage consistency and likes.

Test

A/B testing of the old and new versions of the app and non-app solutions

Affinity mapping usability insights

Affinity map of our testing findings

App Prototype Results and Changes

​In this phase, we conducted usability testing and A/B testing on our updated app prototype and social media designs. We iterated on our app design based on testing insights, focusing on live radio, news feed, and interest customization. We engaged 6 participants and found a few usability issues. 

​

  1. Aesthetic and Feedback changes for Login and Onboarding: Participants found the login process intuitive, but the interface appeared dull with excessive white space (noted by 3 participants). We addressed this by adding a colorized logo, changing button colors to teal for KUOW branding consistency, reducing white space, and enlarging touch targets. To enhance the password creation process, we introduced a dynamic checkmark ('x' for errors) while typing, improved error messages in red, and added social media icons for alternative sign-in options. Regarding privacy, participants' preferences were considered: We enabled registration with phone or email (1 participant), an option to skip interest selection (1 participant), and provided detailed explanations for data collection (1 participant).

  2. Visual Improvements for News Feed: We identified that while a few participants exhibited a preference for the original design, they also displayed keen interest in the newly added features. In response, we enhanced the presentation of news articles and introduced a clear distinction using card components. Furthermore, we optimized the viewing experience of articles by incorporating images, headers, and listen buttons, streamlining the information display. Incorporating input from another participant, we focused on refining the visual aesthetics by reducing margins and white space, leading to a more balanced layout. We tackled the challenge of interacting with articles and contacting authors. To streamline the process, we modified the dedicated icon and made navigating accessible by clicking directly on the author's name.

  3. Fostering Intuition on Live Radio: We implemented several adjustments to enhance the Live Radio section's user experience. Notably, we relocated featured clips to the newsfeed section, addressing participant feedback that found their placement incongruent. Responding to user preferences, we replaced the "Listen Live" icon-style button with a more visually distinct and clickable button, a change suggested by two participants. Additionally, we optimized the user interface by updating the progress bar and buttons to better reflect the live listening experience.

  4. Added Organization on Podcasts: This section underwent testing exclusively within the A/B testing component of our study. We implemented the following optimizations: We enriched the imagery by incorporating more diverse podcast options, elucidating the differentiation between various sections featuring distinct podcasts. This change was prompted by feedback from two participants who encountered confusion due to similar images in each section. To enhance user convenience, we moved the "New Episodes" section to the foremost row, a modification influenced by a participant's preference to have immediate access to new content. We eliminated the "From KUOW" segment, as three participants found it perplexing, assuming that all app content originated from KUOW. Additionally, we introduced a "continue listening to" section to facilitate swift retrieval of previously accessed content. 

  5. Aesthetic Improvements on Profile: To address usability concerns, we enlarged the touch targets associated with interest selection that previously hindered mobile interaction. Responding to participant feedback, we revised the color scheme of selected interests to a darker teal shade, addressing concerns about visual differentiation between default and selected states. Furthermore, we aligned the design of the donate button with KUOW's established style guide, ensuring cohesiveness across the interface. 

Interactive version of our app

Non-app Results

Through our non-app solution evaluation, we addressed participants' feedback on the redesigned Instagram posts. They expressed concerns about excessive text and a need for more visual content. Our A/B testing indicated that the previous version with larger images and prominent headlines was popular, but some perceived it as untrustworthy. To strike a balance, we enhanced headlines, introduced more images, and integrated small topic tags. This approach aimed to create a cleaner, modern, and consistent design. Posts now prominently feature headlines,  accompanied by captivating photos or infographics, while small topic tags provide quick categorization.

Redesign Instagram posts

Refined social media posts

Evaluation

Presentation

After finalizing our designs, we created a poster for the capstone showcase organized by the HCDE Department at the University of Washington. During the showcase, we had the unique opportunity to present our project and pitch our design to a panel of judges. The poster not only facilitated our presentation but also provided a representation of our efforts, contributing to the broader dissemination of our design and its potential impact.

Final posterboard

Presentation poster

Video Prototype

In addition to the final poster, I produced and filmed a video prototype for the app. The video prototype served as a powerful communication tool when presenting our project to stakeholders, including KUOW and the panel of judges during the capstone showcase. It enabled us to effectively convey the core concepts of our redesign, showcase the impact of our design decisions, and capture the essence of the user experience improvements we proposed.

A video I produced showcasing our newly designed KUOW app

What I Learned

​During the 6-month capstone project, I learned invaluable skills that I hope to use in my work. Not only did the project refine my technical abilities but also nurtured a deep understanding of the impact UX design can have on user experiences and the broader digital landscape.

​

  1. User Research Techniques: Through conducting user interviews, concept tests, and usability tests, I learned how to gather valuable insights directly from users. Analyzing their preferences and behaviors allowed me to understand their needs and motivations, shaping the design decisions.

  2. Persona Development: Creating personas based on interview insights taught me how to distill complex user behaviors into relatable characters. This process helped me design with empathy, ensuring that the app's features catered to different user preferences.

  3. Design Rationale: Documenting design changes supported by usability testing insights enhanced my skill in explaining design decisions to stakeholders. This practice taught me to justify choices with user-centered rationales.

  4. Project Management: Overseeing project phases, including research, design, testing, and documentation, strengthened my project management skills. This experience enabled me to meet deadlines and achieve project objectives efficiently.

  5. Real-World Application: Applying UX principles to address KUOW's challenge provided me with a practical understanding of how design impacts real-world issues. It taught me how to create solutions with tangible impact.

  6. Feedback Integration: Incorporating user feedback-driven changes into design iterations enhanced my ability to adapt and refine solutions based on user input.

  7. Iterative Mindset: Continuously refining features like the login process, news feed, and podcast page taught me the value of iteration in design. This mindset allowed me to enhance designs through continuous improvement.

bottom of page