OVERVIEW
TikTok Shop launched in the U.S. in September 2023 🎉. I joined the Creator team a few months prior defining user experiences that help Creators grow and succeed on TikTok Shop. This week we launched the Creator Product Sheet, which provides one surface for all essential information and actions to help users sell products to their followers.
The two primary ways Creators make money are through brand partnerships and affiliate commissions (percentages earned on products sold). Previously, Creators would only be able to see earnings details from visiting the Creator Portal’s PDP (product detail pages). User research helped us understand that we lacked information and tools to efficiently help users decide if they should sell a product and make the sale (be able build their showcase and create a shoppable video).
We got feedback on the desired product factors (listed below ordered by % of participants that mentioned it’s importance).
-
Products with competitive prices are more likely to sell. If the price is too low, it may be counterfeit.
-
Products that offer free samples are more desired. Previously, Creators requested free samples, but never heard back from Sellers.
-
Not only scores, the review details are important to help Creators assess product quality before requesting or buying samples.
-
Low sales dissuade Creators from promoting items. Attractive qualities are top selling, trending, and “easy to sell” products.
-
Products with good commission rates are naturally more attractive.
Improving the user experience would not only enhance user satisfaction but also address development challenges of managing two PDPs. The Buyer view is managed by a separate team, and the Creator view of the PDP had minor differences that did not provide substantial additional value to users.
As a team, we explored three different concepts in collaboration with the Buyer PDP designer, Joseph to determine a direction and make it a reality.
[Figure 1] continues to explore having a Creator view of the PDP.
[Figure 2] explores a similar path that switches views through a toggle.
[Figure 3] explores a pull-up sheet that provides Creator-specific information and actions.
DESIGN CONSIDERATIONS
The pull-up sheet concept [Figure 3] would provide us the best path forward to address user needs and development concerns. The initial challenge was designing the right affordance for opening the Creator Product Sheet, ensuring that it does not disrupt essential information presented in PDPs. Specifically, we also needed to accommodate Creators who might want to shop for themselves (i.e. are also “Buyers”), requiring an unobtrusive affordance.
Visually, the challenge was to present critical and engaging information while ensuring the affordance remained distinct against a white (light mode) or black (dark mode) interface.
INFORMATIONAL
Essential info for creators to decide if they'll promote a product
ACTIONABLE
All core workflows for a promoted product should be readily available and accessible
SCALABLE
Anticipate feature growth when designing foundation and new patterns
The next design exercise was to apply the same process for the open state of the Creator Product Sheet. Here I wanted to emphasize the earnings and supply additional information and actions as a secondary treatment. I also kept into consideration scalability and growth of the content in the future.
Putting my design into motion, it helped dial in on visual and interaction details. The development team also helped reason what interactions could be supported, and we had to collectively agree on a final implementation.
FEEDBACK
It was helpful getting feedback as we neared finalizing designs. Major discussion points were ordering of actions that would match user expectations and the journey of selecting, posting, and selling a product. When we chat with Creators, a lot of our intuition was correct:
Highlighting earnings in dollars was more important than percentages.
Users favored the new pull-up sheet as the floating buttons we had in previous experiments were easily missed.
Users liked the ‘quickness’ in which they can see essential information before deciding to sell a product.
IMPACT + NEXT STEPS
The Creator Product Sheet is a huge success. Just the first week we’ve experienced 3X in conversion rate. We have more refinements coming in Q4 as we consider for supporting announcements, covering edge cases in detail such as loading states, and defining minimum sheet heights so that transitions between closed and open states are not awkward.
UPDATES
We made some refinements this quarter:
Our first launch had the title, “Earn $ on each product sold”, This was forcing the title to be double-lined and would be even longer for other languages. We decided to reduce to “Earn $ per sale” to resolve this.
The label, “96% positive ratings” was not grounded well to other elements on the sheet. So we’ve introduced a background and defined text size to P3.
3. I made visual refinements as we introduced a new element called ‘announcements’ to the sheet. I reduced row button texts from an H4 to P1.
4. Loading state refinement.
5. Iterating on product card to enable ‘get free sample’ flow.