vocation
- introduction
- animation & flash
- certifications
- job descriptions
- recognition
- résumés
- studies
- websites
- writings
Websites: PBC+L Architecture
PBC+L Architecture, a 35-person architectural and interior design firm located in Raleigh, North Carolina, was seeking a website that would better showcase its award-winning designs and projects.
In
an effort to balance function over form, I was faced with many challenges.
PBC+L's prior site was so focused on form that even its copy was presented
in a graphical format to ensure that each page would render exactly as
it had intended. Through education and compromise, the new site has shifted
from a 10/90 function over form ratio to a more balanced 40/60 ratio.
The heart of the site lies in the Portfolio section, which features a graphical navigational system that utilizes JavaScript and disjointed rollovers. PBC+L's project manager and I wanted to use blurry images of various projects that would come into focus when a user passes his or her pointer over each image.
Our first effort involved 80 x 80 pixel thumbnails that featured a brief description of the highlighted project. This proposal received mixed reviews from PBC+L's partners, for many of them did not like the blurry effect. One partner even commented that he didn't know the images were supposed to be blurry, for he simply thought he needed new glasses.
Determined that we could make this interface work, we decided to shrink the thumbnails down to 40 x 40 pixels and remove the project descriptions. This proved to be a success, for the images were small enough that users no longer made an effort to determine what the images were representing and instead thought of them as navigational icons.
The
other significant challenge inevitably became bandwidth. Some project
pages included up to 30 images that had to be displayed or loaded in the
background ready for rollover. Further compounding the problem was PBC+L's
desire save their project images at a resolution that often exceeded the
level of quality that is required for the web.
To combat these challenges and to reduce the amount of time that it would take for a page to load, I often instructed pages to secretly load images in the background in anticipation of where the user would next visit. By preloading and caching images in the background, pages would load immediately since the images were already downloaded and were waiting on the hard drive for retrieval.
| Client: | PBC+L Architecture |
| Type of work: | Contract/Freelance |
| Description: | Site redesign and training for future updates |
| Project role: | Worked with the PBC+L project manager/graphic artist to develop a new site. Together, we came up with the look, feel, and navigation. Individually, I developed the code and graphics while the PBC+L graphic artist selected and optimized photos. |
| Tools used: | Macromedia Dreamweaver, Adobe Photoshop, Adobe ImageReady |
| Languages used: | HTML, DHTML, CSS, JavaScript |
| Server resources: | Apache/1.3.27 (Unix) PHP/3.0.18 mod_auth_pam/1.0a FrontPage/4.0.4.3 ApacheJServ/1.1.1 on Solaris |
| Size of site: | 60 pages, 12 GIFs, 153 JPGs |
| Conformance: | 
|
| Website: | www.pbclarchitecture.com |