Challenge Summary
Welcome to "Cool Bank - Top Up Loan App Design Concepts Challenge". In this challenge, we need your help to create a new application where a user can apply for additional home equity to fulfill a number of individual needs like, remodeling, continuing education, to purchase a new car. The application needs to be simple, easy to use, offer a great Call To Action (CTA) to the user, and at the same time it needs to look modern and professional and able to present our brand.
Read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. Let us know if you have any questions in the challenge forum!
1) Home Screen
2) Qualify Test Screen
3) Information Collection Screen
- As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs. Please include the MarvelApp URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
1) Home Screen
2) Qualify Test Screen
3) Information Collection Screen
4) Preview and Submit Screen
5) Other Screen/Features?
- As part of your Final submission, you must replace your checkpoint submission with the final submission into MarvelApp so we can provide direct feedback on your designs. Please include the MarvelApp URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
1) Home Screen
5) Other Screen/Features?
- Show us additional improvements and enhancement that you can provide for this app
- We are open to any kind of suggestion and Ideas!
Read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. Let us know if you have any questions in the challenge forum!
Round 1
Submit your initial design for a Checkpoint Feedback (Desktop and Mobile)1) Home Screen
2) Qualify Test Screen
3) Information Collection Screen
- As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs. Please include the MarvelApp URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Round 2
Submit your Final Design plus Checkpoint Updates (Desktop and Mobile)1) Home Screen
2) Qualify Test Screen
3) Information Collection Screen
4) Preview and Submit Screen
5) Other Screen/Features?
- As part of your Final submission, you must replace your checkpoint submission with the final submission into MarvelApp so we can provide direct feedback on your designs. Please include the MarvelApp URL in your notes.txt.
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Background Overview
Our company is a leading specialist wealth management company that helping our customers with:
- Financial advice
- Superannuation, retirement income and other investment products for individuals
- Superannuation services for businesses
- Administration, banking and investment services for self-managed super funds
- Income protection, disability, and life insurance
- Selected banking products, and
- Investments in shares, fixed interest, property, infrastructure, multi-manager and multi-asset funds.
In this challenge, we want to create a Bank loan extension application that has a focus to trigger and provide great 'call to action' to the user. We will explore a small workflow to capture information from an existing customer to determine eligibility for a credit extension on their existing loan.
Some references to CTA examples (feel free to explore more):
Challenge Goal
Provide a new look and feel that able to encourage people to apply for additional home equity to fulfill a number of individual needs like, remodeling, continuing education, to purchase a new car.
Design Consideration
- New, Professional, and Modern look and feel.
- Offers Great 'Call To Action' Interaction
- Simplicity to add necessary information
- Responsive website (needs to work on Desktop & Mobile devices)
- Easy to understand flow from page to page
- Intuitive for the user; should never be left asking "what do I do next?"
- Simple, clean, modern.
- Easy viewing for pages that may be over overcrowded with information (eg. when hovering over an item will enlarge for easy viewing or similar)
Challenge Forum
If you have any doubts or questions regarding challenge requirements, please ask in our challenge forum:
Screen Requirements
For this challenge, we are looking for the below pages to be designed/considered in your concepts. The screen functionality details listed below are suggested functionality for consideration. Do not allow the suggestions below to impact the creativity of design. If there is a better way to accomplish the same goal, then feel free to take creative liberties.
1) Home Screen
- After successful login, the user will be redirected to this screen
- This screen show's existing interaction areas in the web page that the bank has with customers.
- The key thing the bank wants to achieve is a hire rate of people requesting a loan extension so Feel free to suggest other better ways to engage the customer.
- This is probably the most important screen to in entice the user to proceed. This is a "call to action" screen.
- We want to encourage the customer to evaluate if they qualify for additional loan amount and what that additional money could be used for. Further education, a new car, home renovation, a vacation. The most important thing is to get them started on the journey.
- This screen show's existing interaction areas in the web page that the bank has with customers.
- The key thing the bank wants to achieve is a hire rate of people requesting a loan extension so Feel free to suggest other better ways to engage the customer.
- This is probably the most important screen to in entice the user to proceed. This is a "call to action" screen.
- We want to encourage the customer to evaluate if they qualify for additional loan amount and what that additional money could be used for. Further education, a new car, home renovation, a vacation. The most important thing is to get them started on the journey.
- This screen will show useful information related to the user (User Personalization)
- This screen needs to have a list of Quick Links so they can navigate to other related application, view specific information, etc (for ex, links to "Update How I receive my statements", "Go to My Money Manager", "Find my forms and documents", etc)
- Provide a section where the user can see new and important Message on the screen (on the main screen)
- Marketing Carousel, show list of a carousel (thumbnail, short description, link/button) and show products that suitable for the user or might attract user interest.
- A 'Call To Action' (CTA) to apply and request the additional/top-up loan process.
- If the user already filled in the additional/top up Loan, the user should be able to see the process of loan approval Status from this screen.
- Notification? Search? Profile? Account Summary? etc? What else can we provide on this screen that will increase the user experience when using the app?
2) Qualify Test Screen
- Before able to apply and request for the additional/top-up loan, the user needs to pass the qualifying test first.
- The idea of this screen is, we don't want to have the user fill out this gigantic form with lots of data only to be rejected.
- This screen will let them know whether they are conditionally approved or not.
- In this screen, the user will need to answer two questions:
-- How Much do you want to borrow? (The amount has to be between $5k and $100k)
-- Confirm Current Salary? (we probably have the salary already, but it's possible salary changed after the loan was obtained, so we need to ask again)
- If user input meets the criteria (The salary is sufficient and the amount they are looking to borrow fits in what they qualify for), show that user is conditionally approved and the user can continue the top up process. The user will next be requested to provide additional information to confirm their eligibility.
- If user input does not meet the criteria, show the rejection status confirmation.
3) Information Collection Screen
- Once user passed the Qualify Test screen, they will be able to provide full information required for the Loan Top Up.
- Full required information fields can be found at the challenge attachment "Easy Increase form INT-S"
- The Bank might already have some of the user information, so you just need to create data that needs Customer Input Required (check "Wireframe Whiteboard Session")
- We are not looking for some boring approach like ordinary form wizard, please explore how to create a great interaction that able to engage the user through the gigantic form filling process
- The user should be able to save their progress at any time and close the form. When a user wants to continue and open the form, it should show the user latest process.
- The user should be able to see their progress status (in percentage)
4) Preview and Submit Screen
- Once the user finishes the form, the user should be able to review all the information in preview mode before submitting the form.
- A user can edit the information on the form if there is any missing/wrong information added.
5) Other Screen/Features?
- Show us additional improvements and enhancement that you can provide for this app
- We are open to any kind of suggestion and Ideas!
Important:
- Keep things consistent. This means all graphics styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
Marvel Prototype
- We need you to upload your screens to Marvel App.
- Please send your marvel app request to fajar.mln@gmail.com (Challenge Copilot)
- You MUST include your Marvel app URL (in your marvel app prototype, click on share and then copy the link & share it with your notes/comment this link while you upload).
Branding Guidelines
- Use our Branding Guidelines Docs for colors and layout recommendation
- Fonts (use Archer and Open Sans, see our branding guidelines)
- The design style is open to designers
Documentation (Check Challenge Attachment)
- Branding Guidelines.zip
- Wireframes (Rough Flow sketch)
- Top Up Form Collection
Target Devices
We are targeting for Responsive Website
- Desktop: 1366px minimum width with height adjusting accordingly
- Mobile: 750px width with height adjusting accordingly
Target Audience
- Existing bank customers with a mortgage
Judging Criteria
Your submission will be judged on the following criteria:
- Overall idea and execution of concepts
- How well does your design align with the objectives of the challenge
- Execution and thoughtfulness put into the solving the problem
- The overall design and user experience
- Cleanliness of screen design and user flow
- Ease of use
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 image files based on Challenge submission requirements stated above
- MarvelApp link for review and to provide feedback
Source Files
All source files of all graphics created in either Adobe Photoshop, Illustrator (might need to convert it to photoshop later) or Sketch and saved as an editable layer
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors.
Please read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. It is important that you monitor any updates provided by the client or Studio Admins in the forums. Please post any questions you might have for the client in the forums.