Grahall
Brand Identity, Site Design, XHTML, CSS
Grahall is a trusted company to Boards of Directors, Compensation Companies and senior management. One of Grahall’s most important services is to provide customers access to compensation surveys. To accomplish this service, Grahall initiated a web data delivery project to enhance its documents and delivery via download. The project had two tasks: create a visual identity package for Grahall, and redesign the website to better address the needs of its target markets.
Getting started
The project team consisted of a development team in Seattle with the company partners in New York City, communications with the latter were limited to e-mail and telephone while I met with the former at various coffeeshops in the greater Seattle area. I began my work by sending the Grahall partners a series of questions to define the visual identity of the company and informtion architecture of the new website.
Visual Identity
Based on the answers provided by the partners, and through a series of phone conferences, I sketched several brand identities that combined random dynamics with Zen Buddhism. I prepared a booklet of the sketches in PDF format which I sent to the team for review. The booklet was an episode of reality television: some sketches were preferred by the team whilst others didn’t make the cut. One design was chosen with iterations made to adjust shape, color and letterforms. With the brand fully realized, I designed a style guide that formally addressed best practices when visually representing the company. Next was the site design.
Site Design
Before I start any site design I always ask questions about the users which allow me to generate user flows, a sitemap, and lo-fidelity wireframes. I met with the developers to understand my design constraints and, most importantly, know minimum browser requirements. With this information acting as my blueprints, I created a design concept that: allows for content structure within a 3-column layout, and can be viewed in Internet Explorer 6 without requiring scripts to correctly render alpha transparencies.
We’re not done yet!
The web developers asked if I wouldn’t mind converting the Photoshop files since I can code XHTML & CSS by hand. However, the team had one request: make sure the layout is elastic rather than fixed or fluid. It took a bit of head-scratching but over the course of ten days – spending a little over four hours a day – I was able to code all the necessary template pages which the developers were able to use without changing the markup.

