Visualizing 7 Dangerous New Year’s Holidays in Thailand

Data visualization of the causes of major accidents in Thailand during New Year Holidays from 2008 to 2015

Thiti Luang

Published in

Boonmee Lab

7 min readOct 4, 2015

One-and-a-half day project in Thailand X Taiwan Data Hackathon, Oct 3–4, 2015

We joined Thailand - Taiwan Data Hackathon on October 3–4, 2015 at Ma:D Club for Change, Bangkok. The event was held by Electronic Government Agency(EGA)-Thailand, Industrial Development Bureau’s -Ministry of Economics Affairs-Taiwan, Changefusion, Social Technology Institute and Good factory.

It was a 2 days Hackathon that every teams must create an application or data visualization using open data from data.go.th or others reliable sources on the internet. The theme of the final work need to fall into one of 3 topics including Health, Natural Disaster or Transportation.

We selected 7 Dangerous New Year’s Holidays in Thailand in 2008- 2015 data on data.go.th before the event. It’s a very rare set of data that we found on the site. Because it contains 200K of real data through the range of 7 years.

Sample of data for each fatalities in Thai language

The data itself is great but… Is it important enough for our society to work on? Here are list of related issues we found;

Thailand is the 2nd of World ranking for road fatalities (source: University of Michigan’s Transportation Research Institute, 2014) Namibia is the first.
8,445 Thailand’s average casualties from road accident per year. 23 death per day.
Visualized data can represent the insight quicker than analyzing from 200K data in spreadsheet
There are not many interactive data visualization using open data as a tool to analyze complex data in Thailand(yet).

I guess this sounds like a big problem that we should fix right away.

Step by Step Story

The final sketch we made after the ideation session

We chat online for a few days before the event and all agreed on the data set we will use. But we didn’t make much progress generating ideas. With markers and a glass-board, we finally came up with the final idea and sketches in 30 minutes!

We also tested the data with the online visualizing tool to see what models match the most with our data.

The Sankey diagram testing with Raw with the sample data

This is the sample visualization using 2,000 data to see the relationship and flow between each categories. This method, Sankey diagram, illustrated the data accumulatively but didn’t display the information of each of the accidents. So we moved to Parallel coordinates and Geographic mapping model.

Although Parallel coordinate can present the journey of each data very clearly, it matches more with numbers than strings. It’s also not that practical to present the 200K data (30K per year) at the same time. Thousands of messy lines will make user confused at the first glance.

We also want to make it easy to understand for everyone who might not familiar with the complex data visualization style. Moreover, The design must draw attention from audiences with attractive storytelling technique. Maybe some sort of Thai map with uninvasive animation?

The screenshot of the part of final data visualization

Finally, we decided to go with Geographic mapping with filter functions because it articulates the message comprehensively and straightforward. We also crafted the on-load animation to emphasize the amount of accidents happened in each years.

It’s very challenging to build something from scratch in just one and a half day. It’s not perfect but we glad that it delivered our concept very effectively.

We thought it might be useful for others to share our brief development process. So I summarized it right below.

Development Process

Browse and Choose data from data.go.th
Brainstorming visualization, storytelling, interface and technique
Setup Node.js backend structure
Final UX/UI design using Sketch and prototype with InVision
Take GeoJS data of Thailand map and put it on front-end
Plot all data into dots on map
UI specs sent through Zeplin
We have tried many time to make prettier animation.
Iterated many times to make more efficient and faster.
1st version took > 40sec to load data w/o animation
we reduced it to < 1 sec
Then work on filter and timeline slide bar
Maybe more after the event….

We developed our interactive data visualization using latest technology both in design and development with 22 total man-hour.

Done!

You can try the final version at opendata.boonmeelab.com. We aimed to make it useful for users to consume or analyze the data as they wish.

Here are links to our final work and presentation.

Possible Insights from the Visualization

Compare the number of casualties who drink alcohol and who don’t in 2015

Compare the number of casualties who wear helmet or seatbelt and who don’t in 2015

Above, We compared 4 sets of data above from the same year and found out that the “Safety” effected the death rates more than “Alcohol”.

Wearing helmet or seat belt can really save lives

Number of casualties who drink are not much greater than people who don’t. Really?

Who benefits?

Journalist, News room can use it as a tool to analyze the traffic accident related article as well as the support references.
Transit police to decide where to set up drunk-driving check zoning
Campaign builder, researcher
Thai Health Organization who actively promotes drink don’t drive campaign, reduce accident during 7 dangerous days New Year in Thailand.
Road maintenance priority
Budget allocation for healthcare resources (e.g., hospital coverage, ambulance utilization)
Real estate pricing

Next step?

It was only 1.5 days from the ideation to final demo. We plan to make it look finish within this Hackathon event(we are not sure that we can continue to work on this later). We think it can be a lot more awesome in many directions;

Compare the data We can add comparison function between different period of time or filter. Now users need to open a new tab to compare.
Focus on specific period of time The current slider bar is still very minimal. The next version can be something like this.

Integrate accident data for the whole year We will definitely discover other interesting pattern with more extensive data.
Update every year The visualization can be updated when the new data is ready.
Upload any country data well then, we need to know the international open data standard for this type of data. But possible!
Apply precise location We have the hospital data for each incidents in hand. It would be great if we can get the lat/long data of each hospitals. Even better if we have the geolocation of the location of the accidents.
Scale to different type of data this website can adapt to other set of data in the same standard such as flood, epidemic, etc.
Monitor from Real-time data (via API)

Competition Result

Mha Muang, our team, won the Invincible Hacker Awards…YAY. We got 30,000Bt with a great chance to join the Asian Open Data Summit 2015, Taipei, Taiwan, 0n Oct 13–15, 2015.

Death clock team got the Best Hacker Awards