Mobile Application Development with HTML5

alert("Hello Tongji!")

About This Course

  • Head first HTML5 in 10 Days!

  • Lectures

    • Each Monday afternoon, and every morning from Jul 28 to Aug 6 
  • Hands-on Labs

    • Every afternoon from Jul 28 to Aug 6 (except Aug 3)
  • Project

    • Introduction and Assignment - July 27
    • Presentation and Defense - Aug 7
      • ​Group 1-5: 8:30-11:30; Group 6-10: 13:30-16:30
      • Each group has 30 mins to present;
      • You can arrive 20 mins ahead to set up your demo. 

Lecture Agenda

What?

Why?

Basics

Advanced

Good to Know

Deep Dive

About Hands-on Lab

  • 40 Points in total

  • 6 scoring labs, 1 tutorial (Crosswalk)

  • MUST be completed individually

    • CAN googling, but DON'T copy others;

    • Score will be delivered right on the spot

    • Tasks finished after lab WON'T be scored.  

  • Each lab contains several tasks

    • Each task has different score value;
    • Vary from easy to difficult: 1 pt, 3 pts, 5 pts;
    • Lab objectives would be delivered on spot.

Basics - 1 Point

Advanced - 3 Point

Sophicated - 5 Point

Project - UChat: Your WeChat

  • 60 Points in total

    • Documentation - 10 Points

    • Basic Features - 15 Points

    • Advanced Features - 15 Points

    • Individual Challenges - 20 Points

  • MUST be completed BY GROUP

    • Group yourselves by 2 ~ 4 persons;

    • Develop UChat as Cordova app via XDK;

    • Except "Individual Challenge": each member pick one (>=0 and <=1) challenge, win your own score!

  • Check detailed Feature Requirements 

Documentation (10 Points)

  • 5 - Draft documents via Markdown

    • All documents should also be pushed to your Bitbucket project repository, e.g. "doc" folder; 
    • Put emphasis on architecture, high-level design;
    • Clarify client-server communication protocols;
    • Note down any other highlights in your projects;
    • A picture is worth a thousands words!
  • 5 - Do right commit, do commit right! 

    • Choose appropriate branching model;
    • Write clear and descriptive commit messages;
    • Every team member should do commits, and try to do commit every days, from time to time!

Basic Features (15 Points)

  • Objective: Create basic infrastructure of UChat. 
    • 1 - Header
    • 1 - Navigation Bar
    • 1 - Friend (Your Teammate) List View
    • 3 - Chat List View
    • 3 - Chat Details View
    • 1 - Chat Info View
    • 1 - Pin Chat to Top
    • 1 - Send Text
    • 1 - Send Pictures in Gallery
    • 1 - Send Picture via Camera
    • 1 - Send Emoticons
  • Expected Output: UChat can run standalone and offline, NO NEED to have real messaging, NO backend required.

Advanced Features (15 Points)

  • Objective: Enabling real-time messaging between two users in UChat.
    • 2 - User Login and Logout
    • 2 - Send / Receive Text
    • 3 - Send / Receive Picture
    • 2 - Send / Receive Emoticon
    • 3 - Display Unread Messages
    • 3 - Receive Offline Messages
  • Expected Output: Two UChat users can chat online, just like they are using WeChat.

Individual Challenges

  • Objective: Make UChat more alike WeChat.
    • 20 - Start a Group Chat (with a least 3 persons)
    • 20 - Record / Send / Receive Micro Video (< 10 sec)
    • 20 - Record / Send / Receive Voice Message
    • 20 - Join a Chat with QRCode
    • 20 - Publish UChat for Off-campus Access (Publish app to a local store, and deploy backend to off-campus server, e.g. Heroku)

Questions?

Leave your question as comment on this page!

Register Bitbucket,  Download Intel XDK and other Software NOW!

Please Help our Survey!

HTML5 Course @ Tongji

By Haili Zhang

HTML5 Course @ Tongji

  • 2,101