Case study: Reacting to TikToks
TikTok Reactions
Due to the circumstances of the past year, I, like most people, have become an avid TikTok user. It provides quick, catered content that grabs your attention and holds it as long as you let it. About a month ago, I made the brave decision to limit myself to 2 hours a day. Nevertheless, I still watch and like a lot of videos every day. However, in a few days when I want to rewatch the funniest ones, I won’t know where to look.
I always run into the issue of never finding a video I’m thinking of and turns out I am not the only one. Therefore, I sought to find a solution.
I started by writing down my problem.
When I remember a video I watched on TikTok, I want to be able to easily find it again to rewatch it or share it with friends. I can’t do that well because …
I don’t know how to search for it and scrolling through likes is an inefficient use of time.
Although I couldn’t imagine that I was the only person with this issue I needed to make sure that my assumption was true. I needed to conduct a few user interviews.
I asked others what they thought.
I interviewed TikTok users and creators in TikTok’s target demographic, 13–45 to find out what pain points they reach in their usage of the app and especially when trying to rewatch videos. They gave me some key insights:
- Users don't enjoy scrolling through their likes. Some users like every video they see, while others only interact with ones they enjoy the most. Either way, there are too many liked videos to sift through.
- Users tend to avoid searching for videos. Instead of searching for a video by content, they do it by users or sound. Both of which are nearly impossible to remember for every like video.
- Users tend to only favorite important videos. Users sparingly use the favorites feature, saving it for essential information they know they want to revisit, not necessarily content for enjoyment.
People need a way to bridge the gap between favorites and likes.
Users have too many likes and to avoid having too many favorites, they tend to avoid favoriting. In this process, videos don’t get shared, fewer laughs are made, and users become frustrated with themselves. There has to be some sort of balance or a way for users to categorize videos further than simply like or favorite.
My revised people problem:
When users remember a video they watched on TikTok, they want to be able to easily find it again to rewatch it or share it with friends. They can’t do that well because …
They have a hard time searching for it and scrolling through likes or favorited videos is an insufficient process.
Now that there was a clear problem, it was time to think of solutions.
I needed different perspectives.
To have a well-thought-out solution, I needed other people’s input. I gathered some of my colleagues and we generated a lot of ideas, but all of these ideas could be categorized into 3 general solution spaces.
From there we voted on our top three solutions and —
I decided on a solution.
The solution I chose had a high impact and medium feasibility, while the others had a medium impact and high feasibility. Since my goal was to solve the people problem, I prioritized impact over feasibility.
I started to build the solution.
Looking at the existing information hierarchy, I needed to add two main components to the app: Reactions and a likes filter.
This meant that I needed two user flows. One for reacting to a video and one for finding that reacted video.
Reactions
I started by thinking of interactions that best fit within the app. The two that I explored were holding the screen and holding the like button.
Although holding the screen is how users access favorites, the screen just became too dense and reactions needed to be a separate feature.
Interaction C was the best integration within the app as it combines the familiarity of the bottom sheet users get when holding the screen with the added visibility of a pop-up.
After I decided on the interaction, it was time to design the reaction icons. Taking inspiration from Facebook, Duolingo, and Instagram I created the reaction bar.
Filtering Likes
To add a filtering system to the likes I did multiple explorations from adding a filter button to adding a whole new entry point for likes.
Ultimately C was the best choice as adding the new entry point also added more screen space. With this exploration iteration D with the tabs instead of traditional filtering allows for users to clearly see and swipe through reactions, instead of going through what resembles a search engine filter.
At this point, I had a testable solution that I needed feedback on.
I asked more people what they thought.
I interviewed in the same demographic but with different people this time. Each person varied in their usage of the app ranging anywhere from avid user to one-time user.
Main insights:
- Users had trouble seeing the reactions. On lighter backgrounds, the angry reaction was easily washed out.
- Users questioned the purpose of having likes, likes and reactions, and favorites. Although most users could infer what the new button did, it is only clear after they explore the app further.
Explorations to increase visibility
To make reactions more visible I considered making all of them larger and changing their color.
Iteration B stays consistent with the functionality of the like heart and integrates well within the hierarchy or the app. Although the hearts solve the visibility issue, aesthetically making hearts for only some of the icons looks odd. In A, there is no longer a good way to distinguish between the like and love hearts.
Since I chose B, I still needed a way to increase the visibility of the angry reaction.
Angry Reaction
Option C allowed for both increased visibility and added value to the emotion itself.
With the angry alteration, the reaction bar was complete.
Final Reaction Bar
Explorations to decrease confusion
The confusion between the two entry points for likes needed to be addressed and I explored this in two ways.
B was the most consistent with the existing likes and allows for all of those videos to clearly be moved to a new place that allows for reaction filtering.
How I built the solution
This is the UI Kit that I made to help me create a solution.
Finally, I solved the problem.
These are the final user flows for reacting to a video and finding a video that was already reacted to.
Prototype
I did it: Conclusion and Reflection
TikTok
Due to the pandemic, TikTok was able to gain an audience of people who once cringed at TikTokers. Many people think that its quick rise to fame means that its downfall will just as quickly. However, I think the app has a long life ahead.
The algorithm of the app is enough to get users addicted and it will be a while before those users quit the app completely. Nevertheless, to keep the average audience member, the app will have to adapt to the users’ needs. Addressing pressing concerns users have should always be a priority.
I’m not sure what TikTok’s next move is, but I am excited to see what they decide to do. Whether it be adding reactions, improving messages, or increasing accessibility I hope it makes people happy.
Self-Reflection
As for me, this is my first case study and I created this for Introduction to Digital Product Design. I enjoyed expressing my creativity and challenging myself to think about every solution before jumping onto the first one I thought of.
Throughout this process, I learned that design is more than just making pretty things. It is about having a purpose and being intentional with every little choice you make because every decision has an impact.
*This case study was made for Introduction to Digital Product Design at Cornell University. I am in no way affiliated with TikTok.*
