top of page
ColumbiaCounty-intro.png

PROJECT

Website Design for

Columbia County, GA

ColumbiaCounty-logo.png

GOALS

Tell the story of the county

1

Feature the community - a thriving and family-oriented culture

2

Be represented as forward-thinking - safe, quaint, fun, yet innovative

3

Convenient access to attractions, events, features

ColumbiaCounty-arrow.png

RESEARCH

Stakeholder Survey

Community Survey

USER NEEDS:

• better content discoverability
• a way to pay utility bills
• see upcoming community events
• find job opportunities
• more call-to-action buttons for improved site navigation

User Testing

CONCLUSIONS:

• common feeling about the site hosting too much content
• navigation was used frequently to complete tasks

Analytics

Heatmaps

CONCLUSIONS:

• Call-to-action buttons showed pattern of majority clicks for “Jobs”, “Pay Online”, and  “Maps” 

• Footer links for “Employee Center” and “Staff Email” were most used

Card Sorting Exercise

FINDINGS:

• “Community” and “Culture & Careers” were confusing, level of agreement increased when consolidated to “Our County”

ColumbiaCounty-meetings.png

MY ROLE

Lead Designer (Granicus Inc.)

Consulted with the client on the art direction for the website. Created a design that reflects the progressive city and thriving community and incorporated innovative features to stray from the typical government website.

ColumbiaCounty-cta2.png
ColumbiaCounty-imageBG.jpg
ColumbiaCounty-mobile.png

CHALLENGES

ColumbiaCounty-arrow.png

How to infuse the brand with the parallax animation in an elegant and unobtrusive manner?

SOLUTIONS

We leveraged the branding elements of waves and parallax scrolling to portray the county as very fluid and progressive.

ColumbiaCounty-cta1.png
ColumbiaCounty-colors.jpg

thriving

FORWARD-THINKING

Trustworthy

fresh

MODERN

ENERGETIC

ColumbiaCounty-images.jpg

With the mobile-centric goal of the new website, we opted for a mobile style hamburger menu.

number1.png
number2.png

The brand is established at first glance with the large transparent application of the waves in the hero image space.

number3.png

Updated the call to action buttons to fit within the content area rather than full browser width to be able to implement the waves on the sides without blocking the content of the buttons.

number4.png

Wave elements scroll in and out of the sides of the page, in a smooth and graceful manner.

number5.png

By not filling the full space of the calendar section, the asymmetrical approach gives fluidity to the design  and emulating the feel of the waves but in a less direct manner.

number6.png

Moved the second set of buttons to a single row and an open icon concept to differentiate from the first set, give a variety to the flow of the page, and to aid in the open feel rather than more boxes.

ColumbiaCounty-wireframe2.png
ColumbiaCounty-wireframe3.png
ColumbiaCounty-wireframe4.png
ColumbiaCounty-wireframe1.png
ColumbiaCounty-arrow.png

RESULTS

The design is modern, fresh, and energetic, promoting that connected and family-oriented culture of the community while still focusing on the information and services with the clean and spacious interface.

 

For a deep connection to the brand we feature the wave elements in the parallax scroll, and  encompass the strong energy and liveliness of the county’s community.

ColumbiaCounty-results.png

CHECK IT OUT LIVE!

©2023 annastopa.com

bottom of page