TikCode Redesign
Overview
A QR code for users to connect with their friends. Provide QR codes for users to access various pages such as Hashtags, Sounds, and Effects. Showcase the brand style and creativity, offering users a unique experience when interacting with the TikTok QR code.
- Lead Product Designer
- UX design / Visual design
- Native App
Design Patent
QR code and Motion related
Background
Design for Creativity
With numerous other apps, TikTok has crafted a distinctive visualized Tikcode, representing a unique URL. Users can employ their camera for scanning or utilize the in-app scanning feature to navigate to the relevant page. Simply put, any code serves as a visual representation of a URL.
Current stage
Customized TikTok QR code
We propose transitioning from the Tikcode to a standard QR code. Using the conventional QR format, out-of-app users can access information without opening or having the TikTok app. This broadening of sharing touchpoints aims to attract new users (to download TT through WebApp) and re-engage existing users with the app.
Principle
Guiding users through the QR code
If the user has already installed TikTok, scanning the code with the native camera will redirect them to launch the app.
If the user has already installed TikTok and scans the QR code through the camera embedded in a third-party application, whether the app launches depends on the block strategy. If the third party hasn’t blocked:
- Scan and recognize;
- Launch the app, redirecting the user to the TikTok app.
If the user hasn’t installed TikTok, scanning the code will allow them to browse the WebApp (*with guidelines to download the app).
QR Visual
Redesigned TikCode
We redesigned the personal profile QR page, as well as the QR codes for sharing hashtag, sounds, and effects pages.
AB test
Improving share experience
Five groups were configured to test the impact of button layout and the share panel on share penetration.
The final data reveals that, while the V4 group, which exposes sharing channels by default, shows a positive impact on the sharing rate of personal page QR codes, the improvement is limited overall due to its low base (personal page QR code sharing penetration increased from 0.002% to 0.009%). The overall sharing rate of profile QR pages fluctuates.
Motion
Tikcode animation
To encourage user sharing, we experimented with adding animation design to the QR code, creating a more interactive, diverse, and personalized QR card. You can preview the animation mock below.
Click on the TikCode background, with the click point at 40×40 pixels as the center, expanding to the maximum radius of the screen as the mask.
