GithubHelp home page GithubHelp logo

carolusian / datavis.studio Goto Github PK

View Code? Open in Web Editor NEW

This project forked from hupili/datavis.studio

0.0 1.0 0.0 70.92 MB

data-viz course/ slides/ projects

Home Page: http://datavis.studio/

CSS 3.94% HTML 4.44% JavaScript 91.06% Makefile 0.01% Ruby 0.01% Jupyter Notebook 0.56% Shell 0.01% Python 0.01%

datavis.studio's Introduction

JOUR2106 - Data Visualization

Schedule of spring 2019

  • Jan 19: W1, Course Introduction & Data Journalism
  • Jan 26: W2, DJ workflow and frontend 101
    • Appendix 1: Lab manual - first site via big-road
    • Appendix 2: Guideline: Data collection
  • Feb 2: W3, HTML
  • Feb 9: suspended for Chinese New Year
  • Feb 16: W4, HTML/ CSS
  • Feb 23: W5, CSS
  • Mar 2: W6, CSS & RWD
  • Mar 9: W7, Javascript
    • Project milestone #0: story ideation/ background/ survey
  • Mar 16: W8, Javascript Cont'd
    • Project milestone #1: data collection
    • Guest: Guy Freeman, dataguru.hk
  • Mar 23: W9, Basic Charting Library
  • Mar 30: W10, Charting Cont'd
  • Apr 6: W11, Mapping
    • Project milestone #2: basic analysis and visualization
  • Apr 13: W12, Special Types Visualisation
    • Appendix 1: jQuery
  • Apr 20: Easter holidays
    • Project: polishing and refinement
  • Apr 27: W13, Final presentation

List of students of spring 2019

List of projects of spring 2019

  • What’s the future of children with ASD? Story about Autism Spectrum Disorder (ASD) children status quo in Hong Kong. By Chen Fang Yi, Cheung Yan Yi, Zhao Min Zhu, Angie Chan.

    [Story] | [Codes]

  • Drug Prices in 10 Mainland Chinese Cities To find out the drug prices for different cancer treatments in different cities with crossfliter. By Ray Liu, Holly Chik, DONG Xinyue, Gursimran Hans.

    [Story] | [Codes]

  • The Muffled Voice The plight of sexual violence victims in Hong Kong. By Chin Ho Nam Erica, Ge Xin Ran, NG Yee Sin, SUN Han Yue.

    [Story] | [Codes]

  • Elderly in Hong Kong Elderly aged 65 or above in Hong Kong hit 1.26 million high for 2018, up 4.25% year to year. This is why we should care. By Ding Yiming, LI Yun, Li Yuquan, Akane Nakasuji.

    [Story] | [Codes]

  • Gender equality in Hong Kong How is Hong Kong progressing on gender equality? By Li Sin Yung, Liu Pei Lin, Nguyen Thi Minh Anh.

    [Story] | [Codes]

Homeworks

Homework4 -- Visual Critical Thinking

A short essay "criticise the visuals".

  • Find one problematic/ flawed visualisation online.
  • Discuss how it should look like.
  • Based on the same set of data, give your own version/ sample visualisation.
  • Use one of the charting libraries learned in this chapter. Page needs to be responsive (minimum mobile friendly)

Reference for content: sample1 , sample2 , sample3 (note those are content reference; tech requirement is higher)

Submit path: xxx.github.io/hw4

Homework3 -- Javascript Powered Calculator

Make a meaningful calculator type of data journalism work.

Reference examples:

  • Gaokao Enrolment
  • Hukou Scoring Calculator
  • Life Expectancy
  • Rent or Buy (NYT)
  • Chinese converter
  • Travel Expense
  • Student Loan ( sample )
  • HK budget calculator (code4hk; SCMP)
  • [Your idea]

Tech requirements:

  • Responsive layout
  • Give some texts to introduce the background, i.e. make the page self-contained.

Submit path: xxx.github.io/hw3

Homework2 -- Personal Homepage & Portfolio

Build and online CV for yourself.

Tech requirements:

  • Fresh start with HTML/ CSS; no template
  • Use div to perform "block design"
  • Link to your first web story (HW1)
  • Responsive to mobile and desktop (the one-column trick)
    • [Bonus] CSS-Grid for responsive layout
  • Add some effects using CSS lib

Submit path: xxx.github.io (note: this is the root path under your personalised GitHub Pages domain name)

Homework1 -- Your first static website

  • Finish publishing your story on the web using big-road template.
  • Basic requirement:
    • Paragraph
    • Heading
    • Bullet point
    • Image
    • URL
  • Link to course website in the footer
  • [Bonus] add interactive (and responsive) chart
  • [Bonus] add video

Homework0 -- Hello open source world

  • Register a GitHub account, play around and get familiar with the environment.
  • Create a repository called jour2106
  • Create a file called README.md in that repositery
  • Introduce yourself in the README.md, e.g. your major, interest, topics, members looking for, skillset, expectation from the course

(not graded but will help you attract the team members)

Submit path: jour2106/README.md

Grading

Grade distribution:

  • Homeworks:
    • HW1: 10%
    • HW2: 10%
    • HW3: 10%
    • HW4: 10% (termed as "case study" in syllabus)
  • Term project presentation: 20% (due April 27)
  • Term project: 40% (due May 4)

T&L Review

Future wishlist

Those items were not covered due to average pacing but good to incorporate in the future:

  • D3 - data driven visualisation -- operate DOM object in a batch
  • G2 - grammar of graphics -- learn how to abstract a complex problem
  • Google Analytics - User behaviour tracking & analysis

Open source learning

CILO2 and part of CILO1 are shifted to online platforms like GitHub, Slack, and DNN Newsletter. We encourage the students to adapt to this open source/ objective-driven learning model. This initiative is sponsored by HKBU/CHTL/TDG-1.

Service learning components

The theme of this semester is "reporting and visualising for the underprivileged". The "mentorship" resource in CILO4 is addressed partly by this component (some students found their own collaborating parties). This initiative is sponsored by HKBU/CISL mini-grant.

datavis.studio's People

Contributors

adazhiyan avatar alisonlipy avatar amandawtl avatar caishanni1019 avatar carolusian avatar chaotianyi avatar chlorella avatar chungyin avatar danielma518 avatar evalau1996 avatar hupili avatar hupilidemo avatar ianmaksh avatar ivywze avatar jessiepyt avatar johnpoon avatar juliannawqy avatar kingheiwong avatar mindyzhaominzhu avatar qingyiguan avatar roselol avatar roycncn avatar roytangrb avatar yahmsannga avatar

Watchers

avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.