Initial Designs – Training Guide

I came up with various design ideas to display the training guide, I produced these using Adobe Photoshop. I wanted to display data visually rather than in a basic table but also wanted it to be clear and simple for users to understand. I incorporated bright colours and the runner icon to make it visually appealing to the intended audience.

guideguide2guide3 copyguide5

From this, I went on to develop the first idea as felt that using bars makes it extremely clear for users to see the required training runs. For example, for shorter runs the bar length will be shorter and for longer runs the bar length will be longer. I transformed my digital design into a html mockup as well as creating mockups for the home and login pages.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s