Ohio Deferred Compensation - Responsive Mobile Design Challenge - Part 1

Welcome to Ohio Deferred Compensation - Responsive Mobile Design Challenge - Part 1!

Recently we completed the desktop designs for the Ohio - Deferred compensation web application, in this challenge, we are looking for your help to come with mobile designs based on the provided desktop designs.

Good luck and looking forward to your designs!

Round 1

Submit your initial designs for Checkpoint Feedback

A. Web Login
01 Landing Page
03 Forgot Password
04 Account Enrollment
05 About Us
08 Calculator and Tools
09 Contact Us

B. Participants
10 Account Manager
11.2 Beneficiaries

You must upload your submission to MarvelApp so we can provide direct feedback on your designs.
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)

Round 2

Your Final designs for all the required designs with all Checkpoint Feedback implemented.

A. Web Login
01 Landing Page
02 Sign up
03 Forgot Password
04 Account Enrollment
05 About Us
06 Investments
07 Resources
08 Calculator and Tools
09 Contact Us

B. Participants
10 Account Manager
11.0 Account Summary (SMarT Plan Details, Auto Rebalancing Details)
11.1 Statements
11.2 Beneficiaries
12 File Manager

You must upload your submission to MarvelApp, for the final submission - you can reuse the prototype that you shared for checkpoint
Feel free to add any other additional screens which are necessary to explain your concept.
Notes.jpg: Please note any comments about your design for the Client
Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)

This will be responsive (viewed in browsers), we would like you to think through this and come up with responsive mobile solutions,solutions that would provide a great interface for the mobile viewers.

IMPORTANT - Responsive Design Guidelines:
- Designs shall not deviate much from the current desktop designs as coding for those designs will use the same design approach and must be designed in a way that no new coding is required for design of mobile.
- It must follow the responsive design so that UI elements are reused as much as possible between desktop and mobile screens.

Design Considerations:
- Clean, streamlined design and user flow.
- As mentioned above, make sure you are following the same design style as that of the provided storyboards as these are just responsive mobile designs / please do not introduce any new design elements.
- Follow the size of your designs as 750 x 1334 px (portrait view).

Challenge Files:
- Please find the link to it in forums.

Required Screens:
Below are the screens to be designed..

A. Web Login
01 Landing Page
01-1Landing-Page.jpg
01-2Alert.jpg
01-3Search-Option.jpg
01-4Contact-Option.jpg

02 Sign up:
02-1SignUp_Step1.jpg
02-2SignUp_Step2.jpg
02-3SignUp_Step3.jpg

03 Forgot Password:
03-1Retrieve-Username-Password.jpg
03-2Retrieve-Username-Password.jpg
03-3Retrieve-Username-Password.jpg
03-4Retrieve-Username-Password.jpg
03-5Retrieve-Username-Password.jpg

04 Account Enrollment:
04-0Enrollment.jpg
04-1Enrollment.jpg
04-2Enrollment.jpg
04-3Enrollment.jpg
04-4Enrollment.jpg
04-5Enrollment.jpg
04-6Enrollment.jpg
04-7Enrollment.jpg
04-8Enrollment.jpg

05 About Us:
05-1About-Us.jpg
05-2About-Us_Board-Members.jpg
05-3About-Us_Services.jpg

06 Investments:
06-1Investments_Tab1.jpg
06-2Investments_Tab2.jpg

07 Resources:
07-1Resources_Tab1.jpg
07-2Resources_Tab2.jpg
07-3Resources_Tab2.jpg
07-4Resources_Tab3.jpg
07-5Resources_Tab4.jpg

08 Calculator and Tools
08-Calculator-and-Tools.jpg
09-1College-funding-calculator.jpg
09-2College-funding-calculator.jpg
25-1Calculator-and-Tools.jpg
25-2Calculator-and-Tools.jpg
25-3Calculator-and-Tools.jpg
25-4Calculator-and-Tools.jpg

09 Contact Us:
10-Contact-Us.jpg
11-Send-an-Email.jpg

B. Participants
10 Account Manager:
12-1Account-Manager.jpg
12-2Select-Account.jpg

11.0 Account Summary:
13-Account-Summary.jpg

SMarT Plan Details
14-1SMarT-Plan_Already-Enolled.jpg
14-2Make-Changes.jpg
14-3Update-SMarT-Plan.jpg
14-4SMarT-Plan_Not-Enrolled.jpg
14-7Enroll-Successful.jpg

Auto Rebalancing Details:
19-1Account-Summary_enable.jpg
19-2Account-Summary_disable.jpg
19-3Account-Summary_edit.jpg
19-4Account-Summary_error.jpg
19-5Account-Summary_review.jpg
19-6Account-Summary_success.jpg
19-7Account-Summary_successdisable.jpg

11.1 Statements:
18-1Account_Statement.jpg

11.2 Beneficiaries:
15-1Beneficiaries.jpg
15-2Add-Beneficiary.jpg
15-3Modify-Beneficiaries.jpg
15-4Copy-to-Other-Accounts.jpg

12 File Manager:
16-1File-Manager.jpg
16-2File-Manager.jpg
16-3File-Manager.jpg
16-4File-Manager.jpg
16-5File-Manager.jpg
16-6File-Manager.jpg

 

 

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 mobile designs
- Overall design and user experience
- Cleanliness of screen design and user flow

Target Audience
The web site is used by public sector employees to manage their retirement funds. There are 2 main types of users of the web site:
- Participant (post-login)
- Web User (pre-login)

Participant:
User who enrolled into State’s retirement plan. Can setup online account and manage investments

Web User (Any web user):
Web User, mostly who is Interested in Retirement Benefits or enrolled 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!

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.