My Financial Health Web Mobile Application UI Design Challenge

Welcome to “My Financial Health Web Mobile Application UI Design Challenge”.  In this challenge we are looking for your creativity to design and conceptualize the UI/UX for web based (not native) mobile application.

Let us know in forum if you have questions

Round 1

Submit your initial designs for checkpoint review.
1) Login
2) Landing Page
3) Post Annual Review Insights
    3.1) Credit Risk Rating
    3.2) Understanding Credit Risk Rating

- Important: As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Please ask in the Forum for a MarvelApp prototype link. You will receive 1 MarvelApp prototype for Mobile.
- Make sure to include a URL/Link to your design within your "notes.txt", Important!
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03).

Round 2

Submit your final designs plus checkpoint feedback implemented:
1) Login
2) Landing Page
3) Post Annual Review Insights
    3.1) Credit Risk Rating
    3.2) Understanding Credit Risk Rating
    3.3) Repayment Probability Assessment
    3.4) Security Assessment
4) Drivers of Performance
    4.1) Revenue
    4.2) Expense
    4.3) EBITDA
    4.4) Debit Service Cover

- Important: As part of your final submission, you must update your submission to MarvelApp.
- Use the same MarvelApp prototype you received in checkpoint.
- Make sure to include a URL/Link to your design within your "notes.txt", Important!
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Background Information
For this challenge you will be working on creating the initial user interface for a web based application that will enable operators in the agricultural industry ("The user") to become more confident in better managing their finances by providing them with data and insights about their operations and financial position.

We are very excited to see your design for this challenge!

Key Items to Focus on

• This application must look and feel modern, clean and professional.
• Make your design stand out on a first view!
• Focus on general navigation between all required screens and functionalities
• Easy and intuitive use for tech and non tech users.
• The target device for this application is mobile. So you work using 750px width as your main resolution. Height can be increased if needed.
• So think Mobile First!  When designing your UI.
• We will be running an UI prototype challenge after this one and the required front end framework to develop the user interface will be Bootstrap. So consider this when designing your concepts.
• Avoid ios/android native interactions. As this application will be coded using web frameworks. Please keep in mind that your design should work correct on any mobile device for any OS.
• Only mobile portrait form factor will be considered.
•  Be careful with overall sizing, specially on interactions. Every clickable/tappable UI element must have the correct size for a mobile device.
• Only English language supported.

Required Screens
1) Login

• Provide a way for the farmers to login to the application through email.
• No social connection required.
• Include all necessary UI elements for a login page (Remember me, Forgot Password, etc.
• Show all necessary interactions for this screen, including error messages

2) Landing Page

• This will be the first screen to be shown to the farmers once a successfully login access.
• Consider this screen as the launch pad for all in-app actions.
• Think about: search, navigation, featured content.

3) Post Annual Review Insights
The purpose of this page is to help the user to understand their financial performance at a snapshot. Users will be able to see a yearly review of their financial performance, and would be about to compare performance against other operators in the agricultural industry.

    3.1) Credit Risk Rating

• Provide a way for the user to easily understand what their Current Credit Risk Rating (CCRR) is estimated to be. Also provide a way for this to be compared to historical estimated CCRR, and forecasted estimated CCRR.
• Provide a way for the user to compare their CCRR against other operators in the industry
• Provide a way for users to better understand their Credit Risk Rating

    3.2) Understanding Credit Risk Rating
Provide a way for users to understand what a Credit Risk Rating is, and how it can be calculated. The calculation is based on a variety of factors, two key factors are as below:

• Repayment Probability – the capacity to repay a loan
  • Provide a way to show the user’s Repayment Probability as of today, as well as historical performance (last 5 years)
• Security position – the value of your assets today
  • Provide a way to show the current value of assets as of today, as well as historical performance (last 5 years)

    3.3) Repayment Probability Assessment (Repayment probability is calculated from 3 indicators)     3.4) Security Assessment (Security Position = Value of Liabilities – Value of Assets)

• Provide a way to show the “Value of liabilities ($’m)” and “Value of Assets ($’m)” as of today for the current performance and for the previous 5 years.
• Provide a way to show the value of difference classes of asset
  • Eg: Asset Class 1 will include resource 1.1, resource 1.2, resource 1.3
  • Asset Class 3 will include resource 2.1, resource 2.2, resource 2.3
  • ETC

4) Drivers of Performance
Purpose of this page is to help users better understand their revenue and their costs.
This section is meant to show performance in the following indicators:

• Provide a way to show the “annual income” as of today based on current performance, and for the previous 5 years
• Provide a way for this to be compared to the average
   

• Provide a way to show the “expenses” as of today based on current performance, and for the previous 5 years
• Provide a way for this to be compared to the average

• Provide a way to show the “EBITDA ($)” as of today based on current performance, and for the previous 5 years
• Provide a way for this to be compared to the average

Branding Documentation

• We are not providing a color palette, so you are open to propose the best colors to make this web application look clean and professional.
• Font is open to your criteria. Make it elegant, clean and professional

Target Device and Size

• Design for iphone 6/7/8 devices: 750px width and height adjusted and increased if necessary.
• Think Mobile First! When designing your UI.
• Use proper grid system.

Judging Criteria

• User Experience of the application
• Completeness and accuracy of your UI Design
• How well your design provide a consistent user flow

Submission & Source Files
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.

Submission File
- Submit JPG/PNG for your submission files.
- Submit Marvel App for your design.

Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop, Illustrator, Sketch, XD.

Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on checkpoint feedback.

Stock Photography
Stock photography is allowed in this challenge. See this page for more details.