BanG Dream! Girls Band Party’s “User First” Development Keynotes — Enriching User Experience with Live2D

rinkoyukina.png

The next-generation all-girl band project BanG Dream! (Bandori) has expanded into a lot of different media including anime, manga, and live shows featuring its voice actresses since its launch. The BanG Dream! Girls Band Party (Garupa) mobile rhythm game is one of them, being released in iOS and Android in March 2017 and having since taken the industry by storm while also providing a great deal of support for the project.

195821.jpg

Garupa’s application of Live2D helps eloquently depict the characters’ behaviors and actions, greatly augmenting their dramatic developments in the story. Live2D is an innovative software which combines three-dimensional movements with the attractiveness of two-dimensional illustrations. In this presentation held during the “alive 2018” creator event, we learn about the know-hows of Garupa’s Live2D creation using “Live2D Cubism” with Junko Inoue, the leader of Craft Egg’s character production team, and Keisuke Takahashi, one of Craft Egg’s Live2D animators.


195822.jpg

195823.jpg

Craft Egg as a company emphasizes the concept of “user first“. This is reflected in the development process which avoids having too much of a bias towards the creators and upholding a certain level of standard when deciding whether a decision benefits the user or not.

195824

195825.jpg

As part of the “user first” philosophy, it’s important to make the game as user-friendly as possible by adding certain effects which can greatly impact the user experience, rather than focusing on the aspect of realism by correcting pixel errors of minuscule scale. It’s very important to not only have a certain amount of attention to details, but also to know which aspect to focus on when it comes to developing with the “user first” concept in mind.

195826.jpg

The presentation continued by showing character production examples from Garupa. In the adventure part of this game, The depiction of rich facial expressions and character actions play a major part in entertaining the users.

195827.jpg

Certain directions are particularly being focused on in order to make the characters look appealing. In the “Hello Happy Adventure! ~Smiling Sleeping Treasure Island~” (“ハロハピ大冒険!〜笑顔の眠る宝島〜”) event, for example, the surprised expressions and reactions of the characters are exaggerated to highlight their cuteness. On the other hand, while adding environmental sounds like the swaying of trees or chirping of birds in the forest scene could make it more immersive, the decision wouldn’t be directly linked with the goal of highlighting the characters’ appeal, so it takes lower priority. Due to the limited resources, focusing the implementation of those resources to better the user experience is also another aspect of “user first”.

195828.jpg

195829.jpg

In order to properly display a character’s desperation in a certain scene, implementing sound effects while moving the character model downward to simulate the situation of “falling down the rabbit hole” is among one of the ways to enhance the user experience by adding special effects on top of Live2D.

195830.jpg

195831.jpg

In the scene where the characters are taking photos in a purikura photo booth, the character’s writings were added gradually on the photo to help establish the liveliness of the event. This was done to provide the users with a touching experience of the characters’ everyday life.

195832.jpg

In the next section exploring the application of Live2D, the usage of manga-like expressions are introduced, such as adding pop-up sound effects like “Don!” and displaying larger character models than usual. The presentation also elaborated on the combination of these expressions with a battle-esque BGM and cut-in effects unusual for Garupa.

195833.jpg

Craft Egg’s creative process in developing Live2D character models was also explored. One of them was the implementation of “motion-independent loop processing“, in which a loop formed by connecting two parameters was used to create a character hat with blinking lights. However, since the blinking loop was linked with the character motion, the light would only blink whenever the character motion is running.

195834.jpg

This leads to another part of the character model which should remain in motion even when the character isn’t moving: “breathing”. By applying the same concept from the breathing animation, it’s possible to run the blinking animation independent of the character motion. However, this method wasn’t actually viable to create a continuous one-directional motion, so the team would need to create a completely new parameter. In that case though, the loop processing would require a huge amount of resources.

195835.jpg

For that reason, they decided to go back to square one and focus not on the blinking animation, but on polishing the looks of the characters wearing the outfit while greatly compressing the loop processing. This kind of decision making ties into the “user first” philosophy.

195836.jpg

When it comes to emphasizing “user first” in character models, Craft Egg explained their approach on handling lighting, which is directly linked to the character expressions. They also elaborated on the matter of depicting two characters physically touching each other, which couldn’t be resolved simply by bringing the characters closer. This led to them creating a completely separate model of “two characters touching each other”, all for achieving the desirable effect of being able to convey their appeal to the users.

195837.jpg

195838.jpg

Another important detail is that every single parameter for both characters’ faces was recreated from scratch. The whole process was done manually and took several days to complete. At the time of production, Craft Egg used the “Live2D Cubism 2.1” software, but it’s now possible to perform simultaneous changes of numerical values via multi-key editing in the new “Live2D Cubism 3”, which is commonly used nowadays. This shows just how much the direct input from creators in the field contribute to the software development.

195839.jpg

There was another problem in animating “two characters touching each other”, which is the simultaneous opening and closing animation of the eyes and mouths. In order to solve this problem, the team prepared two types of motion models for each character, switching the models depending on which character is talking.

195840
The users’ responses and feedback is the greatest motivation for Craft Egg to create life-enriching contents.

While noting how it took a considerable amount of time for them to reach this solution, it was the following words which resounded in the audience’s hearts: “Our endeavor was positively received by the users, so I think it was all worth the effort.” It’s definitely an appropriate display of how a company who sincerely faces its users head-on is rewarded by the users for their hard work.

One of the reasons behind Garupa’s massive popularity may not have been mere technological advancements, but their “user first” approach. With the game going beyond its second anniversary, it’s exciting to see their next breakthrough this year.

195841.jpg

If you enjoy this content, consider supporting me and suggesting new contents to cover here.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s