Fitmove

User Problem

Fitness websites and applications are often not clearly structured
Their chosen color schemes often do not support the company's core business

Goal

Providing a consistent web and app presence from a fictional fitness center

Time

3 months

Role

All (Illustrator, Photoshop, Adobe XD, InDesign)

Specification

Research

Paper Prototype

Graphical Manual (GM)

Digital Mockups (DM)

Specification

During my semester abroad at Linnaeus University in Växjö, Sweden, I took the class Digital Graphics 1. At the beginning of that class we had the assignment to design a website and mobile application for either a restaurant, fitness, event or tourism website. I chose the fitness theme.

Part of Linnaues University's campus

Source: https://www.educations.com/study-abroad/linnaeus-university/

Research

Firstly, I researched about my future users and who I want adress. I also gathered information about what other fitness studios currently include in their websites as well as what they do good and what could be improved. In the end I listed what I want structured in which way on my website.

Users

Trainers at the fitness studio
Athletic people, who like to work out on fitness equipment and/or take part at courses
People, who mainly want to take part at courses
People, who want to inform themselves about different fitness studios

What I liked about other fitness websites

Button for test training easy to find
Adding emotional pictures
Showing what you are good in or what services you deliver
Map with the locations of the studio
Special offers for groups like students or seniors

What could be improved

3D Walkthrough of the studio
Easy way to the booking of classes / overview of classes
Login in the navigation bar and as a button
Color choices

Examples of my chosen features

Pricing system with different modules and discount possibilities as well as a testing contract

Easy access to course overview with possibility to book or log in to book

Have a look at the staff and trainer with the possibility to contact every trainer individually

Chart which shows how many people are currently at the studio

PPT

After I gathered all the necessary information in the first step, I know started with creating paper prototypes.

Before transfering the Paper Prototype into Adobe XD, I created a Graphical Manual to decide on the color scheme, used fonts, images, icons and the logo.

Logo

Before showing my Graphical Manual, I want to explain how I ended up with my logo. I firstly sketched a lot of different ideas on paper, transfered them into Illustrator and began experimenting a lot more.