Embedded Files
It has been 25 years since the release of Devil Summoner: Soul Hackers (1997). The long-awaited new title Soul Hackers 2 has now been released. The story of how a completely new world and new characters were created, while maintaining the worldview of the first game, will be unraveled.
*This article is a reformatted version of an article that appeared in CGWORLD Issue 290 (October 2022)
Atlas
Top row, from left:
Producer & Director, Chief Designer : Mr. Eiji Ishida
Technical Artist, Lead Motion Designer, Lead Modeling Designer: Mr. Taku Yasumoto
Lead Field Designer: Mr. Takayoshi Kawase
Bottom row, from left:
Lead Battle Designer: Mr. Masakazu Dohi
Extra Demo Designer: Mr. Ryo Yamada
Interface Designer: Ms. Tomonori Terada
Modeling Designer: Mr. Yu Sugisawa
The World of "Devil Summoner" Reborn After 25 Years
The World of "Devil Summoner" Reborn After 25 Years
In this title, Ringo and Figue, agents of "Aion," an existence beyond human knowledge, work together with "Devil Summoners" to avert the end of the world. In the past few years, there have been many requests for a sequel to Devil Summoner: Soul Hackers through user surveys, which led to the development of this new title.
We felt it was most important to develop a game that would appeal to new users as well as those who have played the previous title," said Mr. Kurokawa.
"We wanted to create a new game while maintaining the technology, occult elements, urban worldview, and other key elements of the original version," said Eiji Ishida, who oversaw the development of the game.
One of the attempts to create a new "Soul Hackers" was to renew the character design, and this time the character design was done by Shiro Miwa, a manga artist and illustrator known for his "Dogs, Bullets & Carnage" and other works.
This work basically consists of three layers: the "human world," the "Devil Summoner world," and the protagonists' "Aion world," and follows the stylish urban life and hard-boiled worldview of the previous work. Many of the scenes have the characters strongly in the foreground, and the artwork is created with the characters in mind," said Ishida.
This work targets high-spec consumer consoles, including the PS5 generation, and Unity is being used, which is unusual for a development of this scale. In addition, the company has developed and uses a variety of in-house editors and tools. Let's take a look at the details in the next section.
Point 01: Character Models Faithfully Reproduce the Designs
Point 01: Character Models Faithfully Reproduce the Designs
The key point of this work was how to faithfully reproduce the characters designed by Shiro Miwa as 3D models.
Reproduce illustrations from three points of view: "silhouette," "touch," and "paint
In creating the character models, the first focus was on faithfully reproducing the designs drawn by Shiro Miwa as 3DCG characters. According to modeling designer Yu Sugisawa, in order to faithfully reproduce Mr. Miwa's illustrations, emphasis was placed on three points: silhouette, touch, and paint.
The silhouette was reproduced through modeling and motion, while textures were hand-drawn using Substance 3D Painter to reproduce the touch of the illustration. For the painting, shaders and materials were developed so that the appearance in Unity would be close to that of the illustration.
A drawing of the Ringo character created by Mr. Miwa. Detailed instructions are also included for notes on modeling, texture, and coloring.
Another character setting drawing, depicting details such as gloves, shoes, and posing.
The character models are basically created in Maya.
The image is a shaded Ringo model.
Wireframe display
Albedo map only displayed in Maya
Displayed on the actual device with all shaders and materials applied
Texture composition
To reproduce the touch of the illustration, the texture is first drawn in Substance 3D Painter as if to get a rough bite, and then the texture is output and brushed up by drawing in details in Photoshop. The image shows an example of a Ringo texture.
Albedo map
Shading map (R)
Specular (RGB) and rim light mask (A) map
Map for jacket flashing effects (RG)
Normal map of the same jacket
Outline drawing with vertex color
The characters in this work have outlines with varying line widths. The strength of the outlines is controlled by the vertex color, and an in-house vertex color adjustment tool was used.
The model's vertex color is displayed. The closer the color is to black, the weaker the outline is.
The outline is displayed on the actual machine. The outline reproduces the expression of lines in and out of the illustration.
Maya's Vertex Color Adjustment tool
Comparison of outlines. On the left is the state in which the strength of the outline is adjusted with the vertex color. The model on the right is without adjustment.
Shaders built based on the designer's tentative assembly
Since Atlus allows designers to use Unity, they created temporary shaders for the look they wanted to achieve, and exchanged opinions with the programmers on whether or not they could implement the look.
Shader tentatively assembled by designer
Designer tentatively assembles shaders, applies them to the temporary model, and adjusts the look in consultation with the programmer to make it ready for implementation.
Below is an example of shaders implemented by a programmer.
With albedo and shading on
Albedo and shading on top with more noise on top
Highlighted state. As highlights are applied, the look gradually becomes more expressive.
The shaded areas are covered with a solid black background to bring the illustration closer to the taste of Miwa's illustrations.
With rim light on top of it. Controlled by the alpha channel of the specular map.
Adding more expression by placing rim light edges on it.
Noise is not applied uniformly, but is adjusted for a less noisy appearance by using three blend modes to change the way noise is applied to highlights, shadows, and solid blacks.
Reproduction of characteristic touches
To reproduce the characteristic speckled watermark touch in Miwa's illustrations, additional specifications have been added to the shaders.
To reproduce hand-drawn touches, the artist uses Substance 3D Painter to draw wrinkles in clothing and other details with a touch similar to that of the illustration.
On the left is the actual device display, and on the right is a bust-up illustration from the game (drawn by Mai Yoneyama). The touch of the illustration has been reproduced.
Familiar demons also have their own look in this work
The same touch is also applied to the demon characters. Since the same demon characters appear in the company's "Shin Megami Tensei" series and "Persona" series, the model data is used, but the shaders give the demons a look unique to this work.
Anzu in Shin Megami Tensei V
Anzu in Soul Hackers 2 with a touch of linework and speckled tone
Special material representation
In addition, shader control maps and UV sets allow for a variety of effects.
Glittering Ringo jacket
Ringo in the Soul Matrix
Effect when a demon is damaged
Point 02: Motion Production With a Touch of Elegance
Point 02: Motion Production With a Touch of Elegance
The motion of the characters, which has been adjusted to an illustration style, is said to have been reproduced after careful study of Shiro Miwa's manga works. We will explore how the kaleidoscopic motions were created.
Rig setup with in-house developed system
Character models in this work, whether they're player characters, NPCs, or demons, are set up using a module-based rig system developed in-house. The rigs are linked to pickers and other tools necessary for animation work to facilitate smooth motion production.
Examples of Ringo setups. From left to right: model, joint configuration, and rig condition.
Operation screen of AT Rig Tools, a rig production tool developed in-house
Setup rigs are linked to the "Rig Selection Tool" for efficient rig selection and operation
Facial work
The facial animations of the characters are all deformed by joints, without using blendshapes. Since the face model is adjusted for normals, the facial animation had to be controlled only by moving the joints. Therefore, a dedicated facial module was created on the rig side and applied to the character in order to streamline the operation.
Example of an apple facial rig. It is possible to create rich facial expressions just by moving the joints.
2D illustrations displayed in the game's conversation windows (left) are used as a reference to create facial expressions (right).
Mouth movements are expressed by lip-sync. Two basic shapes are provided for each of the six sounds: "A," "I," "U," "E," "O," and "N". The left one is the normal size and the right one is the large size. The left one is the regular size and the right one is the large size. They are used for different purposes, such as events and battles.
Motion with an emphasis on silhouettes
The motions were created with an eye toward creating a sharp pose that takes advantage of Mr. Miwa's character designs. All of the in-game motions were created by hand, and the poses were thoroughly researched by carefully reading Miwa's manga works.
Taku Yasumoto, who served as lead motion designer, says, "Even poses that would normally look exaggerated or strange are deliberately added during battles."
It is not only humanoid characters that are designed with posing in mind, but demon characters are also motioned in such a way that their poses have an air of sensuality, such as during battles. Some demon characters have a unique technique called "Sabbath," which is designed to bring out the charm of demons.
Cerberus during Sabbath
Nekomata during Sabbath
Setting up swaying objects
The movement of swaying objects, such as the humanoid character's skirt and hair, was created using in-house spring-based tools, as shown in the image, instead of using physics simulation. However, in cases where the tools would look strange, they are intentionally hand-tooled.
The reason for avoiding physical simulation as much as possible is that "we did not want to express the movement of realistic objects, but rather we wanted the objects to sway slightly while maintaining their shape, and we felt that if the objects moved realistically, the movement of the swaying objects would be exaggerated and the viewer would not pay attention to the character's performance even though he was acting. We also felt that if the movements were too realistic, they would stand out too much and people would not pay attention to the performance of the characters themselves, so we chose to control the movements ourselves as much as possible.
The movement of swaying objects is created using in-house spring-based tools, rather than using physics simulation.
Point 03: Map Production to Match the Anime Aesthetic
Point 03: Map Production to Match the Anime Aesthetic
The maps in this work are designed with a look in the style of anime background art to match the look of the characters. How were the maps created to fit in with the characters?
Field design to convey a variety of night-time scenes
In this work, as in the previous one, the urban night is often the setting. Therefore, even within the same night, each field is designed to have its own character.
The Karakucho area, built in Unity. Since Kabukicho was used as the model, we were conscious of the atmosphere of the downtown area at night, such as the silhouettes of the buildings and the impression of the lighting on the billboards.
The Shinsando area
The Mansei Realm
The process of creating the fields began with the creation of an image board, which was then used as the basis for detailed floor plans, image supplements, and event generation points, which were upgraded through meetings. Once the overall image board was created, detailed design drawings of the buildings and stores that make up the stage were created, modeled in Maya based on the design drawings, and finally the stage was created by applying materials in Unity.
Pizzeria design drawing
Modeling in Maya based on design drawings
Temporarily-applied material in Maya
Finished model displayed with other assets in Unity
Model of Karakucho area created in Maya
Karakucho area displayed in Unity
Background material
The programmers were asked to prepare the basic materials for the stages, and from there, the necessary functions were added as needed to express the stages in this work. Some of the more notable additions include material blending, texture occlusion for shading, and mesh edges.
Examples of material blending and staining used in the dungeon. Since multiple UVs can be used, different textures with different atmospheres are combined on different UVs as stains, and adjustments are made so that they do not look alike as much as possible.
For the first time in this work, a thick outline is drawn on the background, giving the 3D model a painterly atmosphere
In this work, there are not only cities but also sea dungeons. The clear use of normal maps and speculars is well represented by the cartoon-like backgrounds.
The circus curtain has rim lights applied to the edges, with rim light edges in the center to represent light. This configuration is said to create a crisp, animated look.
Lighting for a glittering effect
The stage lighting is basically expressed using bake lights, but real-time lights are also used.
The upper right image shows the state of the lights placed on the stage. The lower center image shows the state of the baked lights, but not all the lights actually placed on the stage are baked.
Since real-time lights show specular and normal lights, real-time lights of as large a size as possible are placed to light a wide area, and areas where strong light is desired are expressed with bakes.
Point 04: Effects with a hand-drawn feel
Point 04: Effects with a hand-drawn feel
The effects are stylized expressions that match the look of the characters and maps. Various production techniques for effects will be introduced.
Effects production using SPARK GEAR
Effects in this work can be divided into the following categories: battle effects, map effects such as rain and water flow, event-related embedded effects, character-related effects, and other filter-like effects.
These effects are created by the Effects Team based on the shared requirements and images from the Character and Map Teams. Photoshop is used for texture creation, and Maya is used when models are required. SPARK GEAR is used to create the final effect by combining the models and textures.
Effects work screen in SPARK GEAR
Effects built with SPARK GEAR and played back on the actual device
Appearance and disappearance effects
The effects generated by the appearance and disappearance of characters are also a highlight. The appearance and disappearance of characters are expressed by applying dissolves to the material applied to the characters.
Screenshot of the dissolve setting for a character in Unity
Grayscale triangular pattern texture
This pleasing transition is expressed by displaying the texture on the left at the border between the visible and invisible states of the character. This triangular pattern is a key image in the overall worldview of this work, and is used in various places, including the apple jacket and UI.
Character appearance effects in the game
Expression with the style of the illustrations in mind
Since the look of the characters and stages in this work is anime-like, the look of the effects was also adapted to match the anime style, and efforts were made to create illustrative effects while also incorporating digital elements such as the Soul Matrix space.
Example of explosion effect with flames. The look is not realistic smoke and flames, but more like an illustration with a lowered tonality.
Example of explosion effects. Vivid colors and outlines on the shockwave outlines create a look similar to that of comic book effects.
Example of a particle effect drifting in a Soul Matrix. Even these environmental effects are all expressed by creating hand-drawn patterns.
Example of effects used in a game. The effects are applied to the cartoon-like characters and backgrounds without any sense of discomfort, making it look like a scene from a comic book.
For effects such as smoke that cannot be expressed by 2D effects, the middle portion of the effect is modeled and drawn as a sequential number, as shown in the image.
Example of muzzle flash effect. Instead of a realistic, detailed split frame, the frames are removed to create a crisp, cartoon-like movement.
Point 05: Demonstration Scene Production Made More Efficient By In-house Tools
Point 05: Demonstration Scene Production Made More Efficient By In-house Tools
Of the three types of demos, the production of the extra demo, in which visual effects can be seen throughout, will be introduced.
Extra Demo Production Flow
Demo movies played during gameplay are divided into three categories: "Extra Demo," "A Demo," and "C Demo," with this section focusing on the "Extra Demo".
The workflow for demo production is similar to the general video production procedure, starting with the creation of storyboards and scenarios, followed by the creation of text labels that summarize tographs and dialogues, and then the preparation of materials that subdivide character movements and other details. Based on these storyboards and text materials, a pre-visualization using 3DCG is created, and the necessary elements, such as effects, are finalized at this stage.
After the pre-visualization, layout and blocking, motion, facial, and swaying elements, FBX output, integration into Unity, effects, lighting, and post-effects are all created in this order until completion.
We wanted to create a visual expression in this work, so we used physics simulation in some parts, but we created the animation by hand as much as possible. For facials, we modified the face models and adjusted the lighting for each cut," said Ryo Yamada, extra demo designer.
Maya screen during layout work
Facial adjustment in the demo movie. In order to make the black line of the nose clearly visible, the nose is moved slightly in the direction of the imaginary line even when the face is facing forward. The eyes also vary greatly depending on the angle of the face, so the artist has made considerable adjustments.
Examples of effects. Effects created in SPARK GEAR are tied to the Unity timeline and synthesized.
Lighting Example. Additional lighting if, for example, the original ingame scene lights don't reach the characters.
An example of post-effects. The weather and airiness of the scene were added by post-effects. The artist aimed to create a rich image with visual color grading in mind. Left: without post-effects, right: with post-effects
An example of post-effects. The weather and airiness of the scene were added by post-effects. The artist aimed to create a rich image with visual color grading in mind. Left: without post-effects, right: with post-effects.
Dedicated Demo Tools
In demonstration production, tools are being developed and utilized to increase efficiency and avoid human error.
ExtraDemoHelper, a dedicated extra demo tool that includes features such as batch loading and management when implementing assets from Maya to Unity, and the ability to instantly call up the necessary demo cuts.
Unity also has a management tool dedicated to this kind of extra demo. The tool handles tasks such as batch placement and batch loading, which are labor-intensive and have little impact on the design, so that as much time as possible can be spent on graphics and other tasks.
Since it is inefficient if the directory structure changes from worker to worker or if the data is organized in different ways, a tool has been developed to perform grouping and directorying almost automatically after batch placement. This tool creates a timeline with the same hierarchical structure no matter who touches it, so that workers can work without hesitation even if they change.
Point 06: Stylish UI That Serves As the Entrance to the Game World
Point 06: Stylish UI That Serves As the Entrance to the Game World
The UI is another important element that draws players into the story. This section will explain the concept behind the design of this work's distinctive UI.
UI concept and production flow
The UI design concept of this work uses aligned triangles as the key image, since the main character is not a human but an electronic life form.
The design has a simple, geometric image rather than a graphical UI, and the key image is especially distinctive in the camp and battle screens, where Ringo's thoughts are the main focus. Conversely, in the facility screens, the design was intended to have a lot of play with angles and misalignments.
UI rule-sharing materials. Rough image of camp screen on the left and facility screen on the right.
Part of the UI design document for the camp screen. Designers organize the necessary elements for the screen that came from the planner and temporarily place them on the screen while roughly exploring the direction of the design.
Create the image by placing icons and other objects on the background image.
UI parts for the camp screen. In addition to the screen layout, icons and other designs will also be considered. Various designs were considered based on triangles.
Completed camp screen
Efficiency with Unity
An example of the Gyomadono screen, where the UI is basically based on data created by the designer in Photoshop, etc., textures for the actual device are created and placed in Unity, and the data is then implemented by the programmer.
The designer specifies the motion of each part as well as the layout using Unity's functions. In the past, programmers implemented the data based on the specifications created by the designer, but by having the designers work directly with Unity, they were able to greatly improve efficiency.
Screen layout of Goumaden arranged in Unity.
Completion screen
Localization support
Localization of games is usually done on a separate schedule after the release of the Japanese version, but since this game was released simultaneously worldwide, localization was done in parallel with the development of the Japanese version.
For that reason, we iconized items that can be iconized without using characters as much as possible, and UI parts that contain characters are designed with a size that takes into consideration multiple languages.
Since nine languages, including Japanese, are supported, the layout was switched to a language-specific layout in cases where the common layout could not accommodate a particular language.
UI elements for the English version
UI elements for the German version
TEXT＿大河原浩一 / Koichi Okawara（ビットプランクス）
EDIT＿小村仁美 / Hitomi Komura（CGWORLD）
English language version edited and formatted by Ishaan Sahdev.
Page updated
Google Sites
Report abuse