Rebrand of the City of Columbia web site. Click the images below to see a full size preview of the rebranded site along with the existing site.

Our Approach

The City of Columbia's website is very informative and rich with content. In our experience, we find that such web sites must adequately manage its white space while maintaining a consistent look and feel. Below we have listed those items we think can be approved along with our approach for addressing those items.

Original Site

Canvas

- Too small, not organized. - As per our knowledge a website should reflect and serve the purpose of its existence. It should convey a brand identity, trust, distinctive as an educational source. - Colors can be better - One major change is use of images for content display. E.G “Benedict College”,”Testimonials”,”Menus” , etc.

Header

The header is an embedded flash component that could cause the web site to load slower. The navigational links also wraps which interrupts the flow.

Banner

There is no visible banner in use on the City of Columbia's web site. There is a small section for search then it goes directly into the content and body of the site.

Main content

The main content is presented using a standard three column layout. There is no attention drawn to any particular section nor heading. While the headers are a different color than the text, there is not enough depth in the content to create the necessary contrast to make the information stand out.

Footer

There is no clear footer on the site. While the content area is closed, there is no transition to the end of the page. In addition, there is no navigational links provided at the bottom of the page. Users will be required to scroll back to the top in order to navigate.

Our Design

Canvas

Widened the layout and design so that it is more fluid and can render based on the visitor's screen size. Made the background white (light shades of blue or grey would also work) in order to improve visibility.

Header

Incorporate a static header and background that will allow the site to load faster. Moved search to the header in order to make it more prevalent and accessible to visitors.

* We modified the logo slightly so that it is sharper and stands out more.

-->

Banner

Added a banner in order to showcase city attractions and focus on a couple sections. The left panel is used to display information about city leaders, council members and the mayor. Upon hovering or clicking on the tabs, the relevant content will be displayed.

The right panel is a simple image gallery that will rotate and display various local attractions. These images are prominently displayed and used to lure more visitors to the city.

Main content

A three column approach is still used, however we have introduced a more dynamic color scheme that leverages gradients to better display content along with multiple colored headers to add distinction. Buttons and small icons are included to add more depth to the page which make the articles and information stand out more.

Footer

A footer is needed to signal to the user that they have reached the bottom of the page's content. We have included a footer that simply shows the copyright for the city of columbia. We suggest that the main navigational links along with shortcuts to key web site content also be included in the footer.

This is just the Beginning

This is a simple concept without the benefit of your input. It is our hope that what we have presented reflects our attention to detail and willingness to provide an optimum user experience. If we were working directly with you, this would be the first iteration and we would be seeking your feedback so that we could be sure that we adequately captured the essence of what the city is trying to accomplish with this web site.

We look forward to the opportunity to continue the project soon.