Fully demolished in April 1994, the Kowloon Walled City was a de jure Chinese enclave known for its unparalleled population density and otherworldly labyrinthian structure, with buildings and staircases packed so tightly together that sunlight almost never reached the ground floor. 
Published in September 2014 and designed and edited by Greg Girard and Ian Lambot, The City of Darkness: Revisited is the latest version of a book that intimately captures the story of this city and its people across countless photographs, preserving its essence after demolition. To this day it is the most frequently referenced source of remembering what the city once was.
Named after this nickname 'City of Darkness', Hak Nam is a site that collects these photos and stories from the book, and repackages them into an experience that invites the user to navigate, explore, and get lost in the cityscape and community of a place that no longer exists.
The Process
For my Spring 2021 senior capstone project I wanted to create a site focused on the Kowloon Walled City. The city itself has been a major reference point for a lot of the media I am inspired by (particularly in the cyberpunk genre) and the city's unique development has always interested me.
As someone who enjoys wandering urban streets, to me the most striking aspect of the Walled City is its subterranean labyrinth consisting of corridors that weave through and between apartment complexes packed closer than they have any right being. Since the city no longer exists, I wanted to have the site emulate what it might feel like to wander and get lost in such a space. Inspired by the likes of old-school dungeon crawling video games and other exploratory interactive experiences, Hak Nam is a site that is centered around its navigation, having users navigate from room to room via arrows that leave no hints as to what lies around the next corner—you have to explore to find out. Details like a dynamic ambient sounds and small blurbs of narration collected and paraphrased from various sources to be written in the present tense are all designed to add to the immersion, treating the user as someone who is actually there: walking through the grungy hallways, climbing up concrete stairs, and peering into busy shops.
Initial Concepts and Moodboard
Initial Concepts and Moodboard
Initial Sitemap and Content Organization
Initial Sitemap and Content Organization
Initial Wireframes
Initial Wireframes
Full Initial Wireframe/User Flow
Full Initial Wireframe/User Flow
Final "Site Map" Before Site Building
Final "Site Map" Before Site Building
Moodboards, Inspirations, Sitemaps, and Initial Concepts

More Works

Back to Top