As the digital leader of hyperlocal news, Patch delivers everything local from news to events to neighbor posts. My role, as a Product Design Intern at Patch, has been to collaborate with two Product Managers, two Software Developers, and one Product Designer, primarily focusing on the responsive web design of Patch’s Core Product features. I used Figma, Hotjar, and Delighted to make design decisions and execute design solutions.

 The Challenge

How might we build and maintain diverse communities via digital hyperlocal news delivery?

The Situation

As mainstream media mourns the downfall of local news, Patch continues to improve upon a newsroom product that centers diverse human experience. At Patch, every design task starts with a problem statement validated by user research. As a design team, we perform user research through various methods, including but not limited to surveys, use cases, heatmap analysis (first click testing), and user interviews. After analyzing this user feedback, we rapidly ideate design solutions within the scope of business requirements, technical constraints, and design considerations. A particular design consideration is that our target audience is generally older, ranging upwards from 45 years old, which requires more attention to sizing, contrast, and captioning.

The Problem

How might we identify critical user pain points to prioritize design team efforts and tasks?

The Task

Before my arrival, the design team identified broader themes from recurring feedback to properly prioritize and diagnose problem statements into a comprehensible affinity map, pictured below.

 Out of the six most frequent user problems identified, my work focused on the following:

• I get too many emails from Patch.

  • Task: Investigate user behavior on the email subscription page and make design recommendations

• I didn’t get enough leads from my post/ad.

  • Task: Analyze user interviews and re-design the newly launched feature, business posts

• The site is hard to navigate.

  • Task: Consolidate existing site structure and features into a lean, easy-to-understand design system that can support a unified newsfeed

 The Ideation

How might we translate user feedback into solutions that meet or exceed user expectations while balancing business requirements?

The Task

Investigate user behavior on the email subscription page and make design recommendations

The Action

Using Hotjar, I launched a heatmap to track clicks, engagements, and navigation activity on the email subscription page for up to 1,000 page views. I also researched similar newsroom products such as OZY News, the Skimm, National Public Radio (NPR), the New York Times, and more.

 What does any of this mean? Users are looking for a way to unsubscribe from all Patch emails, probably because they are frustrated by email frequency. Users are mostly unchecking options in the “Notifications” section, which does not control email volume and might be misleading users with unclear language. Users might also prefer to interact with the “Notifications” section because it offers less options, presenting less cognitive load. 

Finally, imagine being a frustrated user that just wants to clear a cluttered inbox and has been complaining about Patch emails for months. You scroll to the bottom of your most recent Patch email, tap the line “To update your email preferences, click here,” and you are brought to the email settings page in question.

 You are presented with the option to receive one-per-day. You might realize you like some of Patch’s emails but not all of them so you keep scrolling. You spend about 1 minute checking and unchecking your preferences but once you’re done, you have to scroll to the bottom of the page to click “Save Settings.” You may not know that, so you might leave the page thinking that you’ve successfully unsubscribed. Ouch. Or you may know to click “Save Settings” but as you scroll to the static button, you notice the option to completely unsubscribe is only a few pixels away. So you choose to unsubscribe altogether and voila - no more emails! 

But as a Product Designer, I understand that 33% of our core product relies upon email subscription as it builds habitual, user loyalty and contributes towards controllable traffic so we don’t necessarily want our users to unsubscribe. What’s a designer to do?

 The Result

I hypothesized that cognitive load might be playing a large role in user behavior for email subscription. Having three “or” options with many more nested options can feel overwhelming, especially to an older target audience. To reduce cognitive, I advocated for making the one-per-day option a modal window as the first step in the funnel and providing clear interaction options.

- Click “Yes” to agree to receive one email per day with the top stories from Harlem
- Click “Continue to update your email preferences,” pretty self-explanatory
- Click close icon to bail, Jakob Nielsen’s Heuristic #3: User control and freedom

 To reduce decision fatigue, I proposed converting subscription options into dropdown menus with two tap targets: one for checking/unchecking and another for expanding/collapsing to view additional options. The tap target sizes were mindfully adjusted to accommodate an older audience (and larger fingers), sacrificing real estate for accessibility.

 To reduce the likelihood that a user would decide to unsubscribe entirely without further frustrating the user, I recommended an ever-present, floating “Save Settings” button, as seen in other newsroom subscription flows (See: NPR, New York Times, OZY). I would’ve prototyped the entire process but that would’ve taken about 256 screens, so below is an abbreviated version!

 The Conclusion

How might we measure success for design iterations?

As Patch continues to grow and iterate upon their hyperlocal newsroom product, design updates need to be prioritized in a sprint cycle. Patch hopes to ship this feature by the end of Q1. Once the email settings page is updated, the design team hopes to launch another heatmap to identify any impact on traffic or engagement.