SoftBank - Blockchain Based Donation Service Prototype F2F Challenge

Project Overview:

Welcome to the SoftBank - Blockchain Based Donation Service Prototype F2F Challenge! The goal of this challenge is to update existing HTML5 Prototype application based on updated storyboard designs using Bootstrap.

Competition Task Overview:

We already finished the UI Prototype challenge, so the goal of this challenge is to update existing HTML5 prototype with the new screens provided for this challenge. The new code should be implemented separately and provide change log documentation file as part of the submission.

You could refer attached existing prototype and storyboard designs. We will review all the submissions received and provide feedback. Please ask questions in forum for any clarifications needed on the spec requirements.

Required Pages:

Below are the required pages for this Prototype F2F challenge.

1. Project Detail:

• -Refer updated screen "01_Project-Detail.png".
  -Update the section below project name.

2. New Project Calendar:

• -Refer updated screens "02_New-Project.png" & "03_Calendar.png".
  -We need the new calendar design implementations for iPhone and Android devices.

3. Volunteer:

• -Refer updated screen "04_Volunteer.png".
  -We need to update this page for long text on each column and showing full text on selection.

4. My Page:

• -Refer updated screen "05_MyPage.png".
  -Use logout icon near profile image of my page.

Specific HTML/CSS/JavaScript Requirements:

• -Your HTML code must be valid HTML5 and follow best practices.
  -Follow the coding style used in Bootstrap.
  -Structure your code nicely to allow for flexibility and maintainability.
  -Validate your code - reviewers may accept minor validation errors, but please comment your reason for any validation errors. Use the validators listed on the scorecard.
  -Use CSS to space out objects. Do not use clear/transparent images for the layout purpose, but use proper structural CSS to layout 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.
  -Attribute names and values should be in lowercase and use a hyphen ("-") to separate multiple-word classes (i.e. "main-content").
  -Label all CSS, JavaScript or HTML hacks with explanations so others will understand.

Font Requirements:

Use existing prototype fonts.

JavaScript Requirements:

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. We would like to use following JavaScript libraries:

• Bootstrap 3
  jQuery and Plugins

Browsers Requirements:

Mobile versions

• -iPhone 6, 6 Plus, 6s, 6s Plus Safari Browsers
  -Android versions 4.4+ Default Browsers

Desktop versions on Windows & Mac - (you only need to implement pages for the charity organization)

• -IE 11+ Browsers
  -Latest Chrome Browsers
  -Latest Safari Browsers

Note - please include actual browsers you have tested in the submission document/readme file.

Documentation Provided:

Please register to see attached documents.