I decided I would start on the Calorie Centre, as I had done a few initial designed previously in my layouts, especially to test the effectiveness of Casper as a body font when designing for screen. My main inspiration for this came from the Alarm Clock app researched previously. I really enjoyed the simple layout and design, and I wanted to replicate this in my app. Unfortunately, this meant that the main menu screen had become inconsistent.
I revisited the design of the main menu, but this time in the circular style of the Calorie Centre. I introduced the idea of varying sizes based on the frequency of use - but I found the idea to be too messy and cluttered, and some of the buttons may be too small to interact with.
I also altered the lighter background, giving it a gradient as well as a diagonal 3D effect that I had previously given the coloured backdrops. It still keeps the aesthetics simple, but it adds an extra dimension and stops the layouts looking too flat on a white background.
I also experimented with the typeface of the 'Calories burned' section. So far I had used Casper and Trade Gothic, but I thought I would explore other typefaces before settling with these:
In the end, I think Trade Gothic Regular is the better choice. It is a simple sans-serif typeface and keeps consistency with the logo. I have decided to use the uppercase form, as it separates itself from Casper's interactive lowercase form.
Here are the designs I have so far mocked up onto the appropriate format: