Background
A prominent association in Texas (real name not used for NDA reasons) had a 4-year-old site that was in need of modernization to reorganize the prioritization of the content, improve the mobile experience, and update the aesthetic to match the new branding.
My Role
I led this project as the user experience expert and information architect. I facilitated the discovery sessions, architected the content architecture and strategy, defined the functional requirements, and I consulted the visual design.
Design Refresh Goals
After the discovery meeting, I prioritized the top 3 goals of the site refresh project.
- Show what the benefits of the organization quickly to the user.
- Highlight the events calendar.
- Maintain profitable advertising opportunities while minimizing clutter.
Starting Layout
This is the low fidelity wireframe of the site structure.
Updated Layout
The client invested in the refresh, and while they didn’t want a complete revolution of the layout, they did want the site to feel new.
The Introduction
The site receives moderate traffic, but many of the users that visit the site are first timers. This provided the opportunity to introduce the organization and the benefits of joining.
The Menu
One of the biggest changes came in how the menu organized the sections of the site. The menu now prioritizes the pages in order of most used/most important to least used. It also removed the duplication of the home link. The header also modernizes the site by responding to the screen width.
Hero Image
The next area is the most dynamic area featuring the large hero image of highlight content. This organization is heavily focused on events, and this area directs users to the most relevant event quickly.
News and Events Row
The news row displays the 2 latest news updates with a large ad to the right. This is one of the more dynamic sections of the site that updates regularly, but it comes in lower since it is a lower priority than the content above. The Small link below the ad directs users to the association publication that updates twice a year. The events are listed instead of using a calendar to show the important information without additional clutter.
Static Pages Row
The Member community exchange and career center are static parts of the site that still need some focus because it was found that many of the users had never seen it before, even after visiting the site many times. The required ad on the right provides a visual anchor and variety.
Sponsors
Sponsorships are a large portion of financial support for the association, and this section required some order beyond the random placement on the original layout. Creating a uniform form with color for accents was the best solution to show hierarchy without visual clutter.
Mobile Responsive
One of the goals was to maintain a good experience across all screens. The site was architected to be flexible enough to keep a good experience as it stacks on narrow screens. The menu is one detail that kept membership and events out of the hamburger menu to keep them from getting overlooked.
Review
Reviewing the site 4 months after launch, the client was very pleased with the result, and the set goals were achieved. The scope of this project didn’t allow for in-depth work to address some issues in the interior pages, and that hurts the overall UX for users that dig in deeper into the content. Many of the issues aren’t terrible, but it feels somewhat like a templatized experience.