Have you ever thought about creating your own content? Today, people communicate with others by posting their writings, pictures, or videos on various online platforms such as Blog, Instagram, YouTube, etc. Such a method is a form of one-way communication in which only creators can affect users. With T4Framework, however, you can easily create a virtual space where you can exhibit videos and arts, or the whole space may serve as a story-telling complex. Invite people over to your virtual world to let them explore and experience your story! This way, T4Framework supports two-way communication between creators and users.
A framework based on Unreal Engine, T4Framework makes it possible to create 3D content without coding or scripting. The Story Tutorial project that’s introduced below was developed solely with T4Framework and some free assets.
- What is The Story Tutorial? -
The Story Tutorial is a simple content into which people can enter and experience its narrative firsthand. A player can easily control a character to follow the plot of the content and watch the videos that the creator placed in it. Here, we plan to introduce how the Story Tutorial was made with T4Framework.
Please check the Story Tutorial Documents if you want more detailed information.
- The Story Tutorial Playthrough -
[ StoryTutorial Metahuman Ada ver. ]
The Story Tutorial is a story about a woman named Ada, who explores a mysterious cave. In the cave, she meets a robot who has been eagerly looking for something. Eventually, she manages to find what it was looking for, and as a result a TV in the cave displays a video, after which the Story Tutorial ends. Let’s check how each entity (Player, Robot, Box, etc.), narrative, and scene directing were developed with T4Framework.
- The Story Tutorial's Core Elements -
Let us introduce the core elements of the Story Tutorial. It consists of the main character (Player), Robot (NPC), backgrounds (Map), box (Goods), TV (Prop), and Zone. Each of the listed element could be created and set up with the help of T4Framework and some free assets.
1) The Main Character (Player)
This is the protagonist of the Story Tutorial, Ada.
Ada is a character created by utilizing metahuman resources provided by Unreal Engine.
More information about metahumans can be found at the link below.
Reference: Metahuman Creator
This is T4Framework’s Entity Editor. You can create and edit various assets here.
You can set the main character’s appearance via T4CharacterEntity asset.
[ Character Entity Video ]
By utilizing the State Layer feature, some basic animations for the character have been added. You can check the character’s motion in the Viewport at the center of your screen.
2) The Robot (NPC)
This is the robot, another character featured in the Story Tutorial. The robot is classified as a non-player character (NPC) because players cannot control it. It goes by ‘omE’ and features as the main character/player in Gryun’s project.
Reference: Gryun Kim with T4Framework
[ omE Skill Layer Video ]
The Skill Layer feature was used to add various animations that a character may perform based on the situation it’s currently in. In the Story Tutorial, a reactionary animation was added to Robot so it can act accordingly after receiving the box from the protagonist.
3) Backgrounds (Map)
This is “Cave Entrance,” the very first map that a player enters into when playing through the Story Tutorial. It’s a cave with exits on both sides.
Junkyard is the second map of the Story Tutorial. There’s only a single road a player can follow, at the end of which exist a place where various scrap metals can be looted.
The Maps featured in the Story Tutorial were created with the T4MapEntity feature.
4) The Box (Goods)
This is the box that was placed next to the robot.
[ Goods Entity Video ]
The box was created with the T4GoodEntity feature, and its size was adjusted so it’s neither too big nor small compared to the main character.
5) TV (Prop)
This is the TV that Robot turned on after taking the box.
[ Prop Entity Video ]
Using the T4PropEntity feature, you can combine Media Screen and Hull Frame to create a TV prop. In addition, a video clip was set up to be played on the TV screen as Ada the protagonist approaches it.
Although it wasn’t shown in the Story Tutorial playthrough, there were two Zones installed at both entrances to the cave to invoke certain events within the content. A Zone is a kind of Entity that acts as an event trigger. When Ada the protagonist enters a Zone, she gets forced to choose one of the two options shown in a message box, which asks if she’s willing to follow the road or just stay inside the cave to explore it a bit more. You can create Zones in any shape you want via the T4ZoneEntity feature.
As for a Prop, you can specify its corresponding Zone directly in the Entity Editor. In the Story Tutorial, a video clip is set to be played on the TV as the player enters the area.
- The Story Tutorial Project -
All the assets needed for the Story Tutorial have thus been created. Now it’s necessary to properly position these assets within a Map. T4Framework automatically forms databases (DB) of the assets by creating a project and incorporating each asset into it. You can easily develop a story content by adding appropriate assets for each category and dragging them to your desired location in a Map. As the DBs for assets get created automatically as those assets get registered to your project, no additional coding work is required.
The Quest Flows that make up the Story Tutorial are described below.
1) Cave Entrance Settings
In the Content Editor, you can create a project in which to place assets and set up various content-related events to be triggered. When you’re done developing your content, you can export the final version of your project into an executable package.
[ CaveEntrance Setting Video ]
In the Content Editor, the player’s starting locaiton and some quest-triggering Zones’ positions were set up.
2) Junkyard Settings
Placed in the Junkyard Map are objects such as omE, box, and TV.
[ omE and Waypoint Setting Video ]
On top of setting omE’s location, its Waypoints were also set.
The box and TV were placed in the right place also.
- The Story Tutorial Narrative (Quest) -
The Story Tutorial’s narrative consists of Ada entering Cave Entrance and then stumbling upon the robot in the Junkyard area. With the Quest Flow feature of T4Framework, developers could easily set up various aspects of the project such as when characters and items should appear, at what timing dialogues should pop up, and when a video clip should be played. Unlike other game engines that require coding and scripting, in T4Framework one can easily create quests by simply configuring quest nodes that perform desired functions that include, but are not limited to, progressing inter-character conversations, and inducing players to act in certain ways.
What’s described below is a more detailed explanation on the Story Tutorial’s Quest Flow composition.
1) Cave Entrance
Opening (Timelines 00:00~00:07)
This is the Quest Flow that dictates the beginning part of the Story Tutorial. You can see that the quest is composed of various nodes. Nodes have been set up in a way that turns the lights on as Ada the protagonist enters the cave for the first time, right after which the camera shows around the cave that’s lighted up. Afterward, Ada gets forced to make a choice on which way to choose, in the process of which her self-talking dialogue of “I see two different paths ahead. Which one should I choose?” pops up. She was also set up to perform an animation that makes her head alternate between the two different paths.
[ Opening QuestFlow Video ]
Narratives were created with the T4QuestFlow feature. One can simply drag and drop Quest nodes to set up the sequence of narratives and determine what kinds of directing techniques or functions will be added into it.
Left Exit & Right Exit (Timelines 00:11~00:27)
When you arrive at either the left or right paths of the cave, you get to choose whether to follow a path or look around the cave a bit more. If you choose to walk along the path, the quest ends and you move on to Junkyard. If you instead choose the option to look around the cave, the quest will be aborted.
By using the Branch function, you can make your quest lead to different results based on a player’s choice. With Quest Flow, you can set up what dialogues should pop up or what intermission scenes should be displayed for each possible path a player can may when progressing through a quest.
Encountering the robot (Timelines 00:30~01:05)
Ada selects one of the paths on either side of the cave, walking along which she eventually reaches the Junkyard area. Here Ada stumbles upon a robot(omE) who’s looking for a missing box. After she hands the box to the robot, it moves to the front of the TV with the box in its hands.
This Quest was configured to proceed to the next step only when the player owns the required item. The HasItems node checks whether the player has the item and, if he does, the flow of the quest will proceed to the subsequent Interaction node. As soon as Robot retrieves the box that Ada found, a dialogue will take place.
An Action node was configured so as to make omE move to its destination when it receives the box. In order to emphasize its movement, the player becomes immobile during the transitory scene, and the camera was set to track omE’s walking path.
The Ending (Timelines 01:11~01:17)
Once omE reaches its destination, Ada sets about following the robot. As she approaches the TV in front of the robot, a video clip gets played on the TV screen and that same video (the ending clip) will be enlarged to take up your whole monitor screen and be played until its end.
- Story Tutorial Direction -
This section introduces the directing techniques and visual effects used in the Story Tutorial. The visual effect that made the box–which Robot was looking for–shine was made with T4’s Action Pack feature. Likewise, the camerawork that showed the left and right side of the Cave Entrance and tracked the robot’s movement as it walked towards the TV could be achieved with T4’s Camera Walk feature. Lastly, T4’s UI feature was used to implement the effect of the video clip on TV getting bigger to eventually take up the entire monitor screen as the content ends.
The description below addresses how T4’s directing tools (Action Pack, Camera Walk, and End Direction (UI)) can be utilized in your project.
1) Action Pack
This is the box that was placed in Junkyard. An Action Pack was added to it to make it glow.
[ Action Pack Video ]
This glowing Action was added to the box to make it easier for a player to find the box, which is placed next to omE. With T4Framework’s Action Pack, you can easily produce such visual effects.
2) Camera Walk
A camera can be made to track a character’s movement, which in our case happened to be omE the robot. The mannequin at the center is marking omE’s current position. You can preview how it will actually look within a scene in the viewport at the bottom-left corner of the screen; the camera will move along the white line.
[ Camera Walk Setting Video ]
You can add a Camera in the Content Editor to set up your desired Camera Walk.