06/06
06/06
06/06

Washington Trails Association Redesign

Washington Trails Association Redesign

University of Washington Human Centered Design & Engineering

UW HCDE

2022

Website

Website

Visual Design

Visual Design

Magazine Design

Magazine Design

WTA mockups
WTA mockups
WTA mockups

Overview

Overview

For my Master’s course, HCDE 508 Visual Communication, I was tasked with redesigning the visual design system of a “client” of my choice, Washington Trails Association (WTA). Starting from a mood board, I redesigned WTA'’s webpages and Washington Trails magazine. This process included creating wireframes, designing a new logo, and selecting typography, color palettes, and imagery.

I used WTA as an example client for this project. I did not work directly with or for Washington Trails Association.

Duration

10 weeks

Collaboration

Individual course project

Role

Designer

Duration

10 weeks

Collaboration

Individual course project

Role

Designer

Challenge

Challenge

Business Goals

Inspire

Encourage users to interact with and volunteer for WTA through inspiring imagery that brings them into the outdoors.

Trails for everyone

Follow through on WTA’s “trails for everyone, forever” slogan by clearly and frequently showing users information on WTA’s work for equity and accessibility outdoors.

Business Goals

Inspire

Encourage users to interact with and volunteer for WTA through inspiring imagery that brings them into the outdoors.

Trails for everyone

Follow through on WTA’s “trails for everyone, forever” slogan by clearly and frequently showing users information on WTA’s work for equity and accessibility outdoors.

Communication Goals

Inspire

Encourage users to interact with and volunteer for WTA through inspiring imagery that brings them into the outdoors.

Trails for everyone

Follow through on WTA’s “trails for everyone, forever” slogan by clearly and frequently showing users information on WTA’s work for equity and accessibility outdoors.

Communication Goals

Calls to action

Allow users to discover all that the Washington Trails Association offers by encouraging them to thoroughly explore the website and follow through on clear CTAs.

Command and hold attention

Hold users’ attention through an appropriate balance between images and text, a logical hierarchy, and a visual design that flows down the page, much like a trail.

Communication Goals

Calls to action

Allow users to discover all that the Washington Trails Association offers by encouraging them to thoroughly explore the website and follow through on clear CTAs.

Command and hold attention

Hold users’ attention through an appropriate balance between images and text, a logical hierarchy, and a visual design that flows down the page, much like a trail.

Business Goals

Inspire

Allow users to discover all that the Washington Trails Association offers by encouraging them to thoroughly explore the website and follow through on clear CTAs.

Trails for everyone

Follow through on WTA’s “trails for everyone, forever” slogan by clearly and frequently showing users information on WTA’s work for equity and accessibility outdoors.

Problem Statement

Problem Statement

Give Washington Trails Association a makeover by redesigning their logo, website, and magazine.

Final Designs

Final Designs

Scroll to design process ↓

For this project, I designed the WTA home page (desktop and mobile), WTA “Our Work” page, desktop, Washington Trails magazine cover and spread, and a new WTA logo.

WTA Home and "Our Work" Pages - Desktop

Mockup of WTA desktop site
Mockup of WTA desktop site
Mockup of WTA desktop site
Mockup of WTA desktop site
Mockup of WTA desktop site
Mockup of WTA desktop site

Washington Trails Magazine Cover

Mockup of Washington Trails magazine spread
Mockup of Washington Trails magazine spread
Mockup of Washington Trails magazine spread

Washington Trails Magazine Spread

Mockup of Washington Trails magazine spread
Mockup of Washington Trails magazine spread
Mockup of Washington Trails magazine spread

Output

Output

New visual design system

Because the WTA visual system is retro-inspired, the imagery is likewise inspired by vintage and polaroid photography.

New visual design system

Because the WTA visual system is retro-inspired, the imagery is likewise inspired by vintage and polaroid photography.

New visual design system

Because the WTA visual system is retro-inspired, the imagery is likewise inspired by vintage and polaroid photography.

Mobile and desktop designs

I redesigned the homepage and "Our Work" pages for mobile and web in Figma.

Mobile and desktop designs

I redesigned the homepage and "Our Work" pages for mobile and web in Figma.

Mobile and desktop designs

I redesigned the homepage and "Our Work" pages for mobile and web in Figma.

Magazine cover and spread designs

I refreshed the design of the magazine cover and spread in Adobe InDesign and Figma.

Magazine cover and spread designs

I refreshed the design of the magazine cover and spread in Adobe InDesign and Figma.

Magazine cover and spread designs

I refreshed the design of the magazine cover and spread in Adobe InDesign and Figma.

Visual Design System

For this project, I started with a mood board, then pulled content from the WTA website to design the layout. Below includes details on the grid systems, typography, color palette, logo, and imagery.

Moodboard

Earthy tones, Polaroid photography, and WTA’s roots as Signpost Magazine in the 1960s and 1970s serve as the inspiration behind the mood board for this project.

moodboard

Expand full design ↓

Visual Design System

For this project, I started with a mood board, then pulled content from the WTA website to design the layout. Below includes details on the grid systems, typography, color palette, logo, and imagery.

Moodboard

Earthy tones, Polaroid photography, and WTA’s roots as Signpost Magazine in the 1960s and 1970s serve as the inspiration behind the mood board for this project.

moodboard

Expand full design ↓

Visual Design System

For this project, I started with a mood board, then pulled content from the WTA website to design the layout. Below includes details on the grid systems, typography, color palette, logo, and imagery.

Moodboard

Earthy tones, Polaroid photography, and WTA’s roots as Signpost Magazine in the 1960s and 1970s serve as the inspiration behind the mood board for this project.

moodboard

Expand full design ↓

Skills & Tools

Skills & Tools

Visual Design

Visual Design

Figma

Figma

Adobe InDesign

Adobe InDesign

Brand Design

Brand Design