Challenge Overview
Styx provides high-technology products and services for the building industry. The client is looking to create a browser based diagnostics application (eventual web based application) that allows facility managers of commercial buildings to monitor faults across HVAC systems and related energy impacts.
Followng are general guidelines in building this prototype:
- This application is needed to build using HTML5, CSS3 and JavaScript technology.
- Use provided assets (Diagnosis Asset.zip) for creating the control of application and follow Look and Feel 1.2.pdf for style guide.
- Follow Interaction Document.zip for screen details, its functionality and its interaction.
- Base Prototype is provided, it is from Contest 1 that only covers a few pages/functionality. There are some pages that need to be modified as well new pages that need to be added, all of them are explained in UI Prototype Requirements - Contest 2.pdf. This document has higher priority than Interaction Document.
- All controls in the application must be adaptable to all screen resolutions, in short, in bigger resolution all controls have bigger size and it has a smaller size in smaller resolution, it has been implemented in the current prototype. Make sure to follow current implementation.
- Use Highcharts for implementing graphs/charts in this application. Currently all graphs/charts in prototype is an image placeholder. Replace them with actual implementation. You also may use JQuery for JavaScript framework in building this prototype.
- Fix all open Bugs that explained in Bugs.xls
- Documented all JavaScript methods and variables in your solution. All methods params and its return value should be documented.
- Your implementation must be consistent with existing style of this application as well as follow the provided style guide.
Your solution must works well in following browser:
- Latest version of IE, Firefox, Chrome, Opera, Safari.
MAKE SURE TO WATCH CONTEST FORUM FOR ANY ADDITIONAL REQUIREMENTS AND CLARIFICATIONS THAT MAY BE ISSUED.
Final Submission Guidelines
Following are specific requirements for HTML, CSS and JavaScript files:
- Your HTML code must be HTML5.
- 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.
- 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.
- No inline CSS styles, all styles must be placed in an external stylesheet.
- Use semantically correct tags - use H tags for headers, etc. Use strong and em tags instead of bold and italic tags.
- 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".
- 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.