Challenge Overview
Challenge Introduction:
In this challenge, we want to build the HTML5 responvie prototype for the TopCoder iOS Program. The storyboard files (PSD format) are provided as the input of this challenge.
Challenge Requirements:
- The prototype should be built using HTML5 with latest Bootstrap 3.3.4 (http://getbootstrap.com/) and AgularJS UI Bootstrap (http://angular-ui.github.io/bootstrap/)
- Use the bootstrap responsive layout for all the pages to make sure it displays and functions well under desktop, tablet and mobile devices.
- The prototype should NOT depend on jquery or Bootstrap JS. Instead, for any bootstrap components you wanna use, please use AgularJS UI Bootstrap (http://angular-ui.github.io/bootstrap/)
- Please make sure the implemented pages are linked together. For example, "Become a member" button should links to the Registration page.
- Below is the detail requirements on each page:
1) Developer-Learn.psd
This is the Learn page of the iOS program, the Learn more button should be link to this page.
2) Developer-Landing-Non-Logged-In.psd
This is the landing page displayed when user is not logged in. The "Become a member" button should be displayed in the top Nav when user is not logged in.
3) Developer-Landing-Logged-In.psd
This is the landing page displayed when user is logged in.
- The user's profile image will be displayed in the top nav.
- The carousel should be implemented as in the storyboard.
- For each challenge, the challenge name, registrants number and submission number should all be links.
Browser Requirements:
-
IE9+
-
Latest Google Chrome (Windows & Mac OS)
-
Latest Safari (Windows & Mac OS)
-
Latest Firefox (Windows & Mac OS)
-
All Mobile & Tablet browsers
Challenge Input:
Storyboard Files: https://drive.google.com/open?id=0Bww3aX1VcxdOY1M1UlpDNno2Qjg&authuser=0
Final Submission Guidelines
- The whole implemented prototype packaged.