ROLES

ALL

MOTIVE

Course Project

Overview

We had to re-design a site as a part of our GBDA 228 course. This project is not affiliated with the company in any way. We had to critique their current website, and provide design rationale on our changes. We started by creating a site map, and then moved on to making the high fidelity prototype.

The Problem

One of the biggest issues I commented on was how the navigation bar was unbalanced test-wise and lacking in personality. More specifically, the placement of the text on the navigation bar in the original site design is not centered vertically. In addition to this, the spacing of the page tabs are too close to one another to differentiate the individual tabs, which reduces the quality of user usability. I improved the navigation bar by making the red colour more similar to that of the logo and spaced out the tabs of the navigation bar. I also gave the navigation bar a more modern “floating” look. In my sitemap specifically, I improved the organization of pages and sub-pages by reducing the number of main pages that were useless to have, such as the “training” page that I moved into programming. This is because their training is a part of their programming and having a tab for it in the navigation bar is redundant.

The Solution

My redesign improves a variety of other factors in design as well, such as the fonts and colour palette. I chose the “Capture It” font because of the rough vibe it gives off, but made sure to use it sparingly as to not make it overly unprofessional or cartoonish. I kept the website's original red colour theme, but made it more vibrant and had a complimentary colour in order to supplement the more monotone colours. The design of the landing page was redesigned and improved through the reorganization of the individual sections. This was done by making sure the mission of the Pan Am Boxing Gym is the first thing that’s seen, instead of the slideshow of upcoming events.


Other changes in usability include the navigation bar, which makes it easier for users to differentiate which page they want to go to. Additionally, I reorganized the navigation bar so that it would be more clear what each section entailed by switching up title names (ie. the “getting started tab). User usability was also improved on the “Classes” page, where each class description included a button that intends to take the user to the class sign up page (on Mindbody, an external classes management/booking site). In terms of content itself, the organization of the content specifically on the classes page was changed to be more consistent, as well as have better flow. I added a section from another page on their site that talks about “Boxing is for everyone”, in order to better solidify how Pan Am is a boxing gym that cares about community and inclusivity.



The Process

ROLES

PanAm

< back

PanAm Boxing Gym

Site Re-Design (unofficial)

SKILLS

ui/ux Research

Branding

Create a free website with Framer, the website builder loved by startups, designers and agencies.