Designing interactive emojis and features to enhance engagement on the virtual event platform
During the COVID-19 pandemic, the demand for virtual events has surged. "Run The World," an all-in-one virtual event platform, has gained prominence with backing from A16z, Will Smith, and Kevin Hart.
Brief
The user journey of the virtual event can be divided into three main parts:
Part 1 - Before the Event:
- Includes the event creation process and ticketing.
Part 2 - During the Event:
- Live streaming experience inside the talk room.
Part 3 - After the Event:
- Activities related to networking, event review, and promotion.
This project mainly focuses on "Part 2." I chose this section because it's not a minor feature; it has a huge impact and is highly favored by users.
Part 1 - Before the Event:
- Includes the event creation process and ticketing.
Part 2 - During the Event:
- Live streaming experience inside the talk room.
Part 3 - After the Event:
- Activities related to networking, event review, and promotion.
This project mainly focuses on "Part 2." I chose this section because it's not a minor feature; it has a huge impact and is highly favored by users.
Role and Collaborations
I was involved in the end-to-end development process, from problem definition and research to prototyping and iteration. This role involved collaborating closely with the frontend and backend teams, iOS and Android engineers, and a data scientist.
Company / Product
Run The World
Timelime
2020
Team
Product Designer: ShaoPing Chen
PM: Ming Ma
Data Scientist: Jun Yan
Frontend Engineering Team
Backend Engineering Team
iOS Team
Android Team
QA Team
PM: Ming Ma
Data Scientist: Jun Yan
Frontend Engineering Team
Backend Engineering Team
iOS Team
Android Team
QA Team
Tools
Figma, ProtoPie, After Effects, Survey Monkey, Webflow
User Problems
Host
Organize events to generate revenue, promote, and make an impact.
How might we improve user participation and satisfaction for event success?
Speaker
Presenting speeches or talks to share expertise and boost reputation.
How might we assess the quality of my speech and grasp the attendees' reactions?
Attendee
Eager to acquire knowledge or expand their network.
How can we effectively interact and communicate with others during virtual events?
Goals and Metrics
Goals
1. Make virtual events that are engaging and dynamic to ensure users have an enjoyable experience.
2. Enhance participants' presence and engagement, encouraging users to interact and connect.
3. Design a set of expressive emojis suitable for both presentations and shows.
Metrics
1. Increase the user's engagement rate.
2. Improve connection conversion rates (follows and direct messages).
3. Raise the adoption rate of emojis and related features.
Challenges
💬 The Meaning and Aesthetics of Emojis
What kind of aesthetic standards, semantics, and emoji styles are suitable for our users and platform?
👁 Capturing Attention
How to grab users' attention without disrupting the event, considering cameras, screen sharing, and avoiding annoyance?
📐 Minimalistic Design
Within the constraints of limited screen space, how can we create highly interactive elements that work well on both web and mobile platforms?
Outcome and Impact
📈 Emoji usage experienced a significant increase two weeks after its launch.
👤 Users browse through others' profiles more frequently using Emoji Bubbles.
🔥 At the popular comedy show hosted by Stephanie Miller, emojis were sent almost every second!
Research
Emoji Design
I created five emoji sets and conducted a survey targeting people aged 20-30 in the US, collecting 117 valid responses. I selected 15 videos, including speeches, shows, interviews, and funny memes, to see how people use emojis to express emotions.
Purpose
1. How do people express their emotions through words, and which emojis do they use when watching different types of videos?
2. I've assigned hypotheses regarding emotions and keywords to each emoji to verify if they align with how users describe their feelings.
3. How many emojis are needed to effectively represent and cover most scenarios?
4. Which emoji set do users prefer and why? Does it match American aesthetics and culture?
Analysis Process
Insights
・Laugh (funny) and Thumb (cool) are the most widely used.
・People often use specific emojis in certain situations, like the Bulb (interesting) for informative content.
・Clapping (inspired) is commonly used during motivational speeches.
・Emojis without background color and outline are more popular because they're easier to identify and stand out.
Ideations and Solutions
Emoji Bubble
Users can send bubbles by tapping the emoji button—the bubble size changes based on their engagement, such as single taps, long-presses, or hyper-clicking. Bubbles also float out automatically if users leave multiple comments or request the microphone.
User Profile Card
The bubbles users send will instantly appear on the screen, displaying their activity level, type, and avatar. Users can hover over it to view a profile card, making it easier to identify others.
Say Hi and Chat
You can follow others or send a hand wave. The other person will receive your "Hi" notification, and then you can start a private chat.
*Messages feature was designed by Allen Wang (Product Designer)
People You Should Meet
The online user list suggests people to follow based on your info and ranks by activity level. If someone sends hand waves, emojis, comments a lot, or requests the mic, they appear first.
Event Insights
Event insights collect data about each session's engagement, like how many were inspired, laughed, appreciated your speech, and connections made among participants during the event.
Also, I created the Insights page template using Webflow and delivered it to the backend team, enabling efficient product launch without frontend resources.
Also, I created the Insights page template using Webflow and delivered it to the backend team, enabling efficient product launch without frontend resources.
Shareable Results
Create an interactive web page showcasing your achievements, which can be shared on social media to generate more interest in your event. Additionally, it serves as a certificate of participation for the event.
*Please note that this product is still in the exploration phase.
Prototype
In the exploration phase, I created different layouts and interactive ways. Using tools like Protopie and After Effects, I delivered the visual craft and specifications to the front-end engineers. With the backend team, we defined principles for interactions and activity levels.
Education Tips
Takeaway
Impact Driven
I'm proud to be part of a world-class team where decisions are quick, actions are meaningful, and deep exploration of underlying values. We measure impact and define success for every feature, ensuring they withstand scrutiny and questioning.
In-depth Research
In a fast-paced environment, conducting thorough research can be challenging. While I've learned to carry out quick research and gather feedback effectively, I recognize the need to deepen my research skills and eager to improve in this area.
© 2021-2024, ShaoPingChen.