colorful OWA - darkpurple-device.png

Outdoor Women's Alliance

digital strategy, web

Outdoor Women’s Alliance

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 the team launched new initiatives. It also needed to be easy for their community to engage with and be easily managed themselves on a budget moving forward.

UI Design / UX Strategy / Information Architecture

Team

Kat Ingalls, Glitchcraft
UX/UI Design

Laurie Tewksbury, OWA
Digital Management

Gina Begin, OWA
Creative Direction

Jeremy Freeman
Web Development

Helen Eady
Branding

 

Challenge 

A SITE UI THAT WOULD:

  1. Give a more serious / professional impression, while incorperating existing content and branding.

  2. Provide a variety of features to support new initiatives, communicate diverse media (video, audio, photos, and words) beautifully, and supply responsive design for an increasingly mobile audience.

  3. Feature community contributors and empower them to share their stories easily.

  4. Be easy to update and maintain on a nonprofit budget, while supporting evolving trends in design and technology.

 

Design Process

Hero.png
Starting Point

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

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

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

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

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

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

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

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

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

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.