Project: Guided Strength Website Re-Design for the University of Wisconsin - Madison: UI/UX Bootcamp
Role: UI/UX Designer
Tools: Figma, Adobe XD, Adobe Photoshop, Adobe Illustrator, and Adobe InDesign
Skills: Photography, Web Design, Wire-framing, Prototype, and Copywriting
Guided Strength is a website I originally designed and built in 2012 for a friend who is a licensed deep tissue and clinical massage therapist. He already had the logo, so I created the color palette to compliment the logo. Everything on the site is organic - the look, the feel, the graphics, are all created from pictures my friend or I took.
Problem Statement
Guided Strength is an outdated website that requires a refresh. I did a slight update to it a couple years ago with plans to redo the entire site - which is where I am at right now.
How Might We...
• Update Guided Strength's website so that it is more user-friendly and accessible.
• Increase user traffic by incorporating better practices.
Challenges
Create a cleaner, more efficient looking and functioning website while making it more accessible for users. Currently, the site does not accommodate mobile screens, so that will have to be changed. A mockup of a mobile screen was created to show how it would look.
Users and Audience
Current clientele and potential clients looking for a clinical massage therapist in the Laramie, Wyoming area.
Roles and Responsibilities
I am responsible for the entire site from the ground up. The only thing I did not create is the Guided Strength logo.
Original Site
This is the first build of the Guided Strength site. It's very basic, yet functional. Looking back, it's a little cringy because I can see where it could be so much better. Back then, I was not aware of the necessity to consider website metrics
Current Site
This is the current site. It was not a complete makeover. I made some minor changes such as switching out the background graphic and creating a new header to reflect the owner's move to Wyoming from Chicago.
My Process
I looked at other sites on the internet to bring myself up to date on current trends in terms of the look and feel of the site.
I also performed an audit on Guided Strength so as to assess its performance, accessibility, best practices and search engine optimization (SEO) metrics.
The site scored relatively high on the SEO scale, but accessibility and best practices need to be improved. By being consistent in employing alternate text on image elements and increasing the contrast of the background and foreground colors, I can improve the accessibility rating. For best practices, I'll need to improve the quality of several images on the site and correct their aspect ratios. Search engine optimization scored the highest at 92, but there is still room for improvement. That can be enhanced by more regular content updates to the site and consistent use of alt tags.
Style Tile
Since Guided Strength already has an established color scheme, and keeping in line with his logo, I built on that and continued using the same color palette. Typography was changed to enhance simplicity and to help convey a peaceful, zen-type site. I used new pictures of the Guided Strength business and added a "Book an Appointment" button so clients can simply make an appointment via the native app.
This is the mockup of the site's refreshed landing page. It is a cleaner more updated look that also allows for appointment scheduling through a mobile app. I took some new photos of my client's new office space and utilized those photos to give users a sense of the Guided Strength business.
Next, I designed a native app mockup for Guided Strength. The idea is to create an app where clients can easily create an account and make an appointment. I kept the color scheme in tune with the Guided Strength brand.
TAKEAWAY
This redesign is still a work in progress. I now have to move into the development stage and publish the changes for my client. I'm excited about the upgrade and creating a more modern, clean-looking, accessible and user-friendly site that will enhance the business of Guided Strength.