The first time I ever opened up TikTok, I was not really sure how to feel about its unique UI design.
A full-screen video immediately started playing, a random teenager doing a spooky dance along to a pop song or pranking on someone else. “Why don’t I get to choose what content to watch? How do I make the video stop? Where’s the homepage and my profile? What do I tap to get to my friends' list?...” TikTok contravenes everything I've been taught and everything I practiced in my design to date, yet the fact that it’s so engaging and effective drove me crazy! What’s going on here?
After some active TikTok video consumption and a lot of “wasted” days and nights, I start to realize that some of the app’s “weird” design decisions do not happen for no reason, and they may even teach us something about user experience.
1. Non-existent homepage?
Broken rule #1: The app’s homepage should allow users to navigate easily through the interface by providing points of reference as they move through a product interface. Page titles, highlights for currently selected navigation options, and other visual aids give users an immediate view of where they are in the interface. A user should never be wondering, “Where am I?” or “How did I get to this screen?”
TikTok's design: TikTok throws all the above away by putting a full-screen video playing in a loop on the homepage. There are no conventional menu bars, no obvious button to make the video stop, and no clear instructions on how to access your profile or friends' list.
Why it works: The full-screen video creates an immersive and engaging experience that absorbs you into the TikTok world once you open the app. Different from many other more function-oriented apps, TikTok's main purpose is to entertain its users - Using “Make every second count” as its slogan, TikTok makes it clear that the app is designed for fun short-form video consumption. Its lively homepage design reinforces this simple message and neatly contributes to an immediate and consistent brand image.
2. Icons without labels and obscure gesture interactions?
Broken rule #2：Predictability. Users should be provided with obvious cues that help them predict the result of an action. Icons without labels are thus not recommended. A user should never be wondering, "What do I need to press to do my task?" or "What is this button for?"
TikTok's design: The row of icons on the right overlaid on the live video and the plus symbol button in the middle of the bottom navigation are all examples of icons without labels. The gesture interaction of TikTok is also unique. Users can do most of the functionality by swiping and clicking on a page in TikTok. For example, the user can switch between different video contents only by sliding up and down. If the user wants to know more about the account that they are watching, they can scroll left to see all the videos on this account.
Why it works: 1) Icons without labels invite play and investigation. Once you are familiar with the meaning of each icon, it can actually speed up comprehension and reduce a user’s cognitive load. The icons chosen by TikTok are clearly representational in nature, and the app’s system gives users feedback for every click they make on the icon. For example, when you tap on the heart icon, it will turn red; when you tap on the comment icon, a comment box will pop up.
2) Similarly, the fun gesture interaction provides the users with room for discovery and delayed gratification in interfaces. It might seem a little bit unexpected at the beginning, but once the users are familiarized with them, it turns into some kind of muscle memory and can be even more intuitive and efficient than clicking on any labels or icons.
3. No choice over what content to consume?
Broken rule #3：Place users in control of the interface - Humans are most comfortable when they feel in control of themselves and their environment. Thoughtless software takes away that comfort by forcing people into unplanned interactions, confusing pathways, and surprising outcomes.
TikTok's design: TikTok is famous for its recommendation algorithm. It decides which video to play next for you based on the videos you like or share, accounts you follow, comments you post, and content you create. If the user plays the video more than three times in a loop, the system of TikTok assumes that you like the video. Moreover, the video continues playing even when the user is reading or filling in the comments. Only one half-screen pop-up appears, which creates a continuous watching environment for the user. In this way, people immerse themselves in current videos without distractions.
Why it works: When we are using an app to achieve a specific end, it might be true that we want more control in terms of where to click, what to do, and how to do it. But escapist entertainment is different – less thinking on what to choose might mean less mental efforts, less stress, and thus more fun. Modern people’s lives are already inundated with decision-making. By feeding us with endless AI picked videos, TikTok’s makes its user experience more about adventure, exploration, and discovery, which might be one of the reasons why it’s so addictive. The unexpected feeling of encountering new content serves as rewarding stimuli and a positive reinforcer to keep you wanting to discover more.
4. Steep video-shooting learning curve?
Broken rule #4：Reduce cognitive load as much as possible and make the main function as effortless as possible.
TikTok's design: A lot of people complain about TikTok’s steep learning curve, especially people in their 30s or 40s. The numerous filters and effects dazzle them and the complicated video-editing process makes them impatient. It's not "record and post" like Instagram stories. TikTok highlights its music attributes, and a critical reason for TikTok’s success is its soundtrack. So it encourages users to recreate original content using its popular soundtracks. Recording actions along with the bgm takes some practice and editing, and it also requires users to come up with more creative and engaging content rather than just record one’s everyday life.
Why it works: Actually, its great variety of weird filters and unique effects are exactly why young people love it so much. The various video editing tools and functions enable them to freely create whatever they want and express their creativity in a way that is not possible on many other social media platforms. Open up TikTok, and you will be impressed by what people can achieve in those 30 seconds videos. Less is more? TikTok doesn’t ever want to be less. Also, TikTok enables users of different skill levels to interact with the product at different levels without sacrificing expert users for a simplified video-shooting experience for novice or casual users. Newbies can still enjoy the app by consuming the substantial video content available there, so not being a video producer won’t necessarily make people turn away from the app.
5. Dense and vibrant design style?
Broken rule #5：Promote visual clarity and avoid presenting too much information at one time on the screen. Specific principles include simplicity in design to serve an overall function, clean lines and compositions, limited or monochromatic color palette, flat 2-dimensional patterns and textures, and big amount of spare space.
TikTok's design: From the neon-style logo with an electronic wave effect to the full screen live video background of the homepage, from the high-density layout with little white space to the multi-layered composition with white texts and icons overlaid on live video, TikTok is everything but minimalism.
Why it works: The current state of design encourages a strict adherence to severe simplicity. However, minimalism is too polite and boring for TikTok, whose goal is to create more fun for its users. By adopting a more lively and vibrant design, TikTok makes itself stand out from other social media platforms and also manages to create an unconventional and rebellious image that caters more to young people.
TikTok has now surpassed 315 million downloads on mobile devices after seeing a surge in popularity during the coronavirus pandemic — beating out Facebook and Instagram. Despite only being released globally in 2018, it ranks as one of the most downloaded apps of the last decade. TikTok's meteoric rise and huge success are no coincidence when viewed together with the broader context of the all-pervasive minimalist trend in the design field.
Over the past 5 to 8 years, minimalist design has been witnessing a rapidly increasing vogue in almost every field. Everyone is desperate to jump on the bandwagon, or risk being left behind. We're at a stage where if your app isn’t minimalist style, you’re not keeping up with UI design standards. We're at a stage where creativity is being stifled in preference of sticking to a flat design template that 'works'. Social networks are particularly good at "borrowing" ideas and features from their competitors. Instagram Stories famously took Snapchat's entire model of ephemeral content. And Facebook also borrowed from Instagram and YouTube for its Facebook Watch video service. As a result, everything is so generic, so similar, and so expectable. Against this backdrop, TikTok emerges as something unique, something creative, and more importantly, something different. Indeed, too much chaos and one craves order; too much order and one can feel stifled.
Does this mean all the existing UX rules are already obsolete? Not necessarily. However, it does remind us that in the realm of design, no rules can last forever, and no one can make constant success only by playing by the book. The above list of novel things that have worked for TikTok might soon go outdated themselves. Every design product is situated in specific micro and macro design environments, which are constantly subject to the influence of various economic, social, and cultural factors. So what is really important for us designers is to always keep abreast of the changes taking place around us and stay ahead of our past works. Having a strong disbelief system, which means always exploring the solution from a position of curiosity and skepticism, might be equally if not more important than having a belief system.
Comments