Alight Solutions is a global, cloud-based human capital technology and consulting firm that helps large organizations manage employee benefits, health, wealth, and wellbeing. It delivers services such as benefits administration, leave management, and financial wellness—simplifying complex HR processes for both employees and employers.
Assist with the rollout and implementation of design layouts across multiple areas of Alight Solutions, supporting cohesive and consistent user experiences.
From initial paper sketches to low-fidelity wireframes and fully crafted high-fidelity designs and prototypes, I approached each phase with care and attention to detail, ensuring every requirement was executed correctly the first time.
Led the creation and refinement of multiple layouts and design patterns to support intuitive, scalable experiences across Alight Solutions’ product ecosystem, balancing brand consistency, usability, and flexibility across a wide range of enterprise products.
Below are three case studies showcasing distinct challenges and the solutions used to address them.
Alight Worklife
Navigation Workshop
One of the larger initiatives focused on rethinking Alight Worklife’s Global Navigation, which had long suffered from usability issues and ongoing user complaints. The project involved planning and facilitating a collaborative workshop to identify navigation challenges and potential solutions. I contributed to defining the problem space, proposing navigation approaches, and translating insights into design solutions. I also designed both low- and high-fidelity prototypes, which were tested and iterated on to arrive at an improved global navigation experience.
From Problem to Solution
Once the workshop was established, the first step was identifying the overarching problem. Users found the navigation confusing and often struggled to locate what they needed on their first attempt, frequently resorting to search—with mixed results. To address this, the workshop followed a five-step process that was defined using Miro: Map, Sketch, Decide, Prototype, and Test.
First was to find the problems that were coming up, and also to decide what positives and negatives come sprout up from this test.
Inspiration came next, digging through competitors, or websites in general that had robust navigation.
Sketching and planning for what the new navigation could look like. What could this be once fleshed out?
Once an idea was agreed on, prototyping was defined. What would go where, and how would the prototype behave?
Wireframing a Prototype
After synthesizing insights from the workshop, I created a wireframe prototype in Figma to evaluate the proposed navigation structure. The walkthrough was used in user testing to assess clarity, user expectations, and overall alignment with how users anticipated navigating a site like Alight Worklife.
With Testing Complete,
a New Navigation Structure was Defined
Feedback from prototype testing was highly positive. Users felt the navigation changes addressed key pain points and made it easier to find what they needed. These insights informed the creation of a high-fidelity navigation design, which produced a cleaner, faster and more user friendly site navigation.
Alight Worklife
Account Summary Dashboard
Data cards are a primary entry point for users accessing key information on the Alight Worklife homepage, including PTO, Health Savings Accounts, insurance, and more. This project focused on modernizing the existing cards and introducing an intuitive system that allows users to add, edit, and remove cards based on their individual needs. I contributed to the Account Summary dashboard concepts, helped design new card types and editing functionality, and tested and prototyped solutions to guide the team toward the final product direction.
Refining Data Cards
Although data cards had been part of Alight Worklife since its early days, clients frequently flagged them as “too wide” or taking up excessive space for simple data points. The goal of this project was not only to update the data cards visually but also to give users a more flexible experience, allowing them to customize which cards and data points they see instead of relying on a default layout.
Cards should be consolidated into a single, flexible component that supports basic data points sourced from APIs. The card should leverage the Alight Worklife Design System’s data visualization patterns to clearly highlight key metrics and make the information visually scannable and impactful.
Once a card pattern was defined, spacing and padding was defined outside and inside the cards to make sure a common consistency was laid out, using our 8 Point spacing grid defined in our design system. This allowed for ease of use, especially with responsive layouts.
Data Cards were Redesigned with a Cleaner Look
The new data cards maintained the original design approach but at a smaller, more efficient scale. Design elements were either carried over from previous builds or reimagined using newly defined data visualizations from the Alight Worklife Design System. These data cards include cards for Health, Wellbeing, Wealth, and even work-related ones, like PTO.
A Whole New Way to Personalize Your Dashboard
One of the biggest challenges of this project was determining the most intuitive way for users to customize their dashboard and surface the cards and highlights most relevant to them. Through competitive research and pressure-testing different approaches, I landed on an editing modal that allows users to select favorites and easily edit, delete, or rearrange cards—giving them full control to tailor the dashboard to their needs. As new cards were made available, they can check them out and adjust as they went along.
Annual Enrollment
NextGen Flow
Annual Enrollment is one of the most critical events for Alight Solutions each year, bringing employees from clients across the organization to select benefits for the upcoming plan year. Historically, the enrollment experience evolved incrementally, with minor adjustments made year over year. This year, however, a new packaged program introduced the ability for users to upload personal data, enabling the system to recommend a benefits package tailored to their individual needs. The result is a smoother, more personalized enrollment experience that helps users complete enrollment more quickly and with greater confidence. As a results of the new components being used from the Alight Worklife Design System, the entire Annual Enrollment flow, that originally was about 40 pages total, had been cut down to 6 pages for the entire flow.
Enhancing an Established Enrollment Flow
The Annual Enrollment flow had been in place for years, dating back to my early time at Alight Solutions. Each year, designers iterated on the existing experience with minor refinements—preserving familiarity while addressing issues identified through annual analytics. This year introduced the most significant shift yet: a new packaged approach integrated into the enrollment flow. Alongside this change, legacy styles were updated to align with the new design system, and the flow’s behavior—along with how users track their progress—was redefined.
Bundles and package plans needed to be clearly defined and translated into an experience users could easily understand. This work involved close collaboration with project managers and content writers to identify the types of packages that needed to be built and determine how best to represent them through design.
As details came into focus, the overall page structure of the flow was iteratively refined. Initial concepts and wireframes were gradually developed as more insights emerged, and user research was conducted to validate the pages and inform design decisions.
With packages and details defined, the next step was building the pages that make up the full enrollment flow. This included designing all six steps individually, as well as accounting for variations required by product operations and engineering to support every possible user scenario.
Pages Built with
Responsive in Mind
As the pages were developed by myself and other design team members, creating a responsive layout became the next priority to ensure a well-crafted enrollment flow. While designing the pages, Auto Layout and style variables (tokens) were applied, making it easy to adjust page widths and create thoughtful responsive designs. For each screen, additional layouts for two tablet sizes and mobile were quickly produced, streamlining the responsive design process.