Outdoor Women's Alliance

CLIENT

Outdoor Women’s Alliance

TEAM

Kat Ingalls, Glitchcraft
UX/UI Design

Laurie Tewksbury, OWA
Digital Management

Gina Begin, OWA
Creative Direction

Jeremy Freeman
Web Development

Helen Eady
Branding

TOOLKIT

UX / Strategy
Google Analytics, Sheets, Noteability

UI / Design
Sketch, Illustrator

Front end / Development
Wordpress

Problem

Outdoor Women’s Alliance is a volunteer-run nonprofit media and adventure collective that engages, educates, and empowers females worldwide. As a rapidly-growing organization, they needed an updated website that could expand its capabilities as they launch new initiatives, that was easy for their community to engage with, and that they could easily manage themselves on a budget moving forward.

THE NEW SITE NEEDED TO:

Seamlessly transition current content and branding (fonts, colors) into a new design that gives a more serious / professional impression.
Communicate a variety of media (video, audio, photos, and words) beautifully, regardless of whether it’s viewed on a computer, tablet, or mobile device, with a wide breadth of features to support new intitiatives.
Highlight community contributors and empower them to share their stories easily.
Be easy to update and maintain –including continual development support of evolving trends in design and technology.

Solution

Featured

Starting Point

When OWA approached me, their site was hosted on Blogger, hard to interact with on mobile, and not able to support the functionality they needed – like highlighting contributing authors. They needed both a more professional presence and more professional features.

But the new site also needed to migrate their current content, be easy to update on their own, and, due to the nonprofit nature of their business, be essentially free to maintain.

Data-driven

Before starting design work, we wanted to see what the numbers said was working and what wasn’t on their current site. Digging into OWA’s Google Analytics showed that a significant portion (~50%) of their audience was viewing the site on mobile, but the original site had usability issues (like a cutoff menu and horizontal scrolling).

Heuristics

In addition to reviewing site analytics, a quick heuristics review was done for potential usability fixes and interface improvements. Consistency and efficiency improvements, including an updated navigation menu and some copy tweaks, were recommended.

Site Architecture

Based on the heuristics review, an updated site map was designed to help users find and contribute content more easily. This included both copy adjustments and information reoganization.

Feature Requirements

Originally, OWA was looking for a designed-from-scratch Wordpress theme. Because OWA is a nonprofit with limited funding, and looking to expand in the future, I recommended using a pre-made Wordpress theme with a track record of developer support.

That way, they could keep up with tech and design trends for a one-time cost of about $60, without needing to hire a new designer or developer every year or two. We could customize the pre-made theme for their brand and content.

A decision matrix mapping OWA's specific business requirements with potential Wordpress themes was made to help the team decide which theme to choose based on their needs.

Project Management

After designing the custom theme template in Wordpress, OWA wanted to wait to implement until the team had more bandwidth to support the transition. The project was handed off to OWA's site developer for Wordpress setup and maintenance, and to the content manager for exporting/importing existing posts. Throughout the project, I set clear milestones and collaborated with the team in Asana.

Mockups

Two templates were selected by the team as top picks. To help make a decision, site mockups were made to envision what the two WordPress themes could look like after being customized with OWA’s branding and content.

This version features categories on the homepage, so that readers can find content related to their unique interests faster.

Prototype

This second mockup highlighted the organization's mission, and featured the most recent content. Attracting new users was prioritized over repeat visitors, and so this design was the basis of the final site.

A sandbox site was set up to demonstrate the interface and interactive components.

Final Design

With the sandbox site approved for further development, design work was completed. After this point my role was to assist hand-off to the organization’s developer.

A view of the original site (left) versus the final design (right).

Implementation

After finalizing the site design, a dedicated Wordpress developer took over implementation. Eight months after handoff, the site featured a more prominent call to contribute, a goal that wasn't a focus during the original redesign. Events and photography also took less priority than the team originally expected, and so these sections were removed.

Deliverables

UX / STRATEGY

Site Audit + Usability Recommendations
Functionality Requirements
Site Map

UI / VISUAL

Mockups

DEVELOPMENT

Wordpress Install
Wordpress Theme Customization

Impact

The original Blogger site had mobile usability issues and was missing features crucial to supporting OWA’s business.

THE UPDATED SITE:

fixes usability for 50% of OWA’s traffic, with mobile-friendly design for visitors from email and social media
will continue be upgraded without any additional costs as technology and design trends change
is easy for the team to update themselves as they produce more content and expand their mission
communicates a more professional look, with consistent branding, easy to navigate menus, and responsive design
enables the business to expand with options to support sharing new types of content as new initiatives arise

“I love the team page, how awesome it is to be that transparent and easy to contact. I really like how easy it’ll be to develop this on our own. I’m a fan.”

— Laurie Tewksbury, Digital Manager

Kat IngallsFebruary 7, 2019

Portfolio