Pinkfong’s Baby Shark: Teaching children to wash their hands

How do you spread public health awareness among children during a global pandemic? It’s easy when you have an irresistible song and an agile content creation pipeline. Find out how Pinkfong uses Unity.

With more than 7 billion views, “Baby Shark,” a catchy children’s song recorded by SmartStudy, the company behind the global preschool brand Pinkfong, is the most-watched video on YouTube. Pinkfong consistently sparks innovation in content creation, and Unity has played a supporting role. Pinkfong has been developing apps with Unity since 2018, releasing apps of high quality to the market in remarkable timeframes. We recently spoke with the Motion Capture Team and the Interactive Team of Pinkfong – they all call each other by nicknames to foster better communication at work and keep the corporate culture more agile. We talked about their content creation pipeline and how Unity helps them meet their goals.

The Motion Capture Team at Pinkfong uses motion capture data to create 3D content. Their research informs their projects, and Fong Fong Club, an animated children’s “radio show,” demonstrates the latest developments. Check out the team’s session on using Unity to establish a video content creation pipeline at Unity’s Industry Summit 2019 in South Korea.  Previously the team explored using Unity for creating 2D content, which led to the adoption of a new 2D creation model that was also used for Fong Fong Club.

The team used Live2D animation software (usually used for games) to create animation clips. These were imported into Unity and put together in the Editor by using common backgrounds (like a studio), overlapping clips with Timeline and Cinemachine, using set motions to make the camera move naturally, and taking advantage of other Unity features. Essentially the team devised a new process whereby anyone could assemble internal video resources and create new content – you don’t need to be a professional animator or video creator. 

According to Pinkfong Technical Artist Wasang, their content planners were able to create a 13-minute video in two days, in large part because the planners could directly materialize their ideas. In other words, productivity and work efficiency were enhanced by reducing the need for communication.

Having produced a serviceable Fong Fong Club video in such a short time, the team clearly sees the value and efficiency in using Unity in 2D content creation. 

Unity also helped Pinkfong take quick action in response to changes in the world. For example, they created hand-washing songs as part of COVID-19 pandemic public health awareness in only two days – from filming the choreography to creating the video. As the process didn’t require any data to be sent externally and minimized the rendering time and cost, they were able to finish it internally with a small team. In the past, this kind of work would have required some parts to be outsourced.

The Motion Capture Team also produces videos featuringPinkfong, the pink fox, visiting various tourist spots in South Korea. The idea is for the character to tour locations that physically exist, which means that the job requires adding a 3D character to live action footage.

The main difference between creating 2D and 3D video  is that 3D requires motion capture. As the vlog project required adding elements to live action footage, the team needed to consider many additional details. For example, the team needed to establish the height of the animated Pinkfong character relative to real-life objects and come up with a script before proceeding to the motion capture stage. During this step, they visualized the data in real-time to confirm the motions were captured accurately before sending the motions to the animators. The animators used the facial expressions and spoken lines of the actor filmed by the planners as the base for the character and fleshed them out to create an animated clip. That clip was transferred to Unity, where 3D artists worked on rendering. Thanks to the real-time rendering feature of Unity, the team could see the results right away and the entire process was done very quickly.

The Motion Capture Team emphasized the fast rendering speed of Unity as a major strength of the Unity engine that helped them create their vlog content. In video creation, rendering takes up a lot of time. Unity’s fast real-time visualization enabled a smooth exchange of feedback, significantly reducing production time for this type of content, where adding elements to a live action footage typically requires a lot of editing.

Pinkfong’s content has a strong presence in the app market. The Baby Shark Storybook app and Wash Your Hands app have been featured on the Today page and Featured Apps of the App Store numerous times. The Interactive Team at Pinkfong take quick notice of the trends in the app market and reflect them in the apps they create. It is particularly noteworthy that the Wash Your Hands app took only two weeks to launch – using Unity to plan, design, and develop it.

Interactive apps require the users to proactively engage with digital content by tapping and dragging, resulting inconstant communication between the users and the apps. The Pinkfong interactive app series contain educational materials such as Hangul, mathematics, and English, while also covering favorite children’s topics such as dinosaurs and cars. They are fun and are enjoyed by children all over the world, along with their parents.

The Interactive Team wanted to create diverse activities using the existing Baby Shark Storybook as source material, and Unity was a major help in realizing this goal. By using Unity, the team was able to minimize the human resources needed to create content, simplify the overall process, and significantly reduce the time it took to finish a working product.

When creating a 2D interactive app, the direction and resources are determined at the planning stage. Model resources for animation are created during the design stage and rigged during the animation stage, and the created animation clips are saved as Unity Prefab and Unity Animation files. In the final development stage, the models created in the animation stage, effects, and soundbites are added to the project, where the result will be very close to the end product. Up to the animation stage, the development process for interactive apps is similar to that for 2D video creation, but the processes diverge at the  development stage. For 3D, interactive elements are added so that the project can respond differently based on the user’s input.

Skeletal animation is a technique that adds bones to a Prefab to animate a mesh, efficiently creating a range of motions. For example, the Baby Shark Storybook features sharks as the main characters against an ocean backdrop. The Interactive Team was able to make the movement of the sharks’ fins and the swaying of seaweed in the water look natural by using Skeletal Animation.

Using the Skeletal Animation also helped keep the app small. Before Unity, the team used keyframes to move the joints or cell animation with separate images capturing the seaweed in different positions – resulting in sizable apps. However, the use of skeletons in Prefabs slimmed the app down significantly. Pinkfong Developer Kuma also notes the cost effectiveness of skeletal animation.

The Interactive Team values app optimization as they want children in countries where cellular data plans are costly to be able to access various apps and have fun with them. Their hope is to offer options to experience quality content in different ways by reusing and reshaping the source material, just like they gave the Baby Shark Storybook a new life with their interactive app.

Using Unity also makes it possible for this educational brand to create content in quick response to social needs, as evidenced by the hand-washing song and app developed to help children prevent the spread of the 2019 novel coronavirus.

Pinkfong are keen testers of Unity’s experimental features. They push the technology to be able to innovate in their projects and deliver content more efficiently. They continue to work on expanding the processes they’ve established in individual projects to various platforms so that they can reach more users. May they keep up with good work of creating unique content and touching the lives of users around the world.

Find out more about using Unity for your animation pipeline and learn how to create your own animation using the through Unity 2D Animation Package.