3 screens for iOS app

Winner
Contest winning design

Want to win a job like this?

This customer received 6 app designs from 2 designers. They chose this app design from creativoangle as the winning design.

Join for free Find Design Jobs

  • Closed - Design Selected

App Design Brief

I need a settings screen, dashboard and leaderboard screen created for an iPhone fitness app that is nearing completion. I have the template in .psd format that needs to be adhered to for consistency, and there are wireframe sketches (literally pen & paper) that you will translate into .psd files for chopping up and adding into the app. Also I need this by Monday.

Settings Screen:

Using the template psd, I need a basic list similar to the setting screen example attached (no icons needed, just text). The list of settings in order are:
Disclaimer
Edit Profile
Feedback
Help!
Terms of Use
Privacy Policy
Push Notifications (switcher icon on/off)
Facebook Posts (switcher icon on/off)
Twitter Posts (switcher icon on/off)
Twofit Youtube Channel
Log Out

Dashboard:
The dashboard tempalte is attached. This dashboard should be inserted between the Grey banner heading and the Orange 14min standard routine bar. It will shift the graph down. The graph should remain unchanged, all you need to do in sert a cool looking dashboard inbetween the grey and orange bars

Dashboard contents:

Three dials (similar to fitbit, runkeeper etc - see attached as an example) that display your progress

Dial 1: Title: Week
Dial should change colour as score approaches goal (ideally from green to orange as per icon example attached but not necessarily if you can make it look better)
Inside the dial it needs to include
Total: 598
Goal: 2,000
Days left: 5

Dial 2: Title: Improvement
Inside the dial it needs to include:
Start: 350
PB: 700
+100% in bold, centered

Dial 3: Title: Belt
Inside the dial needs to include:
Total: 9,834
Goal: 25,000

Leaderboard Screen:

Again using the template, with the grey banner heading at the top and tab bar at the bottom:

The leaderboard should be divided into two sections. The first is for my personal scores (as a user). The second section is for all players scores.

Section 1:
- Light grey background, dark grey text. Column titles can be pressed to filter columns. When pressed title changes colour from grey to orange (bold). If you can highlight two of the column titles orange that will be good

Section 2:
- White background, dark grey text. Column titles can be pressed to filter columns.
- Row height should be quite small to fit a large number of names on the screen.

Column titles: (sorry the wireframe sketch text is tough to read)
Rank / Name / W/outs / Wins / Week / Total / Belt

Rank - numeric values from 1-999
Name - text field
W/outs - number from 1-999
Wins - number 1-999
Week - number 1 - 99,999
Total - number 1- 99,999
Belt - coloured dot (white, black, red, blue, green, yellow)

For more info, refer http://www.twofit.co/ and download the old app (iphone only) for an idea what we're after.

Industry/Entity Type

Fitness


Colors

Colors selected by the customer to be used in the logo design:

f68e4e

Look and feel

Each slider illustrates characteristics of the customer's brand and the style your logo design should communicate.

Elegant
Bold
Playful
Serious
Traditional
Modern
Personable
Professional
Feminine
Masculine
Colorful
Conservative
Economical
Upmarket

Requirements
Must have
  • Use the .psd template provided. We're not looking for a redesign.
  • The fonts are:
  • LeckerliOne Regular
  • LobsterTwo Bold
  • MeriendaOne Regular
  • MVBoli
  • GothamExtraLight
  • LobsterTwo
Nice to have
  • The best dashboard of all time.
Should not have
  • changes to fonts,

Files
Download all files - 2.8 MB
PSD
JPG
photo_1 Wednesday, 17 September 2014 08:01:31
Wednesday, September 17, 2014
PNG
photo Wednesday, 17 September 2014 08:12:40
Wednesday, September 17, 2014
PNG
IMG_4776 Wednesday, 17 September 2014 08:22:36
Wednesday, September 17, 2014
JPG
photo(1) Wednesday, 17 September 2014 08:36:03
Wednesday, September 17, 2014