Challenge Overview
Welcome to the Kidney App Native iPhone App Prototype Challenge.
Overview
We are building a native mobile application that patients and caregivers can use to make smart nutrition decisions informed by their own laboratory/biometric data and personal goals. You will be focused on creating how this application should look and represent the all the data.
The goal of this challenge is to take the provided UI Design and convert it to a native iPhone application prototype. We built a starter project based on the wireframes - you are expected to work off that starter project
Challenge Requirements
In this challenge you will develop an iPhone app that has all screens provided in the provided design. Note the following:- We have provided the PSD source files in the Github repo (details in forum)
- All design assets, fonts are provided in the Github repo (details in forum)
- Marvelapp with the overall app flow is provided the forums (details in forum)
- If there is anything not clear in the designs, please post questions in forums.
- We have a high level architecture document provided in the forums, please follow it. If you need to deviate from the doc, please discuss in the forums.
Screen Requirements
All screens and all elements in the design that are listed below are in scope, refer to them and and let us know in the forums if you have any questions. The notes below are to help understand some screens/ elements better but aren’t exhaustive.01_Welcome.png
- This is the welcome screen, user will need to click ‘NEXT’ to move to next screen
0_2Welcome.png
- User needs to tap the right arrow button to move to next screen
- Follow the storyboard, should display the 2nd card partially towards the right as shown in design
0_3Welcome.png
- User needs to tap the right arrow button to move to next screen
- Follow the storyboard, should display the 2nd card partially towards the right as shown in design
0_4Welcome.png
- User needs to tap the ‘Agree’ button to move to next screen
- Follow the storyboard, clicking ‘Disagree’ should show a confirmation dialog ‘Click YES to exit or click NO to continue using the app’
- Clicking ‘Yes’ should exit the app
- Clicking ‘NO’ should keep user on 0_4 screen so they click ‘Agree’ again
1_1Login.png
- Show EMAIL, PASSWORD as hint text in respective input fields. The help text should disappear as soon as user taps on respective fields.
- Forgot Password & New User? Sign Up Now are clickable but dead links
- Disable Login button until both email and password are filled
- Email field should be validated
- Password field should be masked
1_2Login.png
- Shows examples for invalid/ blank email and invalid/ blank password. Use this style for validating params on other screens as well.
- Shows home screen, follow the storyboard
- All tabs, hamburger icon are clickable
- User should be able to swipe right or click on dot selectors to move to 2_2
2_2Home.png
- All tabs, hamburger icon are clickable
- User should be able to swipe right or click on dot selectors to move to 2_3
- User should be able to swipe left or click on dot selectors to move to 2_1
- The top right icon (target/arrow) is to show the rewards available to user
2_3Home.png
- All tabs, hamburger icon are clickable
- User should be able to swipe left or click on dot selectors to move to 2_2
2_4Home.png
- Opens on clicking the Hamburger menu
3_1User-profile.png
- Opens on clicking ‘My Health Profile’ from the menu
4_1Food-Intake.png
- Shows the Food tab
- Should be a 2x2 grid
- Tapping add new meal takes user to next screen
4_2Add-new-meal.png
- User should be able to chose one meal type from top selector- Today is a calendar control for date selection
- Time is a time control for time selection
- Meal or Liquid item - Text box
- Amount - Should be a positive numeric value
- Unit - add dummy values - 1, 2, 3 and so on
- Clicking Camera icon should allow clicking image from camera or picking from gallery
- Selected image is shown, clicking x must remove it
- Except image, all other fields are mandatory, disable ‘ADD NEW MEAL’ button until all fields are filled with valid values
- Show validation errors in same style as 1_2
4_3Activity-Tracking.png
- Shows the ‘Workout’ tab
5_1User-History-&-Trend-metrics.png
- Shows the Charts tab
- User should be able to choose between Blood Sugar, Body Weight, Potassium
5_2User-History-&-Trend-metrics.png
- Shows the Charts tab
- Shows the Body Weight charts
5_3User-History-&-Trend-metrics.png
- Shows the Charts tab
- Shows the Potassium charts
7_1Nutrition&Drug-Interactions.png
- Shows the Medication tab
- User should be able to choose between Nutrition or Drug Interactions
- Each list item is clickable and takes user to next screen
- Shows the detail for each nutrition item
- Clicking < takes user back to previous list view
7_3Nutrition&Drug-Interactions.png
- Shows the Medication tab
- Shows the case when user clicked on ‘Drug Interactions’
- Each list item is clickable and takes user to next screen
7_4Nutrition&Drug-Interactions.png
- Shows the detail for Drug interaction item
- Clicking < takes user back to previous list view
8_1Patient-Resources.png
- User navigates to this screen by selecting ‘Resource Library’ in the left menu
- Each list item is clickable and takes user to next screen
8_2Patient-Resources.png
- Shows the detail for resource item
- Clicking < takes user back to previous list view
9_1Goals.png
- Follow the storyboard
- Clicking ‘Sync Now’, ‘Add Water’ and ‘Add Fruits or Vegetables’ are dead links
- Clicking ‘Add New goal’ takes user to next screen
9_2Add-new-goal.png
- Follow the storyboard- User should be able to choose one option from the top selector menu
- Leave data for other tabs blank
- Clicking ‘Save My Goal’ should take user back to 9_1
- Frequency should be Daily, Weekly, Monthly
- Reminder can be toggled on/off
- Unit should be 3 glasses, 6 glasses, 9 glasses, 12 glasses (read from JSON)
9_3Edit-goal.png
- Follow the storyboard
- User should be able to choose one option from the top selector menu
- Leave data for other tabs blank
- Clicking ‘Save My Goal’ should take user back to 9_1
- Clicking ‘Delete My Goal’ should show a confirmation modal and if user confirms, the goal should be deleted from 9_1
- Frequency should be Daily, Weekly, Monthly
- Reminder can be toggled on/off
- Unit should be 3 glasses, 6 glasses, 9 glasses, 12 glasses (read from JSON)
General Notes
Note the following :- The app will be locked to Portrait mode
- Show a progress indicator (spinner) when transitioning between screens
- Only iPhone is in scope. The app will run in scaled mode on iPad device. App should support all devices above from iOS11 and above
- The implementation must be a native application, native controls must be used wherever possible
- All code must be written in Swift 4 and run in the latest version of XCode
- Do not hardcode any data directly into the app. All data must be read from JSON files so it can later be replaced directly with appropriate API calls.
- Please ask in the forums if you wish to use any open-source third-party libs to ensure there are no license violations
Final Submission Guidelines
- XCode project with all source code that addresses the requirements
- Deployment guide with configuration & verification steps. Describe all config params and include steps to run
- Demo video (Mandatory and will be scored down if not provided)
- Winner will be asked to raise a MR to the repo