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
Apr 20: Easter holidays
- Project: polishing and refinement
- Apr 27: W13, Final presentation
List of students of spring 2019
- Angie Chan - @angiecwl - Intro - Enrolled - HW1, HW2, HW3, HW4
- CHEN Fang-Yi - @FangFangYC - Intro - Enrolled - HW1, HW2, HW3, HW4
- Cheung Yan Yi - @CheungYanYi - Intro - Enrolled - HW1, HW2, HW3, HW4
- ZHAO Minzhu - @MindyZHAOMinzhu - Intro - Enrolled - HW1, HW2, HW3, HW4
- Holly Chik - @hollychik - Intro - Enrolled - HW1, HW2, HW3, HW4
- DONG Xinyue - @Felicity2724 - Intro - Enrolled - HW1, HW2, HW3, HW4
- Gursimran Hans - @ghans19 - Intro - Enrolled - HW1, HW2, HW3, HW4
- Ray Liu - @rayliurui - Intro - Enrolled - HW1, HW2, HW3, HW4
- Chin Ho Nam Erica - @ericachinn - Intro - Enrolled - HW1, HW2, HW3, HW4
- GE XINRAN - @Midorillusion - Intro - Enrolled - HW1, HW2, HW3, HW4
- NG Yee Sin - @tiffanynys - Intro - Enrolled - HW1, HW2, HW3, HW4
- SUN Han Yue - @SUN08042HanYue - Intro - Enrolled - HW1, HW2, HW3, HW4
- Yiming Ding - @JimmyDingyiming - Intro - Enrolled - HW1, HW2, HW3, HW4
- LI Yun - @Ly-Iris - Intro - Enrolled - HW1, HW2, HW3, HW4
- Li Yuquan - @WindyLI75 - Intro - Enrolled - HW1, HW2, HW3, HW4
- Akane Nakasuji - @anakasuji - Intro - Enrolled - HW1, HW2, HW3, HW4
- Li Sin Yung - @sinyungli - Intro - Enrolled - HW1, HW2, HW3, HW4
- Liu Pei Lin - @dragonmasterhk - Intro - Enrolled - HW1, HW2, HW3, HW4
- Nguyen Thi Minh Anh - @minhanhngg - Intro - Enrolled - HW1, HW2, HW3, HW4
- MO Kexin - @majormoke - Intro - Audit - HW1, HW2, HW3, HW4
- ZoyaZhao - @zoyazhao1996 - Intro - Audit - HW1, HW2, HW3, HW4
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.