Local Gym

local_gym_wireframe

Summary

On this project, the client was looking for a website for a new gym and wanted to build the site on their existing Go Daddy account. Unfortunately, due to unforeseen circumstances the project was not completed. However, I did finish an initial design using stock images. This illustrates the layout I was going for.

local gym branding
Brand Identity

The wireframe for this site was designed in Xd and needed to capture several design elements. It had to stand out from the competition, incorporate existing social content and be compatible with the Go Daddy website builder. To start with, I did some market research to see what other local gym websites were like. I then based my design on some of the strongest elements (e.g. the use of bold colours and having selling points section at the top). I also picked fonts from google fonts and used bold colours that worked with their content. This was to help tie their content to the page since it didn’t have a clear visual identity.

local gym gallery
Gallery Design

I also added a prominent image gallery below the main hero image. My intention was to use the client’s social media images to make the page stand out and allow visitors to get an immediate impression of the gym. Most of these images were on Instagram so I decided to format the image gallery to fit the square aspect ratio. The images could also have links to Instagram to help with cross-links / marketing.

godaddy layout test
Go Daddy Builder

Since the plan was to build this site using the Go Daddy, I had a look at their site builder to see what the options were. I found that Go Daddy uses a drag and drop builder with pre-built blocks. Unfortunately, it does not allow custom code to be used. So Instead, I experimented with the blocks to see what I could create. Luckily, my design wasn’t too far off but I did need to make some changes to fit the blocks better (e.g. changing padding/spacing, changing font sizes and re-ordering some of the layout).

Resources