Challenge Overview
The primary goal of this contest is to design the front end codes for of a web application which has very defined guidelines and the look is dashboard oriented for business purposes.
Service Request Tools is an application that will process industry service requests such as hardwared, software applications and other types of services. Our pre-sales user’s productivity is essential to our organizations success. They need a tool to assist them in quickly generating request for services quotes to an internal team of quoting experts. Due to the high volume of customers and projects they need a clean and efficient tool that will allow them to quickly enter in the necessary information needed to generate quote requests for a large number of services.
In this contest, you should transform all wireframes flow with the storyboard provided and turn it into UI prototype codes that works and meet client code guidelines. If you find any elements which doesn't have look and feel style in storyboard yet exist in wireframes, Please report in forum and we will get UI Designer to provide the look and feel.
You can find the all contest requirements in Introduction document provided in contest forum (Register first, this contest requires CCA!!).
Following are specific requirements for HTML, CSS and Javascript files:
1. Note: The javascript function should be put in properly file. Don't put all functions in script.js. Script.js should only contain the common functions for all pages.
2. As your references, we provides you with several code design guidelines from our previous project (EMP Prototype attached in contest forum). Use this as your code references and follow the prototype standards.
3. The code standards (gssd-development-standards.pdf in gssd-development-standards-v0.4.zip) now include HTML, CSS, and JS, so you should now code to the GSSD standards. The Google HTML/CSS Style Guide should be used where no GSSD standard exists.
3. Your HTML code must be HTML5 Compliant. Note that this doesn't imply use of any HTML 5 features. If any HTML 5 features are used they must either be supported by all of the browsers above or there must be an alternative way of achieving the same functionality.
4. 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.
5. 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 tabular data and not for page layout.
6. No inline CSS styles, all styles must be placed in an external stylesheet.
7. Use semantically correct tags - use H tags for headers, etc. Use strong and em tags instead of bold and italic tags.
8. 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".
9. All JavaScript must not have a copyright by a third party. 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. You are allowed to use the JQuery JavaScript library for this contest.
10. All elements that will eventually need to be accessible for automated testing (e.g. any type of input) must have the 'id' attribute set.
Your submission must works on browser in the list below:
- IE7+
- Latest Firefox
- Safari 5
- Latest Chrome
Final Submission Guidelines
N/A