TikTok Feature Update
The "Collections" feature on TikTok wasn't as intuitive and user-friendly as it could be. I wanted to make it easier to save videos into a Collection.
The Problem
The "Collections" feature on TikTok wasn't as intuitive and user-friendly as it could be. I wanted to make it easier to save videos into an album, a.k.a. a "Collection".
Project Goal
Select a well-known app and add a small feature.
Mimic the screens, practice good habits in Design System building and strengthen UI Technical and Visual skills.
Mimic the screens, practice good habits in Design System building and strengthen UI Technical and Visual skills.
1. The Challenge
“ Collections existed, it just wasn’t as easy as it could be.”
I use TikTok on a daily basis. It’s a source for ideas on workouts, cooking, hair tips and more. I wanted to save those videos in albums so I can access them more easily. So, I would download videos onto my phone and create albums in my own phone gallery to sort them.
Later I found “Collections” in TikTok which is essentially albums - but I didn’t know how to even get videos on there. I had to Google this - and this definitely could have been more intuitive.
2. Research & Discovery
I looked at each specific step to add a video to a collection album.
Competitive Analysis
I started to research what other common apps were doing. I observed that Airbnb had their version of saving places to a “Wishlist”. I saw this on Booking.com and Instagram as well. It was quick and painless, a feeling I wanted to portray with TikTok Collections.
Low-Fi Wireframes
3. Visual Design
I mimicked the UI of TikTok, following their layouts and iconography.
Hi-Fi Prototype
9 clicks down to 5
To save a video to a collection and view it.
I reduced the number of clicks by 55% making it more fluid to save a video to multiple collections and then view it.
Now - even if you simply want to save a video to Collections and continue scrolling, you're down to 3 clicks,
whereas currently Tiktok’s user flow forces you through all 9 clicks to save a video to collection.
Learnings & Findings
What's Next
- Conduct useability testing to really see how easy it is for users to save a video to a Collection.
- More features to think about - users can hold down on videos on their mobile app to remove the video from the collection or rearrange the ordering.
- Somehow make the Collections feature more noticeable.
Key Learnings
- Be more thorough with the design system from the get-go.
- Having a more organized color library and text style library would improve efficiency throughout the project.
- Sketch out more low-fi ideas to explore various solutions which would save time in the Hi-Fi prototype and changing and figuring out thing in that stage.
Loading