💌 Newsletter Redesign
Overview
While supporting Business.NJ.gov, I redesigned the newsletter to align with the site’s visual style and improve readability. The updated design introduced a clean, accessible layout, resulting in a 3× increase in engagement and reaching over 250,000 users.
- My Role: Lead Product Designer
- Timeline: 2 weeks
- Tools Used: Figma
Framing the Challenge
Problem
The Business.NJ.gov newsletter did not match the rest of the site’s visual styling and lacked key formatting needed for users relying on assistive tools.
Pain point #1
Inconsistent branding and layout made the newsletter feel disjointed from the core platform.
Pain point #2
Layout and structure created friction for screen reader users, impacting comprehension and navigation.
Hypothesis
Aligning the newsletter’s structure and style with the Business.NJ.gov design system, and optimizing it for readability, would improve user trust, comprehension, and engagement.
Goal
Update the Figma design system so there is no design debt, and collaborate with developers to ensure alignment with production features.
Process & Approach
Discovery & Audit
- Reviewed the existing newsletter layout, interaction patterns, and structure.
- Compared newsletter design against Business.NJ.gov’s visual standards and accessibility expectations.
Design
- Created a new, flexible layout template that matched the site’s typography, color palette, and visual style.
- Focused on structure and hierarchy to make content scannable and screen reader-friendly.
- Delivered responsive designs that translated cleanly across devices and email clients.
Implementation
- Provided annotated mockups and content structure recommendations for development handoff.
- Advised on best practices for email accessibility and responsive formatting.
Challenges & Solutions
Challenge #1
The newsletter felt disconnected from the Business.NJ.gov website.
Solution #1
Redesigned layout and components to directly reflect the visual styling of the site, creating brand cohesion.
Challenge #2
Content structure created difficulties for users with assistive technology.
Solution #2
Applied semantic structure, clear headings, and logical reading order to support screen reader navigation.
Outcomes
"Congratulations team! The newsletter redesign resulted in tripling the newsletter's engagement rate! Congrats!" - Product Data and Analytics Lead for Office of Innovation
Deliverables
- High-fidelity, branded newsletter template in Figma
- Accessibility-aligned layout structure and handoff documentation
Results & Future
- Engagement rate tripled after launch
- The newsletter now reaches over 250,000 users with a more consistent, usable format
- Created a design foundation for future content campaigns and communications
- Template now serves as a reusable system for other email communications tied to Business.NJ.gov initiatives
Key Takeaways & Learnings
Email is part of the product experience
Aligning visual systems across platforms reinforces trust and recognition
Small changes scale fast
A two-week design sprint led to measurable increases in user engagement and reach
Structure matters
Structure matters: Clear content hierarchy and reading order improved usability for all audiences, including those using assistive tools