How has the design of HDB homes in Singapore changed over the years?

Country/area: Singapore

Organisation: The Straits Times

Organisation size: Big

Publication date: 11/12/2021

Credit: Carlos Marin, Charlene Chua, Choo Yun Ting, Rachael Lee, Rebecca Pazos, Ryan Tan


Carlos Marin: Data visualisation developer
Charlene Chua: Digital graphics journalist
Choo Yun Ting: Journalist
Rachael Lee: Designer intern
Rebecca Pazos: Interactive graphics correspondent
Ryan Tan: 3D/Designer

Project description:

In Singapore, about 80% of residents live in public housing more commonly known as HDB flats. The interiors/design of each flat varies based on the decade/year they were built in, saying a lot about the ways people lived over the decades. In the article, we visualised two flats – one built in the 1970s and the other in 2020s – in 3D for a deeper look into how the spaces have changed. We also looked into the other factors at play when building a home, and other societal changes such as having smaller family units.

Impact reached:

Housing is a hot topic in Singapore and this hit home for many Singaporean readers. On a local level, there has been talk on how HDB flats have become smaller over the years. Through this, we showed that the size of HDB flats over the decades is not a linear trend. Homes are indeed smaller compared to flats built in the 1980s and 1990s but overall it is larger than flats in the 1960s and 1970s. Readers also got to take a closer look at how the flats have evolved over the years and how specific design choices have been made to suit their lifestyles.

Techniques/technologies used:

For the introduction scrolly, we used our in house video scrolly template. The visuals were made using blender, with Open Source Map data. We also managed to get data of HDB flats and the years they were built in from Data.gov.sg. Then we were able to animate and color in the blocks gradually according to year, and exported it as a video.

The other two floor map scrollys were mostly built with Blender and Premiere pro. The modelling, highlighting, and animation were done on blender, and final refinements were done on premiere pro. We did the modelling using the floorplan of the particular flat, then added in simple furniture and materials from the blender kit online library. The last step was to use premiere pro to composite the animation and create the smooth transitions between the frame with no-highlights to the frame with highlights.

We also created an animated top down overview of Toa Payoh, the town we were focusing on in this piece. This was actually a last minute addition to the piece. We used an old code from a previous project and updated the infomation with the latest data and geojson.

The other graphics were also datawrapper charts and SVGs.

What was the hardest part of this project?

The greatest challenge for this project was obtaining the right type of flats to show true comparison over time in terms of lifestyle changes from 70s till now.

Also, the top down map animation was also a last minute inclusion to the piece and we had few days to work that out. It was a code that was written by one of our ex-developers two years ago, and we had to figure out the logic and then update the code with new data and make it work on our existing framework. Code is sometimes not as reuseable as we’d like to think!

What can others learn from this project?

That even interactives can be profile driven. I think with interactive stories it can sometimes be difficult to have that human aspect to it, and we made it a point to include the profiles relatively high up in the story to bring out the human aspect in the story. Without the humans and profiles, I think the story could have still worked. We could still show the structrual changes in the interiors of the two flats, but adding the profiles gave it another dimension, reminding readers that these are not just spaces but it is the homes of your average Singaporeans and their aspirations, which helped to make the story more engaging and relatable for the local reader.

Project links: