How can landscapes be created in a design system?
Shanshui, the expression of nature and humans in Chinese painting.
Shanshui, the harmony between nature and humanity in Eastern philosophy.
Shanshui, the timeless reflection of thought and spirit in culture.
Could the spirit of Shanshui become the basis for a design language?
Cultural-Driven
Landscript is a culture-driven visual language that draws inspiration from symbolic meanings and imagery within culture. It conveys information through visual representations of nature and daily life.
Immersive
Inspired by the depth of Eastern landscapes, Landscript presents information in layered, structured designs. Its unique typography and visual identity create an immersive experience, turning interaction with information into a experiential journey.
Modular
Landscript’s design modules echo the layering and spatial balance of traditional landscape painting. Adaptable and reconfigurable, they embody the harmony of “division in unity,” delivering a cohesive yet dynamic user experience.
This is Landscript.
Glyph
Glyph serve as the smallest unit, drawing inspiration from nature — such as the sun, moon, mountains, water, houses, trees, and clouds. These symbols inherently carry visual meaning and cultural associations.
Pattern
Combining different glyphs creates patterns; for example, repeating water symbols form the image of a water waves.
Morph
Morph is the fluid transition that shifts from a structured pattern to an actual organic letterform.
Arranging different letter forms into visually informative text.
Typography
Landscript’s adaptable and dynamic visual effects make it ideal as a display font. Paired with the classic Suisse Int’l for body text, it highlights contrasts in type size, reinforcing information hierarchy and ensuring spatial harmony.
Custom icons were designed based on the aesthetics of Landscript letterforms, providing users with a more immersive information interaction experience.
The color system, inspired by China’s traditional “Five Colors” and “Yin-Yang and Five Elements” theories, reflects nature, seasons, and humanity. It balances motion and stillness to create designs that are both grounded and dynamic.
Sky turquoise originates from “天青,” symbolizing the azure sky after the rain, as described in the poem: “雨過天青雲破處” (“After the rain, the sky clears, and the clouds disperse”).
Mountain gray originates from “千山翠” (verdant mountains), depicted in the poem: “林端襯出千山翠，夕照看成二月春” (“The forest tips frame verdant mountains, and the evening glow resembles early spring”).
River blue originates from “青冥,” reflecting the vastness of water and waves, as described in the poem: “上有青冥之長天，下有水渌之波瀾” (“Above lies the azure sky, below the rippling waves of clear water”).
Materials
Mist (霧), an ethereal element that softly veils the scenery, captures the subtle beauty of Eastern aesthetics. It serves as a foundational material for this design system.
Mist (霧), an ethereal element that softly veils the scenery, captures the subtle beauty of Eastern aesthetics. It serves as a foundational material for this design system.
Windows
In interface material design, a thin mist layer overlays the gradient color background. The mist softens the colors, creating a subtle elegance and the poetic essence of veiled landscapes.
In interface material design, a thin mist layer overlays the gradient color background. The mist softens the colors, creating a subtle elegance and the poetic essence of veiled landscapes.
Buttons
The button maintains its poetic aesthetic, using transitions between states to convey a tangible sense of interaction, symbolizing ‘the smoke clears’ to highlight the selected state.
The button maintains its poetic aesthetic, using transitions between states to convey a tangible sense of interaction, symbolizing ‘the smoke clears’ to highlight the selected state.
Texts
Views
Sliders
The slider shape is inspired by the Landscript typeface, resembling a reversed letter “Z”.
The slider shape is inspired by the Landscript typeface, resembling a reversed letter “Z”.
Tab Bars
The tab bars, inspired once again by the curved “Z” in the Landscript typeface, integrate webpage icons and names into a cohesive design.
The tab bars, inspired once again by the curved “Z” in the Landscript typeface, integrate webpage icons and names into a cohesive design.
SideBar
Cards
Dialogs
Search
Interface Design
When the user opens the navigation bar, the media player interface extends horizontally into a curved shape, resembling the flowing motion of a waterfall in a landscape and providing an immersive visual experience.
Similarly, fluid animation is a key requirement for the Landscript user experience; it must be smooth and resemble the natural flow of water.
Social Media
Continuing the Landscript design system, the desktop window showcases more comprehensive functionality for processing information and executing tasks.
On the left tab, extending the waterfall design metaphor, users can access other open applications, such as the currently playing music playlist, message notifications, and more.
As everything comes together and is displayed within the space, the focus window state enhances user concentration by emphasizing the active window while applying opacity adjustments and blurring effects to the surrounding windows. This creates a visually distinct environment that helps users stay focused on their current task.
What’s Next?
To some extent, Landscript transcends the practicality of a coding interface. While it’s technically possible to code this interface in reality, it would be extremely challenging. Yet, that’s the beauty of this passion project — it goes beyond feasibility, envisioning an ‘anomaly-intuitive’ interface that adaptively scales over time, subtly redefining the paradigm of user experience for the next 10 to 20 years.
Currently, I am a designer at Hyundai Regeneration Studio, focusing on plant-based biomaterials for tangible interfaces in future mobility. At the end of the day, nature and sustainable design are what truly matter. While good design generates profit at its core, great design goes further — creating social benefits and sustainable values for the future.
I truly appreciate you reading this till this point — it really means a lot! Wherever you are, wherever we are, I always wish us godspeed!
Acknowledgements 🎉
Landscript would never have been born without the inspiration, guidance, feedback, and affirmation from my great professors, peers, and friends.
Thank you, Professor Gabriel Drozdov 🧩, the most supportive human I have ever encountered. Thank you for letting me audit your amazing course, “RISD GRAPH 3123–01 Type + Code.” Without your words, Landscript would never have been born.
A huge, huge, huge thanks to Tina Zhou 🏆, Tonia Zhang 🍎, Jasper Xie 🕶️, Doug Scott 🎩, Amy Ai 👽, Giorgia Sage 💬, Cindy Lyu 🍬, and my dearest mum 🧘🏼♀️, my magical aunt 🔮, and my worldwide grandma 🌏. Thank you for everything — truly, everything!
This journey is AMAZING!
To some extent, Landscript transcends the practicality of a coding interface. While it’s technically possible to code this interface in reality, it would be extremely challenging. Yet, that’s the beauty of this passion project — it goes beyond feasibility, envisioning an ‘anomaly-intuitive’ interface that adaptively scales over time, subtly redefining the paradigm of user experience for the next 10 to 20 years.
Currently, I am a designer at Hyundai Regeneration Studio, focusing on plant-based biomaterials for tangible interfaces in future mobility. At the end of the day, nature and sustainable design are what truly matter. While good design generates profit at its core, great design goes further — creating social benefits and sustainable values for the future.
I truly appreciate you reading this till this point — it really means a lot! Wherever you are, wherever we are, I always wish us godspeed!
Acknowledgements 🎉
Landscript would never have been born without the inspiration, guidance, feedback, and affirmation from my great professors, peers, and friends.
Thank you, Professor Gabriel Drozdov 🧩, the most supportive human I have ever encountered. Thank you for letting me audit your amazing course, “RISD GRAPH 3123–01 Type + Code.” Without your words, Landscript would never have been born.
A huge, huge, huge thanks to Tina Zhou 🏆, Tonia Zhang 🍎, Jasper Xie 🕶️, Doug Scott 🎩, Amy Ai 👽, Giorgia Sage 💬, Cindy Lyu 🍬, and my dearest mum 🧘🏼♀️, my magical aunt 🔮, and my worldwide grandma 🌏. Thank you for everything — truly, everything!
This journey is AMAZING!
An app interprets cultural slang and meme expressionsinto understandable language.