Key Information

Register
Submit
Status: ‌Cancelled failed review

Challenge Overview

Project Overview

This project aims to create an entire platform with the goal of supporting and expanding small businesses everywhere, using both web and mobile applications. We are looking for experienced members to help us make our vision of an attractive, user-friendly platform a reality. This project presents a unique opportunity to make a real difference in the world.  As most people know, small business is the backbone of any economy. Unfortunately, small businesses have the most difficult time raising money, finding customers and being able to apply new products and approaches to help their businesses grow. Client has set out an ambitious goal to change this and we need someone to help us realize our goals.

Challenge Task Overview

  1. Being provided a storyboards, style guide and wireframes (you can find it in the attached file) the contestants have to implement a responsive UI prototype. All wireframe pages are in scope if otherwise is not explicitly stipulated. If some pages are missing any UI elements (not available in the source PSD file) please raise this issue early at the forum.
  2. Please note that the web app target both desktop/tablet layout and mobile layout and functionality will differ a bit between them. This challenges addresses desktop/tablet layout only.
A few notes
1. There is currently a reporting page for the "Platform Employee". This page is just a placeholder and does not need to be created for the prototype.
2. Please exclude PlatformEmployeeOrig from the prototype. 
3. On the Founder's profile page ->"My Founder$hares": there are a few labels that are slightly larger than the rest. (e.g. Time remaining, Champions, Amount Redeemed") This is not intentional, feel free to make them of equal size.
4. Conceptualization is also attached but please note that wireframes takes precedences over it in case of discrepancy.

 

Key Requirements

  • Convert the existing prototype to be HTML5 using AngularJS
  • AngularJS best practices should be followed, for example: consider using AngularJS routing feature.
  • Look & feel should remain the same for all elements on all pages
  • Maintain the same hover state for all buttons and links
  • Test in all the required browsers (see the list below)
  • 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
  • We'd like to have the code modularized so it's easier to maintain the code
  • Follow the structure / coding standards of the provided prototype

 

CODE REQUIREMENTS:
HTML5

- Provide comments on the page elements to give clear explanation of the code usage. The goal is to help future developers understand the code.

- Please use clean INDENTATION for all HTML code so future developers can follow the code.

- All HTML code naming should not have any conflicts or errors.

- 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)

- Use semantically correct tags- use H tags for headers, etc. Use strong and em tags instead of bold and italic tags.

- No inline CSS styles- all styles must be placed in an external stylesheet.

- 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.

 

CSS3

- Use CSS3 Media Queries to load different styles for each page and don't build different page for different device/layout.

- Provide comments on the CSS code. We need CSS comments to give a clear explanation of the code usage. The goal is to help future developers understand the code.

- Please use clean INDENTATION for all CSS so developers can follow the code.

- All CSS naming should not have any conflicts.

- As possible use CSS3 style when create all styling.

- 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.

 

Javascript

- Provide comments on the page elements to give clear explanation of the code usage. The goal is to help future developers understand the code.

- Please use clean INDENTATION for all codes so future developers can follow the code.

- 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.

���

JavaScript Libraries/Plugins

  • AnguarJS must be used as the main framework
  • jQuery & jQuery UI

 

Browser Requirements (latest versions)

  • Chrome
  • Firefox
  • Internet Explorer
  • Safari (MacOS and iOS)
  • Chrome for iOS and Android tablets
  • Android Browser


Final Submission Guidelines

A working prototype with the listed requirements covered.

Submit an archive file contains all HTML/CSS/JS/images and other required files into Online Review.

REVIEW STYLE:

Final Review:

Community Review Board

Approval:

User Sign-Off

SHARE:

ID: 30048187