Floral Timeline of Hanoi

“Dear Hanoi, how do flowers reflect your time?”

—Duration: 2 weeks
—Scope: Creative Coding, Web Design, Illustration
—Tools: HTML & CSS, Procreate

Floral Timeline of Hanoi is a interactive website which maps Hanoi’s timeline through its seasonal flowers, revealing the city’s poetic essence.

Growing up, I marked time by blossoms—Blackboard Tree in autumn, lotus ponds in summer. Only after leaving did I realize how uniquely Hanoian this connection was. With its rich soil and distinct seasons, Hanoi flourishes with fragrant blooms, each carrying a subtle charm. This project captures that fleeting beauty—felt, not just seen.

—Try out Floral Timeline of Hanoi here!

Process

Initial Sketches & Ideas

Floral Timeline of Hanoi did not exist as a website in my sketches, but a large sheet of paper. Soon later, I switched to the form of a website so it could be shared to people.

Research & Illustrations

The research part of this project was mainly about the symbols of flowers in my own culture. Parts of them I had already knew, but the research gave more insights that informed the illustrations as well as the website's content.

Previous Draft

Why the suffocating lines? Probably because we all need to make some mistakes to improve.

Floral Timeline of Hanoi

“Dear Hanoi, how do flowers reflect your time?”

During my childhood days in Hanoi, I used to see the steps of time in traces of flowers: autumn and the fragrance of Blackboard Tree blossoms, summer and the endless lotus ponds… It was not until I left the city, that I realized those “floral traces” were something very “Hanoian”, and never in another place, did I see the passage of time in the same flowers again.

Hanoi is a city blessed with wonderful soil and climate to grow plants. The great distinction between its four seasons gave Hanoi a variety of charming flowers and sweet scents, bringing a poetic but subtle charisma to the city. This project is dedicated to the poetic side of my dear city, a part that cannot be seen but can only be felt and sensed.

—Try out Floral Timeline of Hanoi here!

Process

Initial Sketches & Ideas

In my first few sketches, Floral Timeline of Hanoi did not exist as a website. I first imagined it as a large sheet of paper, in which I considered using a circle to represent the timeline.

Soon later, I switched to the form of a website so it could be shared to more people. It was also designed with a long scroll so the audience would can unfold content over time.

Research & Illustrations

I created the list of flowers based on both my memories and research. Google Images and Unsplash were ultilized for illustration inspiration.

The illustrations were done with no color at first, but it was lifeless. And so I added some more effort to make them lively.

Previous Draft

The previous draft had lines which separates each month, which created a bit of a caging situation. So for the liberty of the flowers, I removed the lines.

#floral_timeline_HN

@2024 Lucie Tran

Floral Timeline of Hanoi

“Dear Hanoi, how do flowers reflect your time?”

—Try out Floral Timeline of Hanoi here!

Process

Initial Sketches & Ideas

In my first few sketches, Floral Timeline of Hanoi did not exist as a website. I first imagined it as a large sheet of paper, in which I considered using a circle to represent the timeline.

Soon later, I switched to the form of a website so it could be shared to more people. It was also designed with a long scroll so the audience would can unfold content over time.

Research & Illustrations

I created the list of flowers based on both my memories and research. Google Images and Unsplash were ultilized for illustration inspiration.

The illustrations were done with no color at first, but it was lifeless. And so I added some more effort to make them lively.

Previous Draft

The previous draft had lines which separates each month, which created a bit of a caging situation. So for the liberty of the flowers, I removed the lines.

#floral_timeline_HN

@2024 Lucie Tran

Floral Timeline of Hanoi

“Dear Hanoi, how do flowers reflect your time?”

—Try out Floral Timeline of Hanoi here!

Process

Initial Sketches & Ideas

In my first few sketches, Floral Timeline of Hanoi did not exist as a website, but a large sheet of paper.

Soon later, I switched to the form of a website so it could be shared to more people.

Research & Illustrations

I created the list of flowers based on both my memories and research. Google Images and Unsplash were ultilized for illustration inspiration.

The illustrations were done with no color at first, but it was lifeless. And so I added some more effort to make them lively.

#floral_timeline_HN