In previous challenge you are building a Tablet Android prototype from the provided design, the prototype should support tablet views in one orientation : Landscape view.

There is no backend interaction in this challenge, we will have a follow-up challenge to connect the application with backend.

This Prototype challenge is part of the HPE Live Blitz Challenge Series. Make sure to check it out!

Challenge Requirements

- We have a clickable invisionapp that show the navigation/interaction between the screens. This is a phone prototype clickable app, but it has same flow as the tablet, so you can refer to it for navigation/flow/screens.

- The design is very detailed to show all variations. If there is anything not clear please post questions in forums.

Existing Prototype Base

We have an android studio project that has the phone prototype app, the screens are not complete (profile , notifications are missing and some other screens), we are still working on the phone prototype, but you must use the phone screens as starting point for the tablet layout as you can reuse it and adjust it to get the tablet view.

Note that the phone prototype is only Portrait view, you will build a landscape Tablet view

For tablet we are addressing 7” and 10” tablets, so you need to follow this structure for the resources :

// for 7 inch tables

res/layout-large-land (landscape)

// for 10 inch tables

res/layout-xlarge-land (landscape)

If you see differences between design and prototype then please post in forums to get clarifications from Copilot.

Screen Requirements

All screens in the screenshots provided are in scope, refer to them and the invisionapp and let us know if you have any questions.

These are notes to take into consideration as they are not presented in the invisionapp interactions :

- We don’t have Signup screen nor Forgot password screen, they are out of scope.    

- Dashboard Screen

    - The donut chart should animate on screen loads.

    - Dashboard screen will show widgets, these widgets represents the other screens in the app that has the three vertical dots option where user can choose “Add widget”, so user can navigate to any screen, choose Add Widget and that item will be added as widget to the Dashboard Screen.

- Manage Dashboard Screen

    - Manage widget option allows user to delete or drag widgets to reorder them.

    - We support 4 widgets in this version, each widget represents a corresponding screen (check invisionapp flow), if user removed any widget, user can navigate to that screen and use the ‘add widget’ option to add it back to Dashboard.

- Notifications Popup

    - This popup can pop up in any screen, not only Dashboard.

- Penalties/Account Statement Screen

    - This Month is a pick list.

- Loan Journal/Record Penalties

    - User can navigate between dates by tapping < > icons.

    - The calendar icon will open default date picker control, used to pick a date.

- Settings Screen

    - Search field should filter list on typing.

- My Profile

    - Upload image should be functional to allow user to take picture or load from gallery

- Group Setup

    - Date icon will open default date picker contorl.

- Other notes about screens

    - Edit option in any screen is used to toggle form to Edit mode, In edit mode the Edit option label will be “Save”, tapping on “Save” will switch to View mode. Set the proper input field type for each editable field.

- Most of the screens are forms with editable/input fields, all fields should be working on the expected behavior of that UI control.

    - UI Kit screenshot provides you with guideline of the overall styling we are using in the app.

General Notes

Note the following :

- The app will be Landscape orientation.

- The landscape screenshots are not mentioned in specs but you will get access to them in forums.

- We are targeting tablets with 7” and 10” tablet screens.

- The back button should go back in history (i.e. as if you were pressing back in the browser). If there is no more history (i.e. you're at the first page), pressing back closes the app.

Project Structure

You will use the provided Android Studio project for this application. Follow Android Studio project structure best practices.

// for 7 inch tables

res/layout-large

res/layout-large-land (landscape)

// for 10 inch tables

res/layout-xlarge

res/layout-xlarge-land (landscape)

Technology Overview

- The target platform is Android.

- You will support Android version 4.1.x - 6.x.

- You are allowed to use any supporting open source libraries. Please clearly document use of all such libraries.

Documents

Provided in challenge forums : the existing Prototype, Storyboard and Screenshots

 

Final Submission Guidelines

Deliverable

- Android Studio Project with all source code that addresses the requirements.

- Deployment guide

- Verification steps