Time
Dec. 2022 - Apr. 2023
Role
Product & UXUI Designer
Team
2 Product Designers
2 Product Managers
Development Team
Art Resources Team
Tools
Sketch
Photoshop
“Pick with Me” Mini-program
From August 2022 to May 2023, I worked as the UX & Product Design Intern at Universal Beijing Resort (UBR), contributing to the product, system and UXUI design for UBR's B2C website and application.
"Pick with me" is a social mini gamify program launched by UBR during the 2022-2023 epidemic period, which enhances users' online interactive experience with UBR through customized DIY avatars and interesting actions. Even though the number of tourists decreased due to the epidemic, this small gamify program still promoted the spread of brand culture through social sharing, achieving fission, so as to maintain user stickiness.
Impacts
Built product from 0 to 1
Defined the product's user journey, decided the artistic style function and information architecture, built the product from 0 to 1.
Considerable user usage
Within a year of its launch, it iterated two kind versions (Normal version and Halloween version), and the total cumulative number of users has reached 2w.
Background
Problem
Starting from October 2022, due to the serious epidemic in China at that time, the government began to implement closed management of public places such as schools and companies, and imposed travel restrictions on large group of people. Universal Beijing Resort has experienced a noticeable loss of visitors that has resulted in many financial losses.
Design Challenge
How to increase the online interaction between users and Universal Beijing Resort, to promote the brand culture and increase the revisit rate
User Research
How we choose the target user?
Most of the users of Universal Beijing Resort are between 15 and 50 years old, with the highest repeat rate of 20-30 year old tourists. Therefore, our main target user group is young generation, especially Generation Z between 20-30.
What do users need?
Market research shows that Gen Z are increasingly turning to social media platforms that offer more visual content and fewer words. At the same time, combined with the origin of the meta-universe, we found two popular trends for Gen Z:
Customized virtual images are once again a hot trend, and virtual avatars social networking has gradually become the preference of Generation Z. It can create more opportunities for brands to interact with users.
Social platforms have always been a key traffic position, in this era of photo reading, the reason for sharing demand is often interesting content or useful products, such as today's funny posture and expression has gradually become a new way of taking photos for contemporary young people.
By combining these two trends, we want to provide users with a fun, customized image social experience.
Avatars gradually becoming popular
Gen Z love to taking photos & sharing
Create DIY avatar & sharing interactions?
Design Goal
Combining elements of Universal Beijing Resort to provide a avatar customization and interaction sharing social gamify application
Project Flow
What I have did in this project?
In this project, I mainly carried out following three parts of work:
Event Planing
Art Style Define
Define art elements
Determine style
UI Revamp
Game planning
The core gameplay
When designing the gameplay, I started from the perspective of user needs, combined with what UBR can offer them, and finally came up with the idea of "Making electronic interactive Polaroid with your friends".
Interaction flow
The overall user process mainly includes: electronic Polaroid customization (including scenes, posture and avatar), inviting friends to participate in customization, completing customization, participating in the lottery, and sharing activities:
Art design
Art style and element define
In this section, after a lot of style research, I choose retro American as the overall art style, which is more in line with our brand and the retro tone of Polaroid. I also disassembled the elements needed to define the avatar, including eyes, mouth, hair, face decoration, and head decoration. In addition, I searched for the reference of cute group photo poses of different people and designed the form of polaroid.
UI Revamp
Design version 1
After determining the interaction flow and art style, we designed the first version of the UI. Here are the main prototypes and interaction flows: the introduction of this game, the user customized avatars to share with friends and take group photo, and the completion of the sharing activity for the lottery.
UI walkthrough and problem definition
There were many problems in the UI design of the first version. Our whole activity concept was "social avatar customization + sharing and interaction", and needs to emphasize the style of electronic album, but the current key interface could not convey this concept well in terms of vision and interaction, so I conducted problem analysis on it in order to optimize UI.
Design Strategy
# Unify the icons for clearer vision
# Redesigning the components to keep visually coordinated
# Electronic Polaroid style to deliver activity concept
Design
Icon design
I designed a set of outline style icons using google material design specification:
Component design
On the basis of icon design, I reconstructed the design components of UI interface to make the overall style more unified:
Design iteration
Design comparison between 2 versions
After unifying the icons and redesigning the components, I redesigned the key interface by redesigning the entire style, and now it looks more like an electronic Polaroid customization overall, more in line with our activity concept.
Final UI design showcase
The overall final design optimizes more details, including maps, game elements, and more, conveying key concepts.
Poster showcase
This small program is currently iterated in two versions, including a regular edition and a Halloween special edition.
