Pixel Perfect Design

The challenge of creating a precise layout in HTML and CSS is one of my favourite design projects to work on. The client needed a design as precise as the scrapbook layouts she created. My initial research into site designs included reviewing the designs my client created out of paper and other print media.

Below are my notes on the precise dimensions required when setting up the site's interface.

A sketch showing the dimensions of the website design
enlarge

Up to Date Content

One of the challenges of running a small business is finding a cheap and easy solution for providing up-to-date information to their customers. With a wide selection of classes and a well-rounded events calendar, this store came to me seeking a solution to making and printing paper flyers that quickly became out of date.

Working closely with the business owner, I developed a plan for how to keep the site up to date. After much consultation with the staff, and extensive user-testing, I was able to design an admin area with several easy to use tools. The staff had forms for managing the store's classes, as well as the store's hours of operation, special events and holidays.

A calendar of classes & events was run off a MySQL database and the store was a custom osCommerce installation. Here is the sitemap showing the full range of tools available for updating the site.

Scrapbook Memories classes &
events calendar
enlarge


Another unique feature that made this site stand out against other local scrapbook stores was the custom flash carousel displaying photos of the interior of the store. Considering the newness of image carousels, we felt the target audience of the site would appreciate that the carousel rotated through the photos automatically.

Check out more case studies.