Sacramento Public Library (SPL) Website Redesign Project
One of my class assignments in my web and interactive technologies class was to redesign an existing website deemed bad or ugly by another student in the class. I decided to redesign the Sacramento Public Library (SPL) website. On this page, I will present the various phases of my project.
Phase 1: Creative Brief
In this document, I outlined the problems of the current SPL website and then explained how I planned to correct them in the new redesigned website.
Phase 2: Visual Inspiration Board
After writing the Creative Brief, I looked at other websites for ideas about imagery, typography, layout, and other design elements that I could use for my website redesign project. I have posted some of these images here, and the rest of them can be seen on my inspiration board.
Foxies Graphic Design Home Page
Links LA Home Page
USF Library Home Page (top)
USF Library Home Page (bottom)
Phase 3: Sketches
The third phase of this project involved brainstorming ideas for the new redesigned website. I drew thumbnail sketches of Web page layouts that could be used for this project. In addition, I drew larger and more detailed drawings of a few promising layouts.
Phase 4: Architecture and Site Map
For this phase, I created a content inventory for the current SPL home page and second tier pages, a hierarchal outline of the content of the current SPL home page, and a site map of the new redesigned website.
Site Map of the Redesigned SPL Website
Phase 5: Wireframes
After focusing on the structure of the current SPL website and the redesigned SPL website, I created refined layout sketches that formed the basis of wireframes for the redesigned SPL home page and one redesigned second tier page.
Wireframe for the Redesigned SPL Home Page
Wireframe for Redesigned SPL Second Tier Page
Phase 6: Prototype
For this final phase, I created a prototype based on the wireframe for the redesigned SPL home page that I created in Phase 5. Here is a before and after look at the current SPL home page and my redesigned SPL home page:
SPL Home Page
My Redesigned SPL Home Page
For the redesigned SPL website, I brightened up the dark color scheme of the current SPL website. Although I use black for the header and footer, I offset these dark areas of the website with white and warm colors such as yellow, brown, and brick red.
The graphics of the current SPL home page are some of the other design elements I wanted to improve in my website redesign project. I did not like how the black and white photos on the current SPL home page seem to deemphasize and isolate the library users. The people in the photos seem to be boxed in by the big navigation buttons. To remedy this problem, I included color photos that would present SPL as a warm, inviting place with friendly staff and modern facilities. I also added some illustrative book motifs to make the home page look more interesting and emphasize that SPL is a library.
Finally, I made some changes to the navigation of the current SPL website. I created individual buttons on the main navigation bar in the header so that each navigation link would stand out and be easier to read. Instead of letting the secondary navigation dominate the home page, I moved some of the navigation links to a right scan column and to the footer. In place of the big navigation buttons in the center of the current SPL home page, I added some content that would attract the attention of the people visiting the website and hopefully increase their interest in SPL.