




















introduction
introduction
introduction
About QQ
About QQ
About QQ
QQ is a popular social media platform in China, launched by Tencent in 1999. It started as an instant messaging service and evolved into a multi-functional platform. Today, QQ offers a variety of features, including messaging, video calls, social networking, games, music, and even financial services. With over 500 million monthly active users, QQ continues to be widely used, particularly among younger audiences, and remains one of Tencent’s flagship products.
QQ is a popular social media platform in China, launched by Tencent in 1999. It started as an instant messaging service and evolved into a multi-functional platform. Today, QQ offers a variety of features, including messaging, video calls, social networking, games, music, and even financial services. With over 500 million monthly active users, QQ continues to be widely used, particularly among younger audiences, and remains one of Tencent’s flagship products.
QQ is a popular social media platform in China, launched by Tencent in 1999. It started as an instant messaging service and evolved into a multi-functional platform. Today, QQ offers a variety of features, including messaging, video calls, social networking, games, music, and even financial services. With over 500 million monthly active users, QQ continues to be widely used, particularly among younger audiences, and remains one of Tencent’s flagship products.
Challenge
Challenge
Challenge
How to rejuvenate a 25-year-old product and make it appealing to the younger generation.
How to rejuvenate a 25-year-old product and make it appealing to the younger generation.
How to rejuvenate a 25-year-old product and make it appealing to the younger generation.
In terms of design style, how to promote simplicity and efficiency while also incorporating a rich and youthful vitality.
In terms of design style, how to promote simplicity and efficiency while also incorporating a rich and youthful vitality.
In terms of design style, how to promote simplicity and efficiency while also incorporating a rich and youthful vitality.
QQ9
QQ9
QQ9
As a major upgrade, aims to bring more breakthroughs and innovations in user experience.
As a major upgrade, aims to bring more breakthroughs and innovations in user experience.
As a major upgrade, aims to bring more breakthroughs and innovations in user experience.
Reshaping the QQ brand: Appealing to a wider range of ages while focusing on young users.
Introducing virtual avatars: Providing users with a multi-dimensional interactive experience.
Enhancing product fundamentals: Focusing on making QQ more user-friendly and efficient.
Reshaping the QQ brand: Appealing to a wider range of ages while focusing on young users.
Introducing virtual avatars: Providing users with a multi-dimensional interactive experience.
Enhancing product fundamentals: Focusing on making QQ more user-friendly and efficient.
Reshaping the QQ brand: Appealing to a wider range of ages while focusing on young users.
Introducing virtual avatars: Providing users with a multi-dimensional interactive experience.
Enhancing product fundamentals: Focusing on making QQ more user-friendly and efficient.
What We Did
What We Did
What We Did
New branding
UI / UX
Animation
Website design
New branding
UI / UX
Animation
Website design
New branding
UI / UX
Animation
Website design
My role
My role
My role
Lead Designer
UI / UX
Key Visual & Branding
Animation maker
Lead Designer
UI / UX
Key Visual & Branding
Animation maker
Lead Designer
UI / UX
Key Visual & Branding
Animation maker
Design philosophy
Design philosophy
Design philosophy

As the platform to enhance consistency with a simple and lightweight design language.
As the platform to enhance consistency with a simple and lightweight design language.
As the platform to enhance consistency with a simple and lightweight design language.

Shaping a diversified social space with multi-dimensional interactions, allowing users to express themselves easily.
Shaping a diversified social space with multi-dimensional interactions, allowing users to express themselves easily.
Shaping a diversified social space with multi-dimensional interactions, allowing users to express themselves easily.
inspiration
inspiration
inspiration
Vast Snowy Plains, Radiant Light
Vast Snowy Plains, Radiant Light
Vast Snowy Plains, Radiant Light
The vast, boundless snowy plains at dawn, where the sky and earth merge into one, pure and pristine. This is not the end but a new beginning. Feel the perfect blend of brilliance and excitement, warmth, and care that 'light' brings, all on a foundation of purity and simplicity.
The vast, boundless snowy plains at dawn, where the sky and earth merge into one, pure and pristine. This is not the end but a new beginning. Feel the perfect blend of brilliance and excitement, warmth, and care that 'light' brings, all on a foundation of purity and simplicity.
The vast, boundless snowy plains at dawn, where the sky and earth merge into one, pure and pristine. This is not the end but a new beginning. Feel the perfect blend of brilliance and excitement, warmth, and care that 'light' brings, all on a foundation of purity and simplicity.



Clean & Minimalistic
Clean & Minimalistic
Clean & Minimalistic
Inclusive container
Inclusive container
Inclusive container

Vibrant & Warm
Vibrant & Warm
Vibrant & Warm
Full of youthful vitality
Full of youthful vitality
Full of youthful vitality



Play of light
Play of light
Play of light



White plains
White plains
White plains



Flowing radiance
Flowing radiance
Flowing radiance
concept
concept
concept
Carefree
Carefree
Carefree
自在随心
自在随心
Limitless
Limitless
Limitless
无远弗届
无远弗届


