December 2018
Project Deliverables
Our team implemented robust search features complimented with a contemporary theme that represents the agency’s professional environment and services.
About The Client
Recently we worked with the team at Carver County Community Development Agency to create a brand new digital experience for their website visitors. We introduced new usability features that will improve the overall user experience and accessibility of the website. The robust features are complimented with a contemporary theme that represents their professional environment and services.
The Carver County Community Development Agency (CDA) located in Chaska, MN, is a local government agency administering a number of county-wide programs in the areas of single and multi-family housing, foreclosure counseling, rental assistance and economic development.
Carver County is located 20 miles southwest of Minneapolis and is one of the fastest growing counties in the Twin Cities metro area based on population, housing and business expansion. Their prime objective is to assist all county residents, cities and businesses with all types of housing or economic development services.
Ground Zero Objectives
- Create a visual theme that is contemporary, modern, and ADA compliant
- Completely redesign and restructure the existing menu
- Fix and improve broken areas of the site across devices and multiple resolutions
- Build a new version of the search feature that is easy to use and more visually recognizable
- Introduce a navigation assistant feature that quickly points users to popular content
- Consolidate page content and miscellaneous links to improve user experience and easily obtain critical information
- Upgrade WordPress for easy editing with Gutenberg, to ensure smooth updates to the website’s content and blog
Focal Points & Features
Navigation Assistant
We found that many of the website’s users were visiting the site to locate specific information, rather than casually browsing, with this information we set out to create a tool that would help visitors quickly jump to a section on the site that best fit their needs. This feature is easy to find and use in three areas of the site, including the homepage, footer, and menu.
Global Menu
The new menu eliminates the need for cumbersome drop downs and the miscellaneous points of navigation from the previous site. It centralizes navigation and tools into a user centric hub.
Not only does this full screen style menu immerse the visitor on medium to large screen devices, it also works seamlessly on mobile devices to ensure you will find the information you need on the go.
Then
Now
Dynamic Search
We took the website search feature to the next level, by backing it with a powerful plugin that detects keywords in file names, documents, blog posts, and webpages. The search button is located on the fixed left hand menu bar at all times, so no matter what page you’re browsing, you can easily select the spyglass icon and search for specific files or pages you’re looking for.
Resourceful Footer
The previous footer felt like an afterthought and was intended merely for low priority links and acknowledgements. We aimed to make the footer a more prominent section, by adding the logo as an apparent mark of brand identity, as well as highlighting contact information in the forefront for easy access, pushing important resource links, and most importantly, integrating in the navigation assistant tool, for yet another avenue to obtain information.
Then
Now
Establishing Accessibility & Compliance
A major deliverable for the website was making certain that the site was fully WCAG 2.0 and section 508 compliant. To ensure we were developing a website that would meet the accessibility standards, our team worked diligently to fine tune every detail necessary to meet this level of compliance.
- Tested and optimized for screen readers
- Contrast compliant color scheme
- Fine tuned typography/text hierarchy for legibility and improved page structure
- Descriptive alternate tags for images
- Defined link titles for improved context
Optimizing Across Devices
A critical piece of the puzzle for this site overhaul was the functionality and design across devices. We cleaned up any areas where content was overlapping or broken, to ensure a smooth experience across multiple device breakpoints. We were diligent to fine tune and test the site on multiple devices and browsers, so no matter how users are visiting the website, they are experiencing everything the site has to offer and are able to find the information they need.
Homepage then
Homepage now
Global Menu then
Global Menu now
Branding
Logo Refresh
We refreshed the print version of the agency logo by creating a flat design without layered gradients and updated the text to a sans serif style to feel more cohesive with the style of the website.
Color & Typography
Other than the existing logo, our team had little to pull inspiration from since the agency did not have official branding guidelines or promotional literature. Therefore we took the creative freedom to put a new spin on the existing dark teal and grassy green hues. For the neutral tones, we ran with dark slate blue tones and a snowy gray to contrast against the areas of white space. We brought back in a slightly brighter modified version of the teal, complimented by a trendy teal gradient, and lastly we accented the cool tones with a punchy crimson red.
For the site’s typography we kept it relatively minimalist by using the Lato font family, primarily the “Light” weight, to give the site a modern, sleek feel. Subtly, we incorporated Covered By Your Grace, as an accent to appear hand written or jotted down.
Going Forward
After a successful launch, we are excited to see how the Carver county residents respond to the new and improved platform that connects visitors to services and information quickly and painlessly. We look forward to working with the Carver County CDA team in the future by collaborating with them to build digital tools and to continue supporting their rising community.
You must be logged in to post a comment.