8 months ago


44 The Principles of

44 The Principles of Beautiful Web Design Figure 1.46. A Foundation menu on a mobile display Application: Knoxville Reflexology Group Often, much of what we do as designers is subconscious. We can usually tell you on a choice-bychoice basis why we made specific decisions, but it doesn’t come naturally to verbalize the procedures we follow. Sometimes the best way to explain how to apply graphic design principles is by walking through the design process of an actual client website. Enter: Knoxville Reflexology 40 , an actual web-design project I was involved in for a real client. Knoxville Reflexology Group (KRG) is a group of reflexologists and massage therapists that brings their disciplines and specialities together to create a unified, full-service health, body-cleansing, and massage-therapy operation. The owner, Carrie Wagner, had no design knowledge or technical skills, but needed a site that her coworkers could manage, so she hired someone local who was somewhat familiar with WordPress. A theme was chosen, and pages were made. As the site grew, more and more plugins were added to add more functionality, and the site was crammed full of information. The site, shown in Figure 1.47 became disorganized and outdated. Carrie wanted to be able to relay information to her new and prospective clients, and to cater to higher-end clients. To this end she needed an updated and better organized site with a more streamlined look. 40

Layout and Composition 45 Figure 1.47. The old Knoxville Reflexology Site Carrie recognised that the site needed a complete overhaul, and even had a vision for its redesign: this included adding videos and social media interaction. G Squared Studios was glad to take on the project, and the process was soon underway. Getting Started Usually, clients have specific ideas about what their site should look like and how it should work. Depending on the client, these preconceptions can either help or hinder the design process—more often, the latter. However, on this project, G Squared Studios was given free rein to completely redesign and rebrand the site. It was important to not only understand how the website worked, but who the Knoxville Reflexology visitors were and why they were there. Before design could start, G Squared Studios also went through a discovery phase to find out what Carrie’s short-term and long-term goals were. After all, the redesigned site not only had to accommodate her current goals and needs, but would also have to contain flexibility to enable content to be added in the future. It was also important to understand how visitors navigated the site—a process called user testing. User Testing This is a term for the activity described as “watching over their shoulders.” Monitoring actual user behavior before and after a redesign is a good way to gauge its success. A great DIY tool for user testing is Silverback. 41 41

Layout and Design - In Easy Steps
Boot Camp
30 ways to create amazing web experiences on tablets
Download PDF -
PDF Specimen Booklet - Fontworks UK Ltd
The Complete Guide to a High Converting Website
Web Site Design & Usability Testing - HIPNet
Visual Design and Web Site Usability
Creative Services - Keiger Graphic Communications
slides - HTML5 Developer Conference