CASE STUDY • 03
FEATURED PROJECT
League of
Women
Voters of
Massachusetts
PRIMARY GOAL
Create a clearer, more accessible digital experience for the public, prospective members, and local League members.
PROJECT SCOPE
Website redesign, research, information architecture, UX/UI design, prototyping, responsive design, implementation, and testing.
KEY CONSTRAINTS
→ 1,000+ page legacy site with fragmented navigation and outdated content.
→ Multiple audiences with distinct goals and needs.
→ Squarespace limitations requiring custom HTML/CSS/JavaScript.
ROLE
Lead UX/UI Designer
TOOLS
Figma, Squarespace, Custom HTML/CSS/JavaScript
TEAM
LWVMA Board & Staff
LWVMA.ORG
01.
Research & Context
A large, complex site with a navigation problem
The League of Women Voters of Massachusetts (LWVMA) came to me with a large, outdated WordPress site that had become difficult to navigate and maintain. More than 1,000 pages of accumulated content, a complex structure, and an aging technical framework had created challenges for both visitors and staff.
The Research
I reviewed findings from a usability study with 21 local League leaders and stakeholders. 71% identified navigation as a primary source of friction, reinforcing that the core problem extended beyond visual design.
These findings informed the site's information architecture, navigation, content organization, and key user pathways.
The Users
The site serves several audiences, including the general public, prospective members, and local League members. Each has different goals, but the existing structure often made it difficult to know where to begin or find relevant information.
Legacy Site
02.
Information Architecture
From a fragmented structure to a clearer system
The existing site had developed a deep, fragmented structure over time. Outdated, redundant, and inconsistently organized content made information difficult to find, both through navigation and search.
I used the research findings to rethink the site's information architecture, content hierarchy, and primary pathways, working with LWVMA staff to determine what should be retained, revised, consolidated, or removed.
Designing around user intent
The new architecture creates clearer entry points for the site's primary audiences.
For example, Member Resources and Become a Member are surfaced as distinct pathways so existing members and prospective members can quickly identify the route relevant to them.
Search is also positioned as a primary utility for users who already know what they're looking for.
03.
User Journeys & Flows
Mapping key paths and opportunities
With the information architecture established, I mapped the key journeys visitors need to complete across the new site. Rather than looking only at page-to-page navigation, I considered the user's goal, the actions required, where the experience takes place, and where the existing site creates friction.
I focused first on two core audiences: existing members looking for resources and prospective members looking to join.
04.
Wireframes & Prototyping
Translating structure into interface
I translated the new architecture into page layouts and interactive experiences, establishing hierarchy and interaction patterns before refining the visual system.
The homepage became the first major design exploration, bringing together primary navigation, membership pathways, calls to action, events, and the Local League finder.
I iterated through designs in Figma before moving them into Squarespace.
Testing structure before refinement
Wireframes and prototypes allowed me to work through layout, hierarchy, and responsive behavior before committing to the final interface.
05.
Visual & Responsive Design
Building a cohesive visual system
I developed a visual system that brings consistency across the site's many page types while maintaining a clear, approachable experience.
This included typography, spacing, content hierarchy, buttons, cards, navigation, and reusable interface patterns.
Designing across screen sizes
Responsive behavior was considered throughout the design and implementation process. I refined layouts across desktop, tablet, and mobile, including navigation and content hierarchy.
The Local League map was also adapted for responsive use. I modified the existing implementation using custom HTML, CSS, SVG, and JavaScript so the experience works across screen sizes.
Homepage
The homepage brings together the site's primary pathways and content priorities, including a video hero, membership pathways, events, and the Local League finder.
06.
Scalable Page System
Designing for a large content ecosystem
With more than 1,000 pages in the legacy site, the redesign needs to balance consistency with flexibility.
I am establishing reusable page patterns for content with similar structures while creating custom layouts for pages with unique requirements. This includes identifying which pages can share templates and which need individual solutions, such as Team and Employment Opportunities.
07.
Implementation & Iteration
Bringing the designs into the live site
The redesign is being implemented directly in Squarespace, translating Figma designs into responsive, working pages rather than treating development as a separate handoff.
I use custom CSS, HTML, and JavaScript where native functionality does not provide the required experience, including the interactive Local League map.
Designing through implementation
Because design and implementation happen concurrently, I can identify and resolve issues as they emerge in the live environment. This includes refining mobile layouts, responsive interactions, content hierarchy, and reusable components.
08.
Current Status
From redesign to launch
The new information architecture, sitemap, homepage, membership pathways, responsive navigation, and Local League map are in place or actively being refined. Additional page templates and custom page designs are being developed alongside content migration and cleanup.
The next phase will focus on completing remaining page designs, continuing content cleanup, and preparing the redesigned experience for stakeholder review and testing before launch.