Challenge Summary
Welcome to the "RUX - 72HR Retirement Benefits Mobile App Design Concept Challenge"! In this RUX Challenge, we need your help to design a new and unique mobile application focusing on provides an excellent customer experience by giving the user 24/7 access to any form of plan and educational information. We are looking for your best ideas and concepts to WOW our customer!
What is a RUX Challenge?
The RUX (Rapid User Experience) challenge uses the same format as our famous LUX Challenge except it is not "Live" at an event. The RUX Challenge Series provides you with an opportunity to show digital leaders from some of the largest companies in the world just how good your concept and user experience (UI/UX) design skills are.
RUX (Rapid User Experience) challenges are fast, fun, and have more chances for you to capture prize money!
Note: You do not need to have RUX challenge experience to join this challenge - Just jump in and give it a try! Make sure to follow the challenge details, the challenge forum and ask questions.
Background Overview
Our client is one of the largest provider of brokerage services, variable and fixed annuities, educational account services, financial planning, asset management, and trust services. They are going to build a mobile application for Retirement Service Participant to give some education about their 401K plans and usage under DC (Defined Contribution).
The goal of this challenge is to take the provided design problem, analyze the user experience and provide design concepts and visual ideas on how the application might look and work!
Design Problem
We need to create a new mobile application for (401K) Participant customer journey. The mobile application should give a new and unique experience to the user and should be able to securely log in and check balance, and should provide the ability to update information and also provide participant education in terms of FAQs and User information on 401K.
We are looking for fresh concepts and ideas on the UI/UX interactions for this application experience.
Challenge Goals
- Create a Modern and Unique Mobile experience for the 401K Participant
- Improve customer experience by giving them 24*7 access to any form of plan and educational information
- Deliver custom portals, integration and mobile app solutions quicker and at higher quality
- Increase self-sufficiency with customers (both employers and employees)
RUX Challenge Timeline and Rolling Checkpoint
- Submission Start: 03/30/2018 at 15:00 PM EDT
- Rolling Checkpoint Start: 04/01/2018 at 07:00 AM EDT
- Submission End: 04/02/2018 at 15:00 PM EDT
We are offering 5 Prizes Placements
1) 1st Placement: $2000
2) 2nd Placement: $1500
3) 3rd Placement: $1000
4) 4th Placement: $750
5) 5th Placement: $500
- Plus 8 placements for Rolling Checkpoint prizes @ $50 each!
Note: Important Rolling Checkpoint Details
-tgerring (Trevor Gerring) and teevics (Vignesh Thangavelu) will be available for early submissions and Rolling Feedback!
- We will answer questions and provide Rolling Feedback as fast as possible.
- You must watch the Forum for your feedback!
*All initial qualifying checkpoint submissions will win $50 (8 Placements)
User Story
John Doe is an employee of ACME company in America who enrolled retirement service plan from our client. He wants to know where his funds are invested. He logins through the app, in the dashboard, he is able to see his balance amount, some nice graphs, metrics to see where his funds are invested and distributed. And also he wants to know about various plans and educational stuff about the services they offer. He navigates to Information service, under "investment advice" he is able to see some interactive video or animation or written contents of tutorials. He can able to use tools and calculator to determine the right plan for him. He can able to activate chatbot from dashboard which will assist him to complete some transactions.
Design Consideration
- Should be clean, open, and modern looking
- Streamlined design and user flow
- Show us concepts and ideas for how things could be designed and function. Maybe it is one screen (dashboard) with overlays and flyout windows. Maybe it is multiple screens and panels for different kinds of functionality and tasks. We are open and looking for your ideas and solutions. Remember the application should remain easy to use, fast, and not cumbersome for the user.
General Requirements
Screen Sizes
- This application is going to be developed as a Mobile Application
- iPhone: 750px x 1334px
Branding
- This is going to be a professional corporation application. Come up with own branding guidelines which will give some corporate look
- Find some inspiration for color branding from some corporate insurance, investment companies
- This should be a Modern, Simple, and Professional looking application
- We are looking for concepts and ideas!
Downloads
https://drive.google.com/drive/folders/1ShHZQH0v6WxpmYc3B1MqRk6RupMDeQ4D?usp=sharing
- ChatBot_Design_401k.docx
- Wireframe_v3.pptx
Required Screens/ Functionality
Please create the following screens on the Mobile Application Portal, enabling the below high-level function:
0) Navigation
- We need a simple and easy navigation that can be used throughout the app
- Provide clear and clean user navigation
- Some icons to help menu/navigation visualization?
- Create it as left sidebar navigation?
- Drop down features for navigation that have sub-navigation?
- Follow best practice for native mobile navigation
- Provide active state for the menu navigation
- Here is the Menu content that needs to be create:
My Profile
Retirement Benefits (Create it as Drop Down, when clicked, will open sub-nav)
- My Retirement
- 401 (K)
- 403 (B)
- 529
Information Center (Create it as Drop Down, when clicked, will open sub-nav)
- Introductory Letter
- Plan Highlights
- Planning & Education Information
- Fund Data Sheet
- Forms
About Us
Settings
Chatbot
1) Splash and Login Screen
No Wireframe References
- Create a splash screen that will appear by default when user open the application
- Provide ordinary Login form (username/password) along with forgot a password and register link when user reaches login form.
- Needs to have error scenario when user enter the wrong credential
- Please create a simple logo for this application, don't think too much about the logo, just made a simple one that aligns with the app purpose, give more focus on the main requirements
- Use "Retirement Benefits" as the application title
2) Dashboard Screen
Wireframe References "Wireframe_v3" Page 2
- The user will land on this screen upon successful login attempt (My Retirement screen)
- Dashboard needs to display user available balance fund and how the allocated across Asset classes, Holdings and Sources.
- Need notification icons on the home screen and to reach chatbot.
- More prefer to see the summary information on a chart.
- Status of his plan so far (healthy/excellent, bad, etc)
- Prediction of the 401K plan based on user age (40, 60, 75 years), etc.
- Target plan, the recent plan that the user joined?
- Come with our any other idea what are details that users need to find in the dashboard
3) Planning and Education Information Screen
Wireframe References "Wireframe_v3" Page 4
- We need to visualize how the category page layout should appear in the app
- Needs some innovative ways to organize the sub-categories.
- There are 3 sub-categories needed to be created here:
-- Investment Advice
-- Tools and Calculators
-- Asset Allocation
- We want your idea to organize these sub-categories. Like tiles, grid, tabs? We are open to your idea.
4) Investment Advice
Wireframe References "Wireframe_v3" Page 5
- Under Planning and Education Category, there is investment advice subcategory.
- Think of it as an online course, where the user can view series of videos, presentation deck or animations that explain about particular topics related to investment.
- Each investment advice might have few or more contents on it, for example, for advice topic “Why should I join a retirement plan?”, there might be 5 content contains videos, presentation deck, articles that explain the topics.
- In this screen, the user will be able to search and explore all advice lesson related to investment. The user also will be able to filter and find various educational video and animation contents about the retirement plan, retirement planning, transition to research.
- The user will be able to view how many people already see the advice lesson, will be able to like/dislike videos, commenting the lesson, bookmarking, etc
- Provide details view where the user can see the content list of each investment advice.
- A user will be able to save the progress of their advice lesson when watching particular topics and continue later to finish the topics.
- Do some research about it. Need an interactive and innovative approach to this
5) Tools & Calculator
No Wireframe References
- The user should able to do some calculations to choose their plans or to check the long-term result for their investment.
- There are a lot of calculators that can be used to calculate user plan, for example:
-- Retirement Income Calculator
-- Retirement Nest Egg calculator
-- College savings option tool
-- Retirement Plan Loan Calculator
- Please googling one of the calculators from the above and simulate how to calculate the user plan.
6) Chatbot Screen
Wireframe References "ChatBot_Design_401k.docx"
- This application will have an AI support to assist and help the user to get an answer to their inquiry
- User logs on to the app and is assisted by a chatbot (Cynthia) to complete a transaction
- We need both scenarios in the docs to be simulated.
7) Any Additional Functionality or Screens
- Show us concepts and ideas for how things could be designed and function.
- We are open and looking for your ideas and UX solutions.
8) Marvel Prototype
- We need you to upload your file into Marvel App.
- We want to use Marvel App to provide direct and fast feedback! We can also track your design updates and screen versions within Marvel App!
- If possible, please link/provide hotspot in your Marvel
- Make sure your screen(s) are in the correct viewing order (number them 00, 01, 02, 03, etc.)
- If you do not have access to the Topcoder Marvel App Account please contact challenge copilot fajar.mln@gmail.com
- You must include your Topcoder Marvel App URL within your Notes file
9) Presentation Screen - 1920x1080 (16:9 Ratio)
- In a RUX challenge, this screen is the way to showcase your concept so keep it simple and make it look good!
- If you were walking into a meeting and needed to sell your idea - use this screen to showcase your concept.
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
Target Audience
- Retirement Plan Participant
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.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as a layered PSD file, or Adobe Illustrator as a layered AI file or Sketch!
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 Rolling Checkpoint feedback.
What is a RUX Challenge?
The RUX (Rapid User Experience) challenge uses the same format as our famous LUX Challenge except it is not "Live" at an event. The RUX Challenge Series provides you with an opportunity to show digital leaders from some of the largest companies in the world just how good your concept and user experience (UI/UX) design skills are.
RUX (Rapid User Experience) challenges are fast, fun, and have more chances for you to capture prize money!
Note: You do not need to have RUX challenge experience to join this challenge - Just jump in and give it a try! Make sure to follow the challenge details, the challenge forum and ask questions.
Background Overview
Our client is one of the largest provider of brokerage services, variable and fixed annuities, educational account services, financial planning, asset management, and trust services. They are going to build a mobile application for Retirement Service Participant to give some education about their 401K plans and usage under DC (Defined Contribution).
The goal of this challenge is to take the provided design problem, analyze the user experience and provide design concepts and visual ideas on how the application might look and work!
Design Problem
We need to create a new mobile application for (401K) Participant customer journey. The mobile application should give a new and unique experience to the user and should be able to securely log in and check balance, and should provide the ability to update information and also provide participant education in terms of FAQs and User information on 401K.
We are looking for fresh concepts and ideas on the UI/UX interactions for this application experience.
Challenge Goals
- Create a Modern and Unique Mobile experience for the 401K Participant
- Improve customer experience by giving them 24*7 access to any form of plan and educational information
- Deliver custom portals, integration and mobile app solutions quicker and at higher quality
- Increase self-sufficiency with customers (both employers and employees)
RUX Challenge Timeline and Rolling Checkpoint
- Submission Start: 03/30/2018 at 15:00 PM EDT
- Rolling Checkpoint Start: 04/01/2018 at 07:00 AM EDT
- Submission End: 04/02/2018 at 15:00 PM EDT
We are offering 5 Prizes Placements
1) 1st Placement: $2000
2) 2nd Placement: $1500
3) 3rd Placement: $1000
4) 4th Placement: $750
5) 5th Placement: $500
- Plus 8 placements for Rolling Checkpoint prizes @ $50 each!
Note: Important Rolling Checkpoint Details
-tgerring (Trevor Gerring) and teevics (Vignesh Thangavelu) will be available for early submissions and Rolling Feedback!
- We will answer questions and provide Rolling Feedback as fast as possible.
- You must watch the Forum for your feedback!
*All initial qualifying checkpoint submissions will win $50 (8 Placements)
User Story
John Doe is an employee of ACME company in America who enrolled retirement service plan from our client. He wants to know where his funds are invested. He logins through the app, in the dashboard, he is able to see his balance amount, some nice graphs, metrics to see where his funds are invested and distributed. And also he wants to know about various plans and educational stuff about the services they offer. He navigates to Information service, under "investment advice" he is able to see some interactive video or animation or written contents of tutorials. He can able to use tools and calculator to determine the right plan for him. He can able to activate chatbot from dashboard which will assist him to complete some transactions.
Design Consideration
- Should be clean, open, and modern looking
- Streamlined design and user flow
- Show us concepts and ideas for how things could be designed and function. Maybe it is one screen (dashboard) with overlays and flyout windows. Maybe it is multiple screens and panels for different kinds of functionality and tasks. We are open and looking for your ideas and solutions. Remember the application should remain easy to use, fast, and not cumbersome for the user.
General Requirements
Screen Sizes
- This application is going to be developed as a Mobile Application
- iPhone: 750px x 1334px
Branding
- This is going to be a professional corporation application. Come up with own branding guidelines which will give some corporate look
- Find some inspiration for color branding from some corporate insurance, investment companies
- This should be a Modern, Simple, and Professional looking application
- We are looking for concepts and ideas!
Downloads
https://drive.google.com/drive/folders/1ShHZQH0v6WxpmYc3B1MqRk6RupMDeQ4D?usp=sharing
- ChatBot_Design_401k.docx
- Wireframe_v3.pptx
Required Screens/ Functionality
Please create the following screens on the Mobile Application Portal, enabling the below high-level function:
0) Navigation
- We need a simple and easy navigation that can be used throughout the app
- Provide clear and clean user navigation
- Some icons to help menu/navigation visualization?
- Create it as left sidebar navigation?
- Drop down features for navigation that have sub-navigation?
- Follow best practice for native mobile navigation
- Provide active state for the menu navigation
- Here is the Menu content that needs to be create:
My Profile
Retirement Benefits (Create it as Drop Down, when clicked, will open sub-nav)
- My Retirement
- 401 (K)
- 403 (B)
- 529
Information Center (Create it as Drop Down, when clicked, will open sub-nav)
- Introductory Letter
- Plan Highlights
- Planning & Education Information
- Fund Data Sheet
- Forms
About Us
Settings
Chatbot
1) Splash and Login Screen
No Wireframe References
- Create a splash screen that will appear by default when user open the application
- Provide ordinary Login form (username/password) along with forgot a password and register link when user reaches login form.
- Needs to have error scenario when user enter the wrong credential
- Please create a simple logo for this application, don't think too much about the logo, just made a simple one that aligns with the app purpose, give more focus on the main requirements
- Use "Retirement Benefits" as the application title
2) Dashboard Screen
Wireframe References "Wireframe_v3" Page 2
- The user will land on this screen upon successful login attempt (My Retirement screen)
- Dashboard needs to display user available balance fund and how the allocated across Asset classes, Holdings and Sources.
- Need notification icons on the home screen and to reach chatbot.
- More prefer to see the summary information on a chart.
- Status of his plan so far (healthy/excellent, bad, etc)
- Prediction of the 401K plan based on user age (40, 60, 75 years), etc.
- Target plan, the recent plan that the user joined?
- Come with our any other idea what are details that users need to find in the dashboard
3) Planning and Education Information Screen
Wireframe References "Wireframe_v3" Page 4
- We need to visualize how the category page layout should appear in the app
- Needs some innovative ways to organize the sub-categories.
- There are 3 sub-categories needed to be created here:
-- Investment Advice
-- Tools and Calculators
-- Asset Allocation
- We want your idea to organize these sub-categories. Like tiles, grid, tabs? We are open to your idea.
4) Investment Advice
Wireframe References "Wireframe_v3" Page 5
- Under Planning and Education Category, there is investment advice subcategory.
- Think of it as an online course, where the user can view series of videos, presentation deck or animations that explain about particular topics related to investment.
- Each investment advice might have few or more contents on it, for example, for advice topic “Why should I join a retirement plan?”, there might be 5 content contains videos, presentation deck, articles that explain the topics.
- In this screen, the user will be able to search and explore all advice lesson related to investment. The user also will be able to filter and find various educational video and animation contents about the retirement plan, retirement planning, transition to research.
- The user will be able to view how many people already see the advice lesson, will be able to like/dislike videos, commenting the lesson, bookmarking, etc
- Provide details view where the user can see the content list of each investment advice.
- A user will be able to save the progress of their advice lesson when watching particular topics and continue later to finish the topics.
- Do some research about it. Need an interactive and innovative approach to this
5) Tools & Calculator
No Wireframe References
- The user should able to do some calculations to choose their plans or to check the long-term result for their investment.
- There are a lot of calculators that can be used to calculate user plan, for example:
-- Retirement Income Calculator
-- Retirement Nest Egg calculator
-- College savings option tool
-- Retirement Plan Loan Calculator
- Please googling one of the calculators from the above and simulate how to calculate the user plan.
6) Chatbot Screen
Wireframe References "ChatBot_Design_401k.docx"
- This application will have an AI support to assist and help the user to get an answer to their inquiry
- User logs on to the app and is assisted by a chatbot (Cynthia) to complete a transaction
- We need both scenarios in the docs to be simulated.
7) Any Additional Functionality or Screens
- Show us concepts and ideas for how things could be designed and function.
- We are open and looking for your ideas and UX solutions.
8) Marvel Prototype
- We need you to upload your file into Marvel App.
- We want to use Marvel App to provide direct and fast feedback! We can also track your design updates and screen versions within Marvel App!
- If possible, please link/provide hotspot in your Marvel
- Make sure your screen(s) are in the correct viewing order (number them 00, 01, 02, 03, etc.)
- If you do not have access to the Topcoder Marvel App Account please contact challenge copilot fajar.mln@gmail.com
- You must include your Topcoder Marvel App URL within your Notes file
9) Presentation Screen - 1920x1080 (16:9 Ratio)
- In a RUX challenge, this screen is the way to showcase your concept so keep it simple and make it look good!
- If you were walking into a meeting and needed to sell your idea - use this screen to showcase your concept.
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
Target Audience
- Retirement Plan Participant
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.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as a layered PSD file, or Adobe Illustrator as a layered AI file or Sketch!
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 Rolling Checkpoint feedback.
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.