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.
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.
Bluebell Therapy Center
Website: Bluebell Therapy Center
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.
New Day School
Website: New Day School
Project Objectives
Develop an organic and inviting brand identity
Update the structure of the website to meet the needs of multiple users
Share the unique and touching story of the school while communicating clear information for current and prospective parents
The Process and Approach
New Day School’s website was no longer reflective of the school’s identity. We wanted to soften the color palette, use more organic and natural tones, and modernize the feel. We also identified multiple users and audiences of the website – prospective parents, current parents, and community members.
Grounded in users’ needs, we knew we needed an intuitive and thoughtful structure to get people the information they needed.
We also had an opportunity to tell the story of New Day School, as users seek out hours of operation and other simple facts.
Visual Identity
We first tackled the logo, bringing in the hand-crafted artwork done by a former teacher at the school that lives on a sign out front. Using an organic and soothing color palette, and modern fonts, we were able to soften the visual identity and align it with the school’s mission and vision.
We further reflected the organic nature of the school with soft image shapes of natural elements and happy children.
Content Strategy
A long-standing institution in Portland, New Day School is deeply committed to environmentalism and growing kids into civic-minded citizens.
They recently undertook a major reconstruction of their infrastructure and are now the first net zero preschool in the state of Oregon. These core tenets of who they are, rooted in Neo-humanism, are what make it so unique and it was important to communicate this to potential families looking for the right place to send their children. These parents also need the details like cost and hours, as well as to get to know the policies of the school.
There was also a need for currently enrolled families to find information and paperwork quickly.
We focused the bulk of the website on attracting new families and showcasing the mission and vision of the school. We also created a password-protected parent portal for enrolled families to easily find what they need.
Schoolhouse Supplies
Website: Schoolhouse Supplies
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.
Code of Support Foundation
Website: Code of Support Foundation
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.