Orchid Pavilion
The first all-in-one Chinese calligraphy platform aims to provide a quick and easy way for both Chinese and non-Chinese users to browse, study, and shop.
​Overview of the Project
Project Type
Individual UX/UI Project
My Role
UX/UI Designer | UX Researcher
Project Duration
Jan 2022 - Apr 2022
Jan 2022 - Apr 2022
Tools
Figma
Adobe Photoshop
FigJam
Notability
Platforms
Web | Mobile (iOS)
Design Process
.png)
The Problem
I came up with the idea for this project while writing Chun Lian (a traditional Chinese decoration) during the Chinese New Year this year. I conducted competitor analysis and noticed that most platforms for learning and searching Chinese calligraphy script styles are either outdated or difficult to use. They are also not user-friendly and accessible to non-Chinese users. In addition, essential Chinese calligraphy materials are difficult to find and very expensive in Canada.
User Research
To see if these are common issues for Chinese calligrapher enthusiasts, I interviewed two potential users of my product.
They have also expressed similar problems encountered during their Chinese calligraphy journey.
.png)
Opportunity Areas
Based on the competitor analysis and primary research, I identified the opportunity areas for Orchid Pavilion.
A Place to Search
A place for users who wish to practice Chinese calligraphy on their own but do not know how to look up Chinese characters using Chinese input methods
A Place to Learn
A place for users who wish to learn Chinese calligraphy through online courses
A Place to Buy
A place for users who wish to purchase essential Chinese calligraphy materials at a reasonable price
Clean, and User-friendly
A place with a modern, clean UI design that is user-friendly and accessible to all
Reframing the Question
Ideation
Information Architecture
Based on the opportunity areas and the how-might-we statement, I ideated and designed the information architecture of Orchid Pavilion. I focused on designing an all-in-one Chinese calligraphy platform - Orchid Pavilion, that aims to provide a space for non-Chinese users to browse, study, and shop in a fast and easy way.
Sketches
Then, I brainstormed the user flows while sketching the low-fidelity storyboard on my IPad. (One of my favourite parts, where I can see my product come to life gradually)
Visual Design
Orchid Pavilion's creative strategy focuses on providing oriental, elegant, coherent, calming, and classic feelings through the colour and typeface. I hope the art of Chinese calligraphy could help users in finding inner peace.
.png)
High-Fidelity Mockups
With opportunity areas in mind, Orchid Pavilion's web version includes 3 primary user flows that focus on solving users' pain points and meeting users' needs.
​
User flow 1 shows how a non-Chinese user could use the website's "Calligraphy Lookup" function to search for a specific Chinese character in Chinese Calligraphy script styles using English.
User flow 2 shows how a user could enroll in a free Chinese Calligraphy course on the website.
User flow 3 shows how a user could use the website to purchase reasonably priced essential Chinese Calligraphy materials on the website.
.png)
Storyboard - Web Version
Click the title on the bottom to view the complete storyboard in full screen.
Key Screen: Home Page
Key Screen: Sign Up Page
Key Screen: Course Page
Key Screen: Shop Page
Mobile (iOS) Version
The mobile version is focused on user flow 1. The reason is that in most cases, when a person practices Chinese calligraphy on a table, the paper, brush, and ink stone have already taken up a lot of space, and there will be limited space to put a computer on the table for imitation purposes. As a result, a phone version would be more convenient and easy to use in the actual situation. The "Practice to Draw" tool would be very useful for newbies to begin practicing drawing strokes while using their fingers to draw on their phones.
.png)
Mobile (iOS) Version Storyboard
Iteration
Design Critique and Improvement
Even though it was an individual UX/UI project, I still asked my peer designers for a design critique. I thought this was very beneficial and essential because it may be difficult for an individual to realize the problems with a designed product.
Design Critique #1
Improvement #1
Design Critique #2
Improvement #2
Design Critique #3
Improvement #3
Design Critique #4
Improvement #4
Next Steps
👩💻 More user research, conduct usability testing, and iterations.
💻 Dive into app design and development using emerging technologies such as a multitouch table to allow users to practice Chinese calligraphy paperlessly at home.
💠Continue seeking open feedback for this product to improve the design.
My Reflection
This was my first individual UX/UI project, and it was a lot of fun to work on. It was exciting to watch my product come to life gradually. There were a few obstacles I face along the way, such as having to build everything from the scratch and brainstorming on my own. However, I believe that challenging work can be a great motivator because it can help me discover my potential! Once I was on the right track, I realized that talking to users and getting their feedback could greatly help my design process; user is the key. Furthermore, openly accepting critiques from others will greatly improve the design and process; more brains are better than one.
​
Most importantly, I've discovered that UX design is something I super enjoy. I'm grateful that I was able to express my creativity through my design work.