meaning
meaning
meaning
Lively and Joyful
Experience
Lively and Joyful
Experience
Lively and Joyful
Experience
轻松愉悦
轻松愉悦
Inclusion and
Accommodation
Inclusion and
Accommodation
Inclusion and
Accommodation
包容承载
包容承载


visual image
visual image
visual image

Light

Color
光
色彩
Flowing Radiance

Light

Color
光
色彩
Flowing Radiance

Light

Color
光
色彩
Flowing radiance
Metaspace
Metaspace
Metaspace

Shape
Shape
Shape
元空间
元空间
形
形
Sleek and Pure BG Patterns
Sleek and pure BG patterns
Carefree' embodies a lively and joyful experience, visually represented through 'Flowing Radiance', a design element that suggests vivid and dynamic fluidity. 'Limitless', signifying inclusion and accommodation, is captured through Shape Patterns of snowy plains.
Carefree' embodies a lively and joyful experience, visually represented through 'Flowing Radiance', a design element that suggests vivid and dynamic fluidity. 'Limitless', signifying inclusion and accommodation, is captured through Shape Patterns of snowy plains.
Carefree' embodies a lively and joyful experience, visually represented through 'Flowing Radiance', a design element that suggests vivid and dynamic fluidity. 'Limitless', signifying inclusion and accommodation, is captured through Shape Patterns of snowy plains.
The brilliance of QQ9 lies in its simplicity and purity, where beneath the surface, it conceals a richness and vibrancy waiting to be explored and discovered by the user, rather than immediately capturing their attention with flashy colors and elements.
The brilliance of QQ9 lies in its simplicity and purity, where beneath the surface, it conceals a richness and vibrancy waiting to be explored and discovered by the user, rather than immediately capturing their attention with flashy colors and elements.
The brilliance of QQ9 lies in its simplicity and purity, where beneath the surface, it conceals a richness and vibrancy waiting to be explored and discovered by the user, rather than immediately capturing their attention with flashy colors and elements.
User’s Emotional State
User’s Emotional State
Appearing at every user's emotional touchpoint, serving as a prompt, guide, or expression of care.
Appearing at every user's emotional touchpoint, serving as a prompt, guide, or expression of care.
User’s Emotional State
Appearing at every user's emotional touchpoint, serving as a prompt, guide, or expression of care.
Background Pattern
Background Pattern
The spatial texture( pattern) exists as a background.
The spatial texture( pattern) exists as a background.
Background Pattern
The spatial texture( pattern) exists as a background.

Pattern background
Pattern background
Pattern background



Login
Login
Login



chats
Chats
chats



Messaging Interface
Messaging interface
Messaging Interface



Friends Status
Friends status
Friends Status



Mini Program
Mini program
Mini Program
Radiance In UI
Radiance In UI
Radiance In UI
Splash screen
Splash screen
Splash screen






Default Splash screen
Default Splash screen
Default Splash screen
QQ's logo
Clean background
Vibrant & colorful
Positive upward
QQ's logo
Clean background
Vibrant & colorful
Positive upward
QQ's logo
Clean background
Vibrant & colorful
Positive upward
New Startup Page
New Startup Page
New Startup Page
Clean background
Flowing radiance
QQ's logo
New version NO.9
Clean background
Flowing radiance
QQ's logo
New version NO.9
Clean background
Flowing radiance
QQ's logo
New version NO.9









Refresh
Refresh
Refresh



Search
Search
Search
Chats
Chats
Chats
We hope that the radiant beauty serves as a positive influence on users, guiding them in an uplifting manner.
We hope that the radiant beauty serves as a positive influence on users, guiding them in an uplifting manner.
We hope that the radiant beauty serves as a positive influence on users, guiding them in an uplifting manner.
messaging
messaging
messaging
To mitigate user anxiety during this time, we integrate flowing radiance into the loading component, enhancing the user experience even under the weak network conditions.
To mitigate user anxiety during this time, we integrate flowing radiance into the loading component, enhancing the user experience even under the weak network conditions.
To mitigate user anxiety during this time, we integrate flowing radiance into the loading component, enhancing the user experience even under the weak network conditions.



Image loading
Image loading
Image loading



Group chat engagement
Group chat engagement
Group chat engagement



Messages loading
Messages loading
Messages loading
Quick Actions
Quick Actions
By introducing shortcut methods, we aim to enhance users' efficiency in viewing and sending messages.
By introducing shortcut methods, we aim to enhance users' efficiency in viewing and sending messages.
By introducing shortcut methods, we aim to enhance users' efficiency in viewing and sending messages.



Organizing message list
Organizing message list
Quickly organise message list



Sending messages
Sending messages
Sending messages
avatar
avatar
aIO interaction (Conceptual Proposal)
aIO interaction (Conceptual Proposal)
aIO interaction (Conceptual Proposal)
It showcases the explorations in the use of avatars within the messaging context. We aim to foster more engaging and enjoyable interactions among users.
It showcases the explorations in the use of avatars within the messaging context. We aim to foster more engaging and enjoyable interactions among users.
It showcases the explorations in the use of avatars within the messaging context. We aim to foster more engaging and enjoyable interactions among users.



Virtual interaction
Virtual interaction
Virtual interaction



Switching virtual space
Switching virtual space
Quickly Switching Virtual Space
Structure
Structure
Structure
user profile
user profile
user profile
Vivid & dynamic avatar profile
Simulating weather conditIons
Outfit recommendation
Taking photo with friends
Vivid & dynamic avatar profile
Simulating weather conditIons
Outfit recommendation
Taking photo with friends
Vivid & dynamic avatar profile
Simulating weather conditIons
Outfit recommendation
Taking photo with friends






Desktop platform
(Conceptual Proposal)
Desktop platform
(Conceptual Proposal)
Desktop platform
(Conceptual Proposal)
As users scroll through the list, their friends' avatars are displayed within the desktop window.
As users scroll through the list, their friends' avatars are displayed within the desktop window.
As users scroll through the list, their friends' avatars are displayed within the desktop window.
Contacts
Contacts
Contacts
Consolidate less frequently used entries into More, focusing on the most critical contact actions. In the Friend Status section, users can share their moods and interact more with others.
Consolidate less frequently used entries into More, focusing on the most critical contact actions. In the Friend Status section, users can share their moods and interact more with others.
Consolidate less frequently used entries into More, focusing on the most critical contact actions. In the Friend Status section, users can share their moods and interact more with others.






Simplify info structure
Simplify info structure
Simplify info structure






Add friends status
Add friends status
Add friends status






Allow users to customize
Allow users to customize
Allow users to customize






Old version
Old version
Old version
about
about
about
easter egg
easter egg
easter egg
Users can enter a hidden easter-egg page by interacting with the 3D QQ logo. On this page, we offer the wallpapers about QQ9, delivering unexpected surprises to users and aiding in the product's marketing efforts.
When users discover this feature, they tend to share it on social media, It’s organic promotion and generating buzz around the product.
Users can enter a hidden easter-egg page by interacting with the 3D QQ logo. On this page, we offer the wallpapers about QQ9, delivering unexpected surprises to users and aiding in the product's marketing efforts.
When users discover this feature, they tend to share it on social media, It’s organic promotion and generating buzz around the product.
Users can enter a hidden easter-egg page by interacting with the 3D QQ logo. On this page, we offer the wallpapers about QQ9, delivering unexpected surprises to users and aiding in the product's marketing efforts.
When users discover this feature, they tend to share it on social media, It’s organic promotion and generating buzz around the product.



Wallpapers
Wallpapers
Wallpapers










QQ Chasers of Light
QQ Chasers of Light
QQ Chasers of Light
We introduced a feature called 'QQ Chasers of Light' where users can submit their feedback. Their nicknames will be displayed on the Nickname Wall, and they will receive a special badge as a token of QQ's gratitude for their sincere support and contributions.
We introduced a feature called 'QQ Chasers of Light' where users can submit their feedback. Their nicknames will be displayed on the Nickname Wall, and they will receive a special badge as a token of QQ's gratitude for their sincere support and contributions.
We introduced a feature called 'QQ Chasers of Light' where users can submit their feedback. Their nicknames will be displayed on the Nickname Wall, and they will receive a special badge as a token of QQ's gratitude for their sincere support and contributions.



QQ9 Website
QQ9 Website
QQ9 Website



Promotional Video for qQ9 launch
Promotional Video for qQ9 launch
Promotional Video for qQ9 launch
Global Collaboration
Global Collaboration
Global Collaboration
Collaborated with a Seoul-based team, working across different time zones.
Collaborated with a Seoul-based team, working across different time zones.
Collaborated with a Seoul-based team, working across different time zones.
A team of 5 people
A team of 5 people
A team of 5 people
2 from China and 3 from South Korea
2 from China and 3 from South Korea
2 from China and 3 from South Korea
My responsibilities
My responsibilities
My responsibilities
Providing necessary design resources
Overseeing the design style and ensuring consistency
Communicating with the South Korean team
Providing necessary design resources
Overseeing the design style and ensuring consistency
Communicating with the South Korean team
Providing necessary design resources
Overseeing the design style and ensuring consistency
Communicating with the South Korean team
Hand-drawn storyboard for key video shots
Hand-drawn storyboard for key video shots
Hand-drawn storyboard for key video shots






More works
More works

Huikang Li
Product Designer
Based in Halifax, CA

+1 (782) 775-4746
© 2024 Huikang.Wesley All rights reserved.

Huikang Li
Product Designer
Based in Halifax, CA

+1 (782) 775-4746
© 2024 Huikang.Wesley All rights reserved.

Huikang Li
Product Designer
Based in Halifax, CA

+1 (782) 775-4746
© 2024 Huikang.Wesley All rights reserved.