Cooking Class Feature for Content Creator on TikTok
Introduction
Hello 👋🏼! My name is Nisa, UI/UX designer enthusiasm and I’m currently joining Dibimbing.id bootcamp. In this article, I will share the process and results of my research which took approximately 2 months to complete. This article is my final project which was created to fulfill my bootcamp program requirements.
Overview
TikTok is a social media application that allows users to create and share short videos with a duration of 15 to 60 seconds. Various types of videos can be found on the TikTok app, including dance and movement, comedy, tutorials, creativity, and others. One type of video that is becoming increasingly popular on TikTok is cooking tutorials. With a short video duration, TikTok users can easily create cooking tutorials that are easy to follow and engaging for viewers. However, many cooking content creators recommend switching to other platforms to explore more comprehensive cooking tutorials due to limitations in terms of video duration and lack of features that support cooking content creators on TikTok.
Role: UX Researcher, UI/UX Designer, UX writer
Scope: User Research, Analyzing, User flow, Wireframing, Prototype,
Timeline: 3 weeks(UX) + 5 weeks (UI) 2 February-30 March 2023
Tools: Figma, Figjam, Sheets, Foam
The Process
For this particular study, I will be employing the Design Thinking Process, utilizing Qualitative Research Method during the Empathize and Define stage, and conducting Usability Testing for the Test stage.
Planning the Research
Objective
The objective of this research is to investigate and explore the habits, goals, needs, and pain points of cooking content viewers and creators.
Methodology
In this research, I used two methods :
- Screening survey: the initial survey process was conducted to find out user demographics and find out cooking content viewers and creators users to do the interview process.
- In-depth interview: The second stage of the process is used to dig deeper into information from users in using cooking content viewers and creators.
Sample Specification
1. Cooking content viewers
2. Cooking content creators
3. Female/Male
4. 18–45 years old
5. National Scale
Key Information Areas
The main subjects that we want to explore in this research are the key information areas. These subjects will serve as the foundation for the question-making process:
1. User Profile
2. General behavior when watching cooking content
3. General behavior when creating cooking content
Conducting the Research
Distributing a Google Form and scheduling interviews with eligible respondents was the initial step I took before conducting the research. The interview process was conducted online using Google Meet with a total of 7 respondents, consisting of 3 female and 4 male respondents, aged between 18 and 45 years old. The interview lasted for approximately 1 hour and was conducted with a questionnaire guide that had been prepared beforehand to ensure consistency of questions and to achieve the research objectives. The results of the interviews were used to evaluate the needs and preferences of users and content creators in this study.
Discussion Guideline
1. User behavior when watching cooking content on Tiktok
- Share your experience of watching cooking content on Tiktok?
2. User goal when searching for cooking content
- What is your purpose for watching cooking content? Do you have any specific goals you want to achieve? Why do you have those goals?
3. User journey when searching for cooking content
- What do you think is the best way to help you learn cooking online?
-Can you tell me about a time when you wanted to recook a dish, but couldn’t because of a lack of clear guidance? Did you find a solution when it happened?
4. User preference for a cooking class
- Have you ever attended a cooking class before?
- What kind of cooking class do you want to take?
- Are you the type of person who prefers to pay to attend cooking classes on TikTok or do you prefer the free option with ads?
- In your opinion, what is the best way to deliver cooking classes on TikTok? Is it through live videos or a dedicated feature?
5. User expectations when watching cooking content on Tiktok
- If you don’t mind me asking when watching cooking content on TikTok, is there any feature that you feel you need but is not yet available on TikTok?
You can read detail about discussion guidelines here
Finding Insights
I have utilized several techniques, including Affinity Diagram, User Persona, and Customer Journey Map, to uncover insights.
Affinity Diagram
After completing the interview process with all respondents, I wrote down the results of the interview transcripts in Sheets. Then, I represented them using an affinity diagram to present the interview results visually and systematically. With this technique, I was able to group the information obtained from the interview transcripts into different categories and identify respondents’ thought patterns and preferences more clearly and structured. Here is the link to the affinity diagram
User Persona
I create user personas to describe user characteristics such as age, gender, education, occupation, and other preferences. With user personas, we can understand users, what they need, and how we can provide a better experience.
Customer Journey Map
The next step I took was to create a customer journey map to examine the detailed steps and interactions taken by users who enjoy cooking content with cooking content creators. Additionally, I used this step to understand the emotions and attitudes of users who enjoy cooking content with cooking content creators.
Paint Point
The pain point that I have identified based on the above customer journey are:
- Time-wasting
“Membuang-buang waktu karena harus melihat konten satu persatu”
When users get the search results they want, they are automatically presented with various video recommendations. Users feel confused about which videos to watch and consider it a waste of time if they have to watch all the recommended videos.
2. Unknown Recipe Success
“Tidak tahu resep mana yang sudah berhasil di recook”
With the abundance of recommended videos on TikTok, users are unaware of which videos contain recipes that have been tried and tested by other users. This causes difficulty for users in choosing which videos to watch and which recipes to try. In addition, users are also confused about finding quality and relevant content based on their interests and needs, resulting in wasting time searching for the right content.
3. Duration too short
“Durasi yang terlalu pendek, sehingga dialihkan ke platfoam lain dengan video yang lebih lengkap”
When watching video content on Tiktok, the duration is often too short, causing users to feel unsatisfied with the information provided. As a result, users are often redirected to other platforms that provide longer videos to obtain more detailed and satisfying information.
4. Missing recipe details
“Terkadang terdapat konten yang tidak menampilkan deskripsi bahan, alternatif bahan pengganti, dan takaran bahan”
When searching for recipes on social media platforms such as TikTok, users often come across recipe videos that do not describe the required ingredients, alternative substitutes, and measurements needed for cooking. This can make it difficult for users who want to try the recipe as they do not have enough information to buy the necessary ingredients or know the right amount of each ingredient.
5. There is no video navigation
“Video tidak dibagi menjadi beberapa part dan kesulitan untuk forward dan backward video”
When watching videos on social media platforms like TikTok, users often come across videos that are not divided into several parts. This can make it difficult for users to navigate the video, especially if they want to rewind or fast forward to a specific part. In addition, if users want to re-watch a specific part of the video, they have to start from the beginning. This can be time-consuming and challenging for users who want to learn specific parts of the video. Therefore, a feature is needed that allows videos to be divided into several parts or makes it easier for users to rewind and fast-forward to specific parts.
6. Difficulty finding ingredients
“Mengalami kesulitan menemukan bahan-bahan di tempat berbelanja”
Often, when trying a new recipe, users experience difficulties in finding the required ingredients at the store. Some ingredients may not be available at nearby stores. Additionally, sometimes the information about the required ingredients is not specific enough, which makes users confused about choosing the right type of ingredients.
7. The mixed up/piled up comments.
“Saat ingin bertanya pada pembuat konten tetapi responsnya lambat dan komentar tercampur/tertumpuk serta tidak dapat memberikan rekomendasi konten selanjutnya kepada konten kreator”
When users want to ask content creators on social media platforms like TikTok, they can send comments under the video. However, often the response from the content creator is slow or even nonexistent. In addition, comments from users are often mixed up or piled up, making it difficult for content creators to respond to all comments quickly.
8. Adding timestamps
“Ditengah-tengah pembuatan video konten mengalami kesulitan dalam menerapkan step selanjutnya, sehingga harus kembali melihat video aslinya”
When creating video content, sometimes users experience difficulties in applying the next steps. This can be caused by several reasons, such as unclear or insufficiently detailed instructions, or because some steps require additional explanation. As a result, users have to go back to the original video to make sure they don’t make mistakes.
9. Unable to send messages
“Terkadang tidak bisa mengirimkan pesan bila tidak saling follow”
Users cannot send direct messages to other users unless both are following each other. This can be a problem when users want to send important messages or start a conversation with someone who is not following them.
10. Video Content Classification
“Tidak ada klasifikasi dalam video di profil konten kreator”
When visiting a content creator’s profile on social media platforms, users may sometimes have difficulty navigating and finding specific videos. This can be caused by a lack of classification or grouping of videos on the profile, making it difficult to search for videos based on specific topics or categories. Additionally, if the content creator has a large number of videos, it can make the profile look cluttered and difficult to understand for users who want to learn more about the content creator.
Opportunities
Based on the pain points above, I am trying to create some opportunities to develop the TikTok application in cooking tutorial video content.
Prioritization
After creating opportunities, the next step is to make prioritization. Prioritization is used to determine which opportunities are the most important and urgent for users to obtain, taking into account factors such as high import, high effort, low import, and low effort.
Prioritization high effort high impact:
User Flow
User flow is a graphical representation of the steps taken by users when using a product or service. The user begins by opening the Tiktok application and searching for cooking recipe ideas through the search icon. After finding the desired recipe idea, the user then clicks on the short cooking tutorial video and starts watching. The user then continues watching the longer-duration video through the long video icon. On this page, the user can perform several interactions such as viewing the recipe, asking and giving recommendations to the content creator, saving the content in the desired folder, and even shopping for ingredients through the Tiktok app in case they encounter difficulties in shopping.
Information Architecture
To facilitate navigation and information retrieval for users so that they can find what they are looking for quickly and easily, an information architecture is created.
Wireframe
The first step before creating visual designs is to create an interface design that focuses on the layout, components, and interactions between elements. This interface design is usually referred to as a wireframe, which can be a hand sketch or a digital design created using a design application.
Mockup
The result of the wireframe that has been created will be presented in the form of a visual interface design that will be applied to this application. The depiction of elements such as images, text, and other design elements will function in the context of everyday use.
During the process of creating the mockup, I did not change the existing visual appearance of the application. The icons that were created to meet the needs of users and content creators were designed in a way that aligned with the theme and aesthetics of the existing application.
Mockup 1: From the search results of the recommended videos provided by TikTok, you can choose the most relevant video because there is information that the recipe has been saved and recooked by other users. In addition, you can watch longer videos that are divided into several parts. There are also forward and backward buttons on the video.
Mockup 2: While watching cooking content videos, you can see a clear and easy-to-understand summary of the ingredients and step-by-step instructions for making the recipe. Additionally, you can also get information about alternative ingredients that can be used if a certain ingredient is not available or if you want to substitute it with something healthier or suitable for your dietary preferences.
Mockup 3: If you’re interested in trying the recipe at a later time, you can save the recipe video to a special folder provided by TikTok. By saving the video, you can easily access it again in the future without having to search through thousands of other TikTok videos.
Mockup 4: The comment section is divided into three parts, namely overall comments, recommendations to provide feedback or suggestions to the content creator, and questions to ask for more details about the recipe or the cooking process. The comment section can be a place to interact with the creator or other users who are also interested in the content.
Mockup 5: Users can also easily create recook videos by following step-by-step instructions on a special icon, as they have saved the video previously. With this feature, users can record the cooking process with the same level of detail as in the original video and share their cooking experience with other TikTok users.
Mockup 6: The shopping list feature on TikTok allows users to create a shopping list based on the ingredients listed in the recipe they are currently watching. Users can add or remove ingredients from the shopping list. This shopping list feature makes it easier for users to prepare all the necessary ingredients before starting the cooking process.
Design System
The design system process is carried out before and during the mockup creation so that I can use the material design system that I have created optimally. In this process, I created design guidelines consisting of several design elements such as typography, color, icons, and other design components that will be used consistently throughout the application. This aims to create unity and consistency in the application’s appearance and enhance the user experience. By using the design system, I can speed up the mockup creation process and ensure visual consistency on every design element used.
Prototype
From the results of the mockup creation process so that the design can be tested and evaluated by users, I created a prototype with a flow that makes it easy for users to use this application. In creating the prototype, I used Figma software, which allows for adding interactions such as click buttons, swipes, and some animations to provide a user experience closer to the actual application.
The display in this process is a prototype before conducting usability testing here.
Usability Testing
After creating a prototype, to evaluate how effective, efficient, and satisfying a product or service can be used for users, usability testing is conducted so that the design that I created can be tested and improved. The process of usability testing involves testing the product or service by real users with specific tasks and scenarios to measure usability, performance, and user satisfaction.
I wrote the results of usability testing on a separate page on Medium. You can check the details there :
Lesson Learned
Through the cooking class case study, I learned the importance of designing a user-friendly and intuitive interface for an online learning platform. User testing revealed that participants were most engaged and successful when the interface was simple and easy to navigate, with clear instructions and ample visual aids. Additionally, offering opportunities for social interaction and sharing of cooking experiences further enhanced the user experience and encouraged retention of learned skills. By incorporating these findings into the design of the cooking class platform.
I am waiting for my friends to provide feedback or suggestions. And you can visit my LinkedIn and Dribbble.
Appendix
Process design: https://figmashort.link/DekCtC
Prototype after UT: https://figmashort.link/4mNEiD
