Together with an interdisciplinary team at the Wisconsin Foundation and Alumni Association (WFAA), we initiated a comprehensive redesign of the Wisconsin Alumni Association (WAA) website. Our work involved restructuring the presentation of WAA’s services and programs, establishing a uniform design framework to improve workflows, and defining the site’s brand direction.
ROLE
Lead Visual and UI Designer
TEAM
Collaborated with the Senior Visual Designer, Leadership, and teams from Digital, Marketing, Video, and Alumni Relations & Engagement.
DIVISION
Alumni Relations & Engagement, Wisconsin Alumni Association
Many young and mid-life alumni felt that the Wisconsin Alumni Association (WAA) wasn’t offering relevant programs and services. The old website made the problem worse with cluttered pages and confusing menus, making it hard to understand what WAA was offering. Also, the inconsistent branding made WAA seem disorganized. Our aim was to create a website with clear navigation and well-organized content to help users find information easily.
DESIGN SOLUTION
In the recent update of the WAA website, we introduced a new design with streamlined navigation and clear, modular layouts. The goal was to enhance the user experience and make the content easy to understand. We introduced event and story cards to help users discover content and showcase WAA’s various programs. The redesign established WAA’s updated branding, featuring the iconic red color, WAA’s diagonal design, and images of engaged alumni. Throughout the design process, we prioritized responsiveness and accessibility. The new user interface uses modular templates, simplifying development and maintenance and allowing flexibility to accommodate changing content needs. This approach improved the user experience and strengthened brand consistency, significantly increasing engagement and brand loyalty.
HOMEPAGE
The homepage welcomes users with interactive elements and brand messaging, connecting them to WAA’s latest offerings.
HOME
We enhanced our homepage by adding video footage and animated campaign messages to attract viewers to WAA’s wide offerings. Our homepage now includes a carousel showcasing the latest articles from WAA and UW publications and a grid layout highlighting upcoming events. These features make navigating our site smoother and more engaging for the viewer.
CONTENT HUBS
The News & Stories and Events & Activities hubs were designed to organize key content areas with consistent layouts, improving usability and enhancing content discoverability.
NEWS & STORIES
The main News & Stories page uses video content and news excerpts to engage users and encourage further reading. Each news and story page features an article from a UW or WFAA publication, while the grid layout encourages exploration through an intuitive and user-friendly design approach.
EVENTS & ACTIVITIES
The main Events page has a layout consistent with the News & Stories page. It includes video footage and event listings to promote upcoming events and invite users to explore. Many users access individual event pages through email links. The carousel of upcoming event cards is designed to keep users on the site and encourage them to explore more WAA events.
DESIGN SYSTEM
My design colleague and I met weekly with the digital and marketing teams to discuss user experience and communication priorities. The design system we created became the developers’ single source of truth.
UI ELEMENTS
We designed UI elements to ensure consistent branding and improve readability throughout the website.
MODULES
The implementation of modules enhanced the workflow for design and digital processes. Consistent image ratios across the website streamlined image preparation, and matching these ratios with email patterns further expedited production across communication platforms.
PATTERNS
We established reusable page patterns to ensure consistency across product and default pages, balancing flexibility with structured design to accommodate diverse content needs.
PRODUCT PAGES
With over twenty product categories, the module options for the product pages needed to accommodate different content while maintaining consistency.
DEFAULT PAGES
The migration of multiple content pages from the old website to the new platform necessitated the creation of default page layouts. These layouts needed to be visually appealing, easy to navigate, and capable of effectively accommodating a wide variety of content.
Testimonials
Lynn brought creativity and ingenuity to everything she worked on at WFAA. Her leadership and partnership in our collaborative Digital-Creative projects have been invaluable, and she helped to set us on a great course.
Dan T., Vice President – Digital Experience & Innovation at WFAA
Lynn was a pioneer in the digital realm with her groundbreaking work onuwalumni.com, advanceuw.org, and email patterns by creating gorgeous layouts across digital platforms. Beyond her professional achievements, she has always been an encouraging voice and mentor to our design team with her creative expertise and passion for design.