Challenge Overview
1. Project Overview
Praxis is looking to create a web-based database backend application to manage locations used for multiple Google Maps applications. Google Maps provides high-resolution aerial or satellite images for most urban areas all over the world. Google maps information is often times annotated by businesses which provide additional information that comes to complete the default mapping data with relevant business details like descriptions of store types, their exact location, driving instructions and so on. This process of annotating the default maps is structured and formalized by Google for the benefits of all users. The additional information is called a map dataset.
2. Competition Task Overview
Before we move to assembly phase, we need the UI Prototype to be created based on the wireframes, which is the purpose of this contest.
2.1 Key Requirements
- Test in all the required browsers.
- This contest has no storyboard, you should use standard web controls to implement the UI prototype
- Ensure your pages display correctly in all browsers. It is your responsibility to make sure the pages display correctly.
- Ensure you submission clear of HTML and CSS Validation error and warning.
2.2 Detailed Requirements
- Make sure you use a real Google Maps view in your UI prototype
- All placeholders/notes in the wireframes must be implemented in the UI Prototype. Example: when you click "+New User" under the admin page, a popup shows up saying "Wireframe Note: lead Admin to add a new user.", in the UI Prototype we need a real page that leads admin to add a new user, instead of this note. Same for "Filter users" and other notes on other pages.
- Try to make the UI Prototype clean and easy to use. We don't care whether the site is good looking, but care whether it's easy to use.
- Table sort is in scope
2.3 Specific HTML/CSS/JavaScript Requirements
- Your HTML code must be XHTML 1.0 Strict compliant
- 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.
2.4 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.
- You are allowed to use the JQuery JavaScript library for this contest.
2.5 Browser Requirements
- IE7+
- FF 7+
- Safari 5+
- Chrome Latest
3. References
None
4. Documentation Provided
The following documents are provided in contest forum:
- Wireframes
Final Submission Guidelines
5. Submission Deliverables
- Your submission must be a single zip file containing all the files necessary to view and run your submission properly (i.e. images, css, html, and javascript files.)
6. Submission Guidelines
Submit an archive file contains all HTML/CSS/JS/images and another required files into Online Review.