The Re-Design of the Seattle Performance Medicine Website


Seattle Performance Medicine is a facility that focusing on athletic health and exercise performance. Seattle Performance Medicine provides specialized care for individuals seeking to improve metabolic health, athletic and exercise performance. Their goals are to identify disease, risk factors and physiologic imbalances early, and to implement specific patient-driven strategies to improve overall health and performance. The facility conducts evaluations in areas of stress adaption assessment, aerobic and anaerobic exercise, body composition, metabolic and strength testing. In addition they assist athletes suffering from overtraining syndrome, a condition that leaves athletes tired, with irregular sleep patterns that can alter moods and impair athletic recovery and performance.

Working at Seattle Performance Medicine these last few months has not only enable me to use my design, layout and user interface skills but to also develope new skills involving Search Engine Optimization of the website and of the off-page brand sites. I've created a social media presence for the company utilizing the different platforms such as Facebook, Google+, You Tube and Vimeo to achieve this. I've claimed and verified the companies brand and create the look and feel of each page as well as selected and implemented content to help grow the social media presence thus increasing followers. It has been an interesting and knowledge growing experience.

I've been able to get a closer look at the challenges that athletes face when trying to improve their sports performance and what services are available to help them achieve their goals. Seattle Performance Medicine V02 Max exercise testing equipment is one of the tools that the company employs to test athletes, you can read more about it by viewing the article written in the Huffington Post. Some of the others tools are the Racermate Velotron which electronically calibrated ergometer when testing cyclist or the Concept II rowing ergometer which is what rowers test on to discover their fitness level and exercise metabolic rate.


Seattle Performance Medicine wanted to update their website to reflect todays clean and modern designs. Guidance was provided to stream-line the interactivity of the site and update the logo graphics. The results were a clean layout design with beautifully inviting imagery that differentiate the site from other sports and wellness centers.

THE PROCESS: Gathering Data

Quality Data was provided after the clients observevation of their users. We needed to ensure that those who tend to click the drop down link without realizing there is link in the main menu wasn't being over look. Another Challenge was to follow the best practices of SEO making the site "more readable" and "search engine freindly" without loosing the important medical details. Organizing the amount of data so that the content did not appear over whelming to users as well as making it easily accessable. ----The first design change was to reduce the length of the menu items as well as the amount listed in the main menu.


Kalesse is very busy CEO of start-up company and enjoys long-distance competitive biking in her spare time. She turns to SPM to help improve her sports performance but wants to quickly access the information that she needs without searching through lots of content to find it.


To help come up with a solution I thought it would be best to search the net to see what other Heath and Wellness sites were using in their layouts. I wanted to stay open to potential ideas that I may have not thought of that so that I could create the best possible design for my client. The Client wanted to use a Content Management System to allow them to update the content on their own in the future. Knowing that I would be using a specific Template built for the use of CMS I also need to study all of the elements that were provided to see how I could incorporate any useful elements to help improve the overall designs. (**note: the wesite that you are currently viewing was creating using HTML, CSS and JavaScript Frameworks.**)

Designs and Prototyping

To help avoid "scope creep" for this project I decide to create the prototype using the CMS itself because there isn't any coding required and the changes could be quickly implemented. I quickly made a design layout of how the interface would look by either using placeholder elements or the images that were provided a head of time. After several conversations with the client and a few revisisions to the template final adjustments such as: adding additioanl CSS and manipulating PHP code, the project was approved for final development.

Images that were provided were resized and uploaded. Many new images were selected that best fit the design and brand of the business. Photoshop was used to increase the width of images to fit the banner and sliders elements for each page. Illustrator was used to redesign and updated the art work. SEO was applied to each page to improve search engine optimization and ranking. The results for the final design can be found by using the link below.

The FinalDesign for SPM Website

Seattle Performance Medicine screen shot

View Web Design

The final product design is a dynamic responsive website that is viewable on all web devices. The new site has visually stimulating imagery and layout design that accompanies the informational content.

Visit WebSite