Challenge Overview
Welcome to Ohio - Deferred Compensation UI Prototype to ASP.NET Conversion Challenge - Part 1.
This challenge is focussed on converting the existing UI prototype to an ASP.NET MVC application application. The existing prototype is available in our repo (request access via forums). Have any questions, let’s discuss in forums!
Important Guidelines:
- Use ASP.NET Framework 4.6.2
- The current prototype is responsive and covers the mentioned screens, all screens in the ASP.NET application must render exactly the same way as in the provided prototype
- Prototype has been developed to WGAC 2.0 Level AA compliant and the converted .NET application must maintain this compliance
The following pages are in scope and have already been implemented in the provided prototype
about-us.html
account-manager.html
account-summary-disable.html
account-summary-edit.html
account-summary-enable.html
account-summary.html
add-benificiary.html
asset-allocation-tool.html
beneficiaries-copy-account.html
beneficiaries.html
calculator.html
college-funding-calculator.html
contact-us.html
enrollment.html
file-manager.html
home.html
investments.html
modify-beneficiaries.html
resources.html
retrieve.html
send-email.html
signup.html
smart-plan.html
statements.html
upload-file.html
All screens for tablet view (portrait) are also implemented for mobile storyboard. You can find the Marvelapp links in the forums
If you have any doubts about the scope/ screens involved, please post in the forums.
~
TECHNOLOGIES
- Visual Studio 2015
- ���HTML 5
- C#
- JavaScript
- CSS 3.0
- Bootstrap 3.3.6
- JQuery 2.2.0
CODE REQUIREMENTS:
ASP.NET
- All source code should be well commented
- All Javascript & CSS files must use bundling
- Please use a templating engine - you are free to use Razor Pages or another wrapper framework such as RazorEngine - if you have any other suggestions on how to handle the view layer, let us discuss this in the forums.
- Follow best practices as mentioned here
EXISTING CODE CONVENTIONS (SHARED FOR REFERENCE)
HTML/HTML5
- Provide comments on the page elements to give clear explanation of the code usage. The goal is to help future developers understand the code.
- Please use clean INDENTATION for all HTML code so future developers can follow the code.
- All HTML code naming should not have any conflicts or errors. Element and Attribute names should be in lowercase and use a "-" or camel naming to separate multiple-word classes (i.e.. "main-content", or "mainContent)
- Use semantically correct tags- use H tags for headers, etc. Use strong and em tags instead of bold and italic tags.
- No inline CSS styles- all styles must be placed in an external stylesheet.
- Validate your code- reviewers may accept minor validation errors, but please comment your reason for any validation errors. Use the validators listed in the scorecard.
CSS3
- Provide comments on the CSS code. We need CSS comments to give a clear explanation of the code usage. The goal is to help future developers understand the code.
- Please use clean INDENTATION for all CSS so developers can follow the code.
- All CSS naming should not have any conflicts.
- As possible use CSS3 style when create all styling.
- Use CSS to space out objects, not clear/transparent images (GIFs or PNGs) and use proper structural CSS to lay out your page. Only use table tags for tables of data/information and not for page layout.
Javascript
- All JavaScript must not have a copyright by a third party.
- It is fine to use GPL/MIT/Open Source code.
- You are encouraged to use your own scripts, or scripts that are free, publicly available and do not have copyright statements or author recognition requirements anywhere in the code.
Images
- Images should be properly compressed while still having good visual quality.
- Please use best practice repetition usage of background based image.
- Please use sprites when using icons for your submission.
- Make sure your submission look sharp for Retina and Standard devices
- Wherever it makes sense, you can use icon fonts instead of images.
Browsers Requirements
- IE 10, 11
- Firefox, Chrome, Safari, Microsoft Edge latest version
- Chrome / Safari mobile browsers
Final Submission Guidelines
- Submit the Visual Studio 2015 project implementing all existing UI prototype screens
- Provide a deployment guide providing configuration and verification information for your submission
- Provide a demo video of your solution- Provide an Azure URL hosting your working submission