view project
COMING SOON
Series A
Raised $25M
UNICORN
Valued at $250B
Acquired
By Meituan at $2.7B
view project
COMING SOON
→ Brand

A playful brand identity for Web3

OpenAsk may not be the first Q&A platform, but its founders are confident that with their close relationships with many influencers in Web3, they can make a significant impact. To align with the preferences of the average Web3 user, who tends to be more adoptive to new trends and styles, we have opted for a bold and playful brand identity. This distinctive and lively visual identity not only enhances the product's design, but also contributes to a more enjoyable user experience.

→ Product

A responsive web product

The team's objective is to release the MVP within 2 months and onboard as many customers as possible. With limited eng power, it wasn't feasible to create both a web and iOS app. Consequently, designing a responsive product was critical to ensure a seamless cross-platform user experience.

For maximum efficiency, all components were designed with responsiveness in mind. By utilizing Flexbox CSS, most components don't even require additional configuration across breakpoints.

✦ Adopting the playful look & feel

In terms of visual design, we introduced more playful styles and elements to create a more engaging and seamless user experience, as well as infuse more personality into the product.

→ System

A design toolkit to ensure consistency, efficiency, and scalability

I strongly believe that a design toolkit is essential for achieving consistency in user experience and creating a shared vocabulary between designers and engineers. Given OpenAsk's limited engineering resources, it is critical to make the best use of their time by providing a systematic and reusable design toolkit so that we can save them from repetitive, manual work.

To begin building the toolkit, I focused on designing the tokens, including the font and colors. Instead of using a traditional, sequential naming system, I used a "use-case-based" naming convention. Each color and font type is named after its specific use case, making it easy to follow and reuse throughout the design system.

✦ Tokens → Components → Views

The established design tokens were assembled into each individual component, and the components are composed into views that users browse and interact with.

✦ Ensuring consistency in components for a cohesive experience

As the product evolved, we had to incorporate new views. During the process, we carefully assess whether exiting components can be reused or introduce new ones were necessary. We also reviewed and modified components of the same type to ensure uniformity and consistency in their structure and layout, which is critical to a cohesive user experience.

More projects

client
year
type
service

Designing a trading platform for commercial real estate stocks

2021

Full-time

Web App

Designing a trading platform for commercial real estate stocks

2021

Full-time

Web App

Rootly On-Call

2024

Full-time

Web App

Rootly On-Call

2024

Full-time

Web App

Design system: enabling velocity and consistency for a lean product team

2021

Full-time

Systems

Design system: enabling velocity and consistency for a lean product team

2021

Full-time

Systems

Gave our website and brand a new look

2024

Full-time

Website

Gave our website and brand a new look

2024

Full-time

Website

ModelZ - Easy AI for Developers

2023

Client

Brand Identity

ModelZ - Easy AI for Developers

2023

Client

Brand Identity

Waitlist app: secure early adopters for first-mover advantage

2020

Full-time

Web App

Waitlist app: secure early adopters for first-mover advantage

2020

Full-time

Web App

Want to see all projects?
Check the  ↳project index .