Challenge Overview
Project Overview
Appirio is building a hybrid mobile app for Calix which will help it’s customers quickly and easily access their Service Station CRM portal. The goal of the app is to enable customers to open/review/edit technical support case, software request, and hardware return (RMA) requests. The app will built as a hybrid app with native features. A barcode scan capability will be integrated into the app to allow users to scan hardware product id and serial numbers to populate those fields in RMA cases. The other native feature will allow users to capture and upload image files to open cases. Calix would like our help in assisting their users with closing cases faster in their system. Analytics will provide the metrics needed to gauge the success of the app.
Competition Task Overview
The purpose of this contest is to create an HTML5 based prototype that will later be used to build the hybrid app using frameworks like PhoneGap.
Key Requirements
- You must ensure your code is compatible with PhoneGap so that we can easily integrate it with PhoneGap to build the hybrid app .
- This will be an phone only app (iOS and Android phones).
- Ensure your pages display correctly in all browsers. It is your responsibility to make sure the pages display correctly.
- Replicate the design of the approved Storyboards (PSD Files) for all screens.
- Your pages must match the colors and structure of the provided storyboards.
- Ensure you submission clear of HTML and CSS Validation error and warning.
- We may need to update some of the error/success messages, this will be provided and addressed in final fixes or during the contest
Detailed Requirements
Very detailed specification has been provided in contest forum, please register to download it.
Specific HTML/CSS/JavaScript Requirements
- You MUST use HTML5 and CSS3
- 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 tables of data/information 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).
- Label all CSS, JavaScript, or HTML hacks with explanations so others will understand.
- Your code must render properly in all browsers listed in the scorecard in both Mac and PC environments.
JavaScript Libraries/Plugins
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. If you need to use any 3rd party libraries please double check in contest forum (it must work with PhoneGap and be approved).
Browser Requirements
- Safari on iOS
- Chrome on both iOS/Android
Documentation Provided
Register to download documents provided in contest forum.
Final Submission Guidelines
Submission Deliverables
- A complete HTML5 based prototype that's compatible with PhoneGap.
- A deployment guide if necessary.
Submission Guidelines
Submit an archive file contains all HTML/CSS/JS/images and another required files into Online Review.