Verywell @ Dotdash Meredith
Verywell Structured Content Templates
Verywell is an award-winning health website with 300 Million annual reader that provides trusted health information when you need it most. Verywell’s brands including Health, Mind, Family, Fit.
Timeframe2019 - 2021
My ResponsibilityUX design
Visual design
Prototyping
User testing
Design handoff
Dev & QA support
Illustration guidanceWork closely withHetal Rathod (former Design Director)
Mark Lewis (Senior Director, Product)
Dylan Wolter (Product Manager)
Verywell Dev Team
Verywell Editorial Team
SEO Team
Visual Asset Team
Freelance Illustrators
ContributionAs a UX/UI designer, I conceptualized, designed, and iterated on user experiences for the fourth US largest ad-supported health information site.
LaunchedVaccine Hub
As the lead designer, I drove the creation of vaccine hub and its content reaching 3 million people, a gap that didn't exist pre-November 2019. I tackled the research, design, and tech implementation, with a special focus on solving tricky 'journey' issues causing confusion.
Partially LaunchedVerywell Health Drugs and Supplements - SERP and Glossary
Optimize the search experience on Verywell to prioritize drugs content while maintaining access to our full range of content for user search queries.
LaunchedGlobal Exposed Navigation
The objective is to showcase all core content competencies to help desktop users understand the site's content structure and purpose. From September 29 to November 5, 2020, there was a 14.22% increase in header clicks for Health, 35.71% for Mind, 86.87% for Family, and 22.98% for Fit. Conversely, there was a notable decrease in clicks on the fullscreen navigation.
LaunchedFooter Revamp
I revamped the footer layout to accommodate a medical disclaimer request. Working closely with frontend devs, I tested a grid layout for better flexibility and responsiveness, resolving text-breaking issues and improving spacing. QA praised the project for its flawless execution.
LaunchedDocument Navigation
I redesigned document page navigation to prevent user confusion and accidental clicks. User testing showed a 95% increase in TOC clicks on desktop, and 24% on mobile and 17% on tablet, successfully mitigating confusion between TOC and journey options.
LaunchedHomepage Redesign
I led the redesign and color change of the Verywell homepages, from exploration to tech implementation. We saw a 20% increase in traffic since its release on February 14, 2020.
LaunchedNews Template
A template was built due to the increasing demand of news content.
LaunchedVerywell Mind Awards
Yearly awards to announce the best online mental health services.
LaunchedVerywell Health Divide
Special health release for BIPOC.
Design systemDesign System Setup
I spearheaded the development of our design system, serving as the single source of truth for our team. This ensures consistency across our organization, preventing visual misalignment and streamlining communication and asset delivery.
Visual designCommerce Composite Template
I crafted photo composite templates for product articles in commerce, experimenting with different backgrounds and product placements. I created detailed guidelines to ensure consistency, as freelancers would handle mass production once the templates were handed off.
CollaborationOptimization of Design Handoff
I observed inconsistencies in our design handoff process, resulting in increased QA work. To address this, I proactively customized our design handoff to better suit developers' understanding and workflow, reducing errors and streamlining the development process.
“Xiaoyu’s done a great job partnering with the developers on the team in getting them the specs and necessary files to begin new feature-build.”
CollaborationFigma Workshop
I organized a Figma workshop to facilitate the transition from Sketch and Zeplin. This enabled developers and PMs to become proficient in using Figma's interface and inspection tools for more efficient design handoff.
“Xiaoyu has identified areas of improvement to make the design/developer handoff process more efficient by suggesting to do a Figma workshop catering to the developer’s needs.”
CollaborationImage Templates & Creative Brief
I developed image templates with built-in cropping and requirements, accompanied by a detailed spreadsheet containing examples, links, templates, and annotations. I led the creation of a creative brief to streamline communication between editors, designers, and illustrators. These resources are easily shareable across our teams and a freelancers, reducing confusion and communication efforts.