Bioprofile Health Coaching is an online platform where consumers get guidance and coaching from an expert (health coach). We've developed our own web based software for this and we want to redesign the user interface.
Important: If you win the contest and if you're great to work with, we will have a lot of future work for you. Our software is in constant development, so we'll need you more often.
We're looking for a 100% mobile responsive website. Both for mobile and desktop. But designed for mobile first. The website needs to be like a Web based app. We're launching an app that opens the website inside the app. It needs to feel like you're using an app, but it is the website. So design like a mobile app.
Our Bioprofile brand and style has been developed already. See our logo attached and some screenshots for a look & feel of our branding. Please use our current branding. Of course you maintain your total creative freedom in what you want to do with this website / web-app.
Think functionality first. It needs to be very clear, simple, for the user to use. We like the idea of an Instagram style mobile website. Where you use icons to navigate through the pages. So put icons for the main pages either at the top, or at the bottom.
There's 4 main pages to the software. Main pages are:
* Bioprofile 300 Analysis
* Analysis Results
* Nutrition advice
3. My Coach
Important (!!!): For the contest, please design the ANALYSIS RESULTS page. For briefing, see below.
DESIGN ANALYSIS RESULTS PAGE.
In our software, when they've done an analysis, they get a result. There's 15 categories they get a result about, shown in a bar graph. Categories are for example: "Insulin", "Cortisol", "Colon health". We show how much percent (%) that category is in balance, using a bar graph.
Each category has it's own bar graph, with several bars. One bar (showing %), per analysis. The user will do several analysis, so keep room for 1, 2, 3, 4, 5 bars in the graph.
Show in the design:
* Icons for the main pages (Analysis/Advice/My coach)
* How will people navigate to SUB-pages (Like Bioprofile 300 Analysis and Analysis Results)?
* Remember, for other Main pages (Like Advice), there's many more subpages. Advice has 5 Subpages (Nutrition advice, Menuplan, Supplements, Workouts, Lifestyle). Make sure you have space for that, also in the mobile design.
* When they're on the Analysis Results page, how will they navigate through the 15 different categories? For each category there's a bar graph.
That is the page to design. The other pages are not relevant for the contest.
When a user is NOT logged in there's just a signup box. For an example, please see:
You may also login to see the software. Use:
Finally (important) the design must be based on the Google Material Design Guidelines.
Eventually, we ofcourse need HTML. Because it's existing software, we need someone to make the PSD into HTML according to our current bootstrap templates. Please see:
Ofcourse, as it's a Design contest, we don't select the winner based on if you can do this. If you can't, no problem :) If you can: We'd love to give you the task of converting the PSD into HTML, after the contest. Just let us know.
Stay focused, functional, easy to use, also for older people (60+). But stay fresh, young and healthy in the look and feel.
Have fun and enjoy the proces :)