Full-Site UX & UI Redesign
A full-site UX redesign for a nonprofit media platform, improving navigation, responsiveness, and design consistency through a scalable design system.
This project involved reimagining the digital experience for Fair Observer, a nonprofit media platform with a global voice. I collaborated with editors, developers, and stakeholders to uncover structural issues in content discovery, then led the redesign of key templates to better serve diverse reading behaviors. From building a responsive component library to reorganizing the site architecture, my focus was on creating clarity, cohesion, and a design system that could evolve with the platform’s mission.
Fair Observer is a nonprofit media platform that publishes analysis and perspectives from around the world. Despite its valuable content, users struggled to navigate the site and discover articles. The structure was cluttered, article tagging was inconsistent, and the design was not responsive across devices. This created a disconnect between the platform's mission and its user experience.
Improve navigation and information architecture to increase content discoverability
Redesign key templates (homepage, article pages, navigation, login flow)
Build a responsive experience across desktop, tablet, and mobile
Create a design system for consistent, scalable development
Align the UX with the platform’s mission of accessibility and diverse storytelling
🧠 Site Audit & Analytics
Used Google Analytics and heatmaps to identify pain points in the user journey. Found high drop-off rates on the homepage and category pages. Users frequently exited after failing to find relevant articles.
🧠 Stakeholder & Editorial Input
Interviewed internal stakeholders, including editors and content leads. Identified editorial needs, content priorities, and technical constraints that would shape the IA and content prioritization.
🧠 Competitive & UX Heuristics Review
Analyzed similar nonprofit and media sites to identify best practices around navigation, search UX, and content density.
✨ Empathize & Define
Mapped the current sitemap and user flows.
Defined key user personas: curious readers, researchers, and casual browsers.
Prioritized simplification of site structure and surfacing relevant content.
✨ Ideate & Wireframe
Sketched and prototyped new layouts for homepage, navigation bar, login flow, and article pages.
Introduced a horizontal category nav and restructured content blocks based on user data.
✨ Responsive Design
Created adaptive layouts in Figma to ensure a consistent experience across breakpoints.
Simplified long-form article pages to reduce visual fatigue and improve scannability.
✨ Design System
Built a reusable component library in Figma with consistent styles, grids, and interactions.
This enabled the team to speed up iteration and developer handoff.
✨ Collaboration
Worked closely with developers, editors, and interns.
Used Confluence and Jira to manage tasks, document flows, and centralize feedback.
Built a scalable design system with 80+ reusable components
Improved visual hierarchy and navigation clarity across all major templates
Enhanced responsiveness and accessibility across desktop and mobile devices
Stakeholders reported stronger alignment between UX and editorial goals
Estimated reduction in bounce rate and improved article engagement (to be measured post-launch)
This project pushed me to balance editorial complexity with UX simplicity. With limited engineering resources, I focused on scalable, low-lift solutions that could meaningfully improve the user journey. I also learned how to navigate cross-functional feedback while advocating for research-driven decisions. Leading both design and systemization efforts has sharpened my eye for structure, accessibility, and long-term impact.