Oregon Hikers, Landing Page Design

Accessibility is not only crucial in design, but also in outdoor spaces. By improving access to nature, we can enhance overall human well-being. Technology can help with this by providing user-friendly websites that make park information more accessible. This project was inspired by my experience researching the Coyote Wall trailhead on the Oregon Hikers website. While their detailed information was impressive, the large amount of content was also difficult to navigate. This led me to redesign a landing page and digital/web branding to improve the user experience.

Figma file ↗
Oregon Hikers website assets.

Idea Exploration

Initially, my plan was to create a poster with photos I had taken on my trip. However, upon revisiting the Oregon Hikers website, I realized that the content design could be improved to provide a better user experience. I decided to use my poster drafts as inspiration and redesign a landing page instead. My goal was to simplify the page while adding unique design elements to give it a distinct voice. To achieve this, I used black-and-white photos and layered trailhead graphics that complemented the outdoor scenery.

Hiking poster designs.

Finding the Story

I find the Storybrand method useful for streamlining a website's content and design strategy. It focuses on the user as the hero of the journey, allowing me to better concentrate on the storytelling and identify the pain points. As a result, I simplified the Call-to-Actions to 'Get Directions' and 'Get Involved' with Trail Keepers of Oregon, which helps people quickly map out their destination and learn more about engaging the community.

Inclusive User Personas

As part of my user research, I used the Cards for Humanity game to aid my design decisions. Its deck of cards creates random scenarios that help designers build more inclusively. After going through the cards, I identified a user persona that best fit the project scope: someone who likes to plan ahead of time but has difficulty navigating websites.

Cards for Humanity accessibility exercise.

Wireframes

Because a lot of the hiking information was scattered across multiple pages, I had to determine the most crucial details and prioritize them higher on the page. Based on my own experience with heat maps and scroll tests, I've learned that people tend to lose interest around the halfway point of the page. That said, my main objective was to present all the essential information in the first section of the page.

Oregon Hikers website wireframes

Logo Design

When I was brainstorming ideas for a new logo, I had read an article about Desire Lines and how this principle is used to inform design decisions. The concept is rooted in the idea of allowing users to guide you down a path, them showing you the way versus the other way around. Inspired by this, I designed part of the letter "g" to look like a hiking path loop.

Oregon Hikers logo design.

Style Guide

The heading typeface has a simple geometric style that’s great for large text sizes. Paired with a sans serif font for the body, it gives a fresh look to the design. Muted greens were used to complement the outdoorsy feel of the page.

Oregon Hikers style guide.

Before & After

Oregon Hikers has a dedicated community of 7,000 members who regularly contribute valuable information, tips, and experiences. The fact that so many people convene online is something special and a testament to the organization's commitment to community involvement. My end goal for this project was to highlight this online space by modernizing the design and emphasizing accessibility in a broader scope.