Selected Web Projects

Browse a selection of web design and development related projects. For communications strategy and copywriting, please email hello@herz.works for a link.

Hearing Health Foundation

The Hearing Health Foundation approached us after a brand refresh. They had an updated visual identity that they were trying to apply to a website that had grown and evolved over the years without consistent and diligent treatment. It happens!

We were brought on to review the entire website, navigation, user journeys, and page by page audit the experience for visitors.

 
 
 

Project Objectives

Develop an intuitive and user-friendly information architecture

Improve site speed, and visitor analytics

Clean up the visual experience and make the site’s design consistent

 

Process and Approach

We first reviewed Hearing Health’s analytics; noting prominent pages and highly searched for content. We used these to focus on improvements and get a sense of how visitors were interacting with the site.

We documented nearly every page, template type, difficult to use or unintuitive structures, locations with broken or outdated HTML, and broken links; and a recommended solution for each item.

Once we had an established and thorough audit, we got to work developing a more strategic and streamlined approach with their audiences in mind. Pages were cleaned up, navigation was more intuitive, and visual treatments were made much more consistent. The site came together well on mobile and other devices, ensuring every experience was user-friendly.

 

Streamlining the site navigation helped visitors access important information more easily, and prioritized the most valuable pages and resources.

 

We also made their site far more accessible, applying digital design and Squarespace best practices across image alt text, application of coded design, and heading and page hierarchical structure.

After our work was complete, we discovered significant decreases in bounce rates, and increases in time spent on the site and pageviews.

Read More

Bluebell Therapy Center

screenshot of Bluebell Therapy Center website
 
 

Project Objectives

Create a safe and warm visual environment

Showcase the vast experience of Bluebell Therapy Center’s practitioners

Leverage SEO to attract nearby clients

 
 

The Process and Approach

Bluebell Therapy Center came to us as new business, seeking their first visual identity and website to attract new clients. We used our one week to website process, applying a step-by-step, strategic approach.

Brand and Website Strategy

Core to our process is understanding the positioning of a brand and what makes them unique. We established core customers, brand pillars, and built personas to identify the user journeys and needs of website visitors.

Visual Identity

It was vital to us that the visual identity of Bluebell Therapy Center would act as the proper first impression to the fuller client experience. Seeking out help for mental health and therapy can be a highly sensitive and personal experience, and we wanted potential new clients to be greeted with a mark and brand that felt both welcoming and reassuring.

The name of the business took inspiration from the Virginia Bluebells our client grew up with, and we hoped to honor the delicacy and beauty of those flowers while creating something that felt intriguing and unique to this business.

 
 
 
 

Website Design and Development

Bringing it together we married our visual identity to the website strategy and built a website that immediately welcomed visitors to establish trust and make them feel like they’ve come to the right place. We targeted copy and content to these core visitors and built an intuitive structure that allowed visitors to get as deep as they wanted to the practice’s history and the training of their practitioners. We encouraged visitors get in touch at every turn.

Our design choices were always led by the desire to create clear paths for potential clients to find the information or answers they were looking for, and create a sense of lightness while interacting with the site.

Using SEO best practices, we also ensured locally targeted page snippets and language.

Read More

Schoolhouse Supplies

screenshot of Schoolhouse Supplies  website
 

Project Objectives

Restructure content to simplify navigation and drive users where they need

Create a mobile-friendly website

Brighten and enliven brand to reflect the core mission of the organization

 

The Process and Approach

Schoolhouse Supplies came to us with a tight deadline. They wanted to update their outdated website to be mobile friendly before a fundraising push during year one of the COVID-19 pandemic.

Schoolhouse Supplies provides free school supplies to Portland area teachers and students, ensuring no child is ever without a pencil. Supporting them on their rebrand and website update was such an honor.

Visual Identity

Providing school supplies to kids? Their brand needed to be fun, light and friendly. Keeping their logo, we elevated the colors to create some joy, applying it in more places to evoke lightness and happiness. We brought in crayon-like elements to create layers and texture. We were careful not to make it childlike, continuing to present the organization as respected and established, ensuring trust.

User Experience

We restructured the site, removing older, no longer useful content, combining and separating others as needed. The organization had multiple audiences—donors supporting the organization through donations and attending events, teachers and schools scheduling supply shopping, parents purchasing supplies, and volunteers reaching out.

From analytics we knew that most visitors were mobile to the website. And the website wasn’t supporting their mobile viewing. We considered various user journeys and how we could support each experience.

An intuitive structure and a mobile-first design was out priority. We also developed a color system to group website sections visually.

Website Design and Development

Applying our updated brand to a fun, mobile-first website resulted in a much more straightforward experience for every visitor. We went live on time and the fundraiser was a huge success.

 
Thank you Cameron for helping Schoolhouse Supplies create an incredible new website on an incredibly short timeline. Cameron understands and appreciates the work of a nonprofit and you can see it in how well our new website communicates to our supporters and clients. Perfection!
— Executive Director
screenshot of Schoolhouse Supplies  website
Read More

Code of Support Foundation

screenshot of Code of Support website
 
 

Project Objectives

Create an inviting and modern visual identity

Restructure the website to meet the needs of multiple users

Highlight the excellent work of the foundation in an intuitive and engaging manner

 
 

The Process and Approach

The Code of Support Foundation’s website had a hard to navigate structure. That meant visitors seeking the immediate support of the Foundation were struggling to find what they need. The visual identity was also outdated and lacked cohesion.

Visual Identity

We first revised the visual elements of the brand, keeping their logo and building a color palette and typography to match a new era for the organization. We kept it patriotic, but modernized the cohesive identity.

Content Strategy

The website had grown very large and flat. It lacked hierarchy and an intuitive structure to the content. This meant that visitors had trouble finding what they were looking for and the organization had trouble highlighting what mattered. Connecting these two needs was the basis for our content strategy.

User Experience

We restructured the site, combining certain content and separating others. We prioritized the needs of the veterans seeking support, driving them to help and the services of the Foundation as quickly as possible.

Website Design and Development

Pulling it all together we built wireframes that met visitors needs, and displayed the full breadth of services and programs offered by the Foundation. Applying our visual style, it all came together.

 
screenshot of Code of Support website
Read More