top of page

Tomebound

Group Project 2

Tomebound_Temple.jpg

​Introduction

Client: Rob Blofield / RaRa Games, an indie game studio

Project: "Tomebound," an adventure puzzle game

Operational Context 

In developing this game, the client's objective is to deliver an engaging and entertaining experience to the audience, fostering moments of amusement during casual gameplay sessions with family. The client wanted the game to be charming, aiming to make players smile while playing. The target demographic comprises gamers who appreciate lateral thinking, problem-solving challenges, and dungeon exploration, specifically focusing on individuals aged 25-40. Once finshed, It will be released on Nintendo eShop and Steam Store, with a planned retail price of £11.99.

FirstScene.png

Overview

Completion of the Axolotl: Continuation from the First Semester

In the previous semester, I undertook the modelling of an axolotl which is an enemy character designed to impede players' progress. Although I completed the texturing in the first semester, I found the resulting texture unsatisfactory; Consequently, during the current semester, I embarked on revising the texture, alongside completing rigging and skinning tasks. Furthermore, I expanded my skills by animating the axolotl in three key actions: walking, turning, and surprising. This project was my first time learning about rigging, skinning, and animation, which greatly improved my understanding of the game development and 3d modelling process.

Opening Cinematics

A task given to the students was to create the opening cinematic that would play when players started the game. This was to showcase the journey of the player-controlled wizards as they climbed the tower, faced various enemies, and used their special abilities like portals and reanimation powers. The cinematic consisted of four scenes, and I contributed to the fourth scene. Through collaboration with my team members Mariia Honcharenko (Game Design) and Seth Bown (3D Environment), we completed the blocking-out animation.

Axolotl

Texture

[ UV Unwrap ]

Old model of the Axolot

Firstly, to refine my axolotl model, I began by re-texturing it. In the first semester, I aimed to minimise the visibility of the seams around its legs and under the chin. However, they remained noticeable in the outcome, distorting the appearance of the axolotl. Therefore, to start re-texturing, I focused on addressing the visible seams, as indicated by the arrow in the image above. Consequently, I commenced by re-marking the seams in Blender.

UV_old.png
UV_new.png

Old

New

Initially, I believed that any UV layout was acceptable as long as the UVs did not overlap, which resulted in significant variation in UV sizes and considerable unused space on the UV map (image on the upper left.) To improve the UV layout, I referenced some tutorials, adjusted the UV sizes, and divided them into smaller sections. Consequently, the UV sizes were unified, resulting in reduced visibility of the seams (image on the upper right.)

[ Design ]

IMG_4494 2023-12-20 12_47_27.jpg
Axolotl07.png
OldmodelofAxolotl.png

Secondly, because the texture design was not satisfactory, I decided to identify areas for improvement and engaged in critical analysis. The images above depict the initial concept art for the axolotl (left), along with my first (upper right) and second attempts (lower right) at creating textures.

The identified points are

  • Excessively dark colour.

  • Not much of a cartoonish quality.

  • The scars scattered across its body appear too minuscule and obscure.

Taking these critical points into consideration, I started gathering reference images for redesigning (images below).  Since it is an enemy inhabiting an old temple, I aimed to infuse its appearance with mysterious elements while maintaining a cartoonish cuteness. Additionally, considering its size in the game setting and the need for patterns to be easily discernible, I aimed to create a design that is simple yet impression.

During the making process, I also collected feedback from colleagues and the client. Based on this feedback, I revised the shape of the pupillary from circular to sharp ellipses, aiming to give the audience the impression of reptilian characteristics.

[ Finalised Texture ]

Below is the animation showcasing the finalised texture for the axolotl.

Rigging & Skinning

[ Riggnig ]

Next, I commenced rigging the 3D model. Since it was my first attempt at rigging, comprehensively understanding the process presented a significant challenge. I began by familiarising myself with armature mechanisms, including the relationship between parent and child bones, the naming practice required for mirroring each bone, as well as concepts such as IK (Inverse Kinematics) and FK (Forward Kinematics). After learning about these concepts, I created the axolotl's armature by utilising the default cat armature (images below).

Consequently, I reconstructed it, drawing inspiration from the skeletal structures of axolotls and lizards (images on the left below), to ensure a straight and orderly structure, thus avoiding any issues in subsequent processes (image on the right below).

Cool.jpeg
Axolotl skeleton_ Something interesting about this image is that the gill filaments have s

To control the movements of the legs, tail, and head, I applied bone constraints, taking inspiration from the knee bone structures observed in human 3D models and tail bones observed in horses. Concerning the head, I aimed to limit its movements to prevent it from rotating too far back, which could cause mesh collapse.

スクリーンショット 2024-05-05 194207.png
スクリーンショット 2024-05-05 194421.png

After completing the rigging process, I proceeded with the skinning process. Utilising the armature modifier, I set up armature deform with automatic weighting. While automatic weighting initially assigned weights to each bone, I manually adjusted them by entering weight painting mode.

WeightPainting.png

[ Skinning ]

INtroduction to Cascadeur

One of the biggest challenges in this project was familiarising myself with the application called ‘Cascadeur’, which significantly aids in keyframe animation and efficiency as recommended by the client. Due to my lack of experience in animation, I learned the fundamentals, including the mechanisms of keyframes and frame rates.

autoposing.png

Rigging

スクリーンショット 2024-05-05 214755.png

One notable feature of this software is its 'quick rigging pose' capability, which automatically assigns rigs by importing an FBX file and filling in the required fields to identify each body part. By utilising this feature, I was able to add rigs quickly.

スクリーンショット 2024-05-10 231843_edited.jpg

After adding bones to the model, I manually adjusted them, including modifications to physics settings such as size and mass (as shown in the image above). During the process of setting the mass, I conducted research and consulted ChatGPT to determine the weight of each body part of the leopard gecko (as depicted in the image below). Additionally, since the quick rigging pose is designed for human models, I had to add rigs for the tail separately. However, I encountered various issues in subsequent processes.

weightofgecko.png
スクリーンショット 2024-02-29 172107.png

Firstly, I faced challenges setting up IK. Despite following tutorials and configuring the IK for the tail, my model consistently encountered errors and took me a considerable amount of time to pinpoint the issue. Eventually, I realised that the issue originated from applying rigs to each individual bone of the tail, as well as from twists resulting from editing the controller of the rig's direction.

Secondly, since the automatically applied rig only included one rig for the head (as indicated by the yellow arrow in the image below), I encountered difficulties in animating the mouth to open. However, it was solved by adding a separate rig for the lower jaw. 

スクリーンショット 2024-05-10 233208_edited.jpg

Thirdly,  I noticed anomalous movements in the animation after completing the rig. Upon investigation, I found that the issue stemmed from pre-existing IK settings in Blender (as indicated by the red arrow in the image above) conflicting with those in Cascadeur. To address this, I had to remove the conflicting settings by reverting to Blender.

Fourthly, when the rigs were animated, certain meshes did not follow suit. Upon examining the weight painting, I discovered that small meshes were not included as influenced meshes. Consequently, I had to return to Blender to adjust them accordingly.

[ Finalised rig ]

スクリーンショット 2024-05-05 222213.png

Although resolving these issues was time-consuming, it allowed me to become accustomed to the rigging process and develop a comprehensive understanding of Cascadeur. The image above illustrates the finalised rig for the 3D model.

Animation

For the axolotl animation, I was tasked with creating three animations for our game implementation: walking, surprising, and turning. In preparation for the animations, I was provided with some sketches and reference images to better align with the ideal and minimise the disparity between the client's vision and my own.

20231205_173634195_iOS.heic
20240222_173041959_iOS_edited.jpg

While Cascadeur typically assists in creating animations using AutoPosing mode driven by AI, since my model is not humanoid and involves quadrupedal walking, this function did not operate as expected. Consequently, the auto physics feature also did not perform optimally. Therefore, I began creating walking animations by manually inserting keyframes in the traditional way.

[ Walking ]

[ Reference ]

Firstly, I began by collecting references (four videos shown below), and then I proceeded to add keyframes (as depicted in the first and second attempts below).

[ first Attempt ]

Improvement

The simultaneous raising of the left front leg and right hind leg / the right front leg and left hind leg appears weird and fidgety.

[ second Attempt ]

Improvement

The movement of the tail

Afterwards, I inquired about the pace of the animation and sought clarification from the client regarding the number of keyframes. Through this inquiry, I realised that my initial interpretation, considering 24 frames as the total, was a misunderstanding and that the client intended to indicate 24 keyframes (Total: 120 frames). Based on this clarification, I adjusted the animation to enhance its smoothness (third attempt).

[ Thiird Attempt ]

Similarly to the walking cycle, I followed the same process (collecting references > animating > identifying improvements > adjusting) for the surprising and turning animations.

[ Surprising ]

[ Reference ]

[ first Attempt ]

Improvement:

Since there was also a misunderstanding regarding 12 frames for the entire animation, it has been corrected to 12 keyframes (Total: 60 frames).

[ secound Attempt ]

Improvements:

  • The movement of the lower jaw appears unnatural

  • Currently, the pace is too slow

  • Lacks dynamism

[ Thiird Attempt ]

To enhance the movement of the axolotl and make it more charming, I incorporated a jumping motion. During its creation, I paid particular attention to ensuring that the axolotl absorbs the impact of landing with its arms and tail, referencing images and videos of jumping humans (references below).

[ Turnning ]

[ Reference ]

For the turning animation, I referenced videos of turning leopard geckos and paid particular attention to depicting the leg pushing off against the ground and dragging the tail.

[ Feedback ]

After completing the animations and gathering comments from my colleagues, I sought feedback from the client. Shown below is the feedback I got. 

スクリーンショット 2024-05-16 202051.png

Based on this feedback, I proceeded to create four animations: walking, transitioning to standing, standing, and turning, and made adjustments for client approval. For the standing idle animation, I referenced a video provided by the client (shown below).

[ Completed Animations ]

After receiving further feedback and making minor adjustments, I completed all of the animations. Below are each animation (except for the transition animation due to its brevity) and a composited animation showcasing the phases of walking > transitioning to standing > standing idle > turning > walking.

[ walking ]

[ standing ]

[ Turning ]

[ composited ]

Opening Cinematics

Blocking Out

storyboard.png

According to the storyboards and instructions provided by the client, I was responsible for the fourth scene. To begin, I completed the blocking-out process, utilising the storyboard (shown above) and assets that the client had already prepared (borrowed assets: corner pillar, tome, and materials).

[ Animation : Block out ]

I then sought feedback from colleagues and the client.

 

The feedback I received includes

  • the need for the camera movement to be straight, as this animation represents the character's point of view

  • the end view of the camera should display the entire stone stand.

Based on this feedback, I adjusted the camera movement and positioning

Assets Creation

To finish the prototype of the animation, I mainly created two assets: a candle and a stand. 

Firstly, I began by collecting references and then created the 3D models and materials. Regarding material, I used this opportunity to learn shader node functions in Blender.

[ References : Modelling ]

[ References : Materials ]

[ shader nodes ]

[ Material : wax ]

スクリーンショット 2024-05-17 004809.png

[ Material : flame ]

スクリーンショット 2024-05-17 004844.png

[ Material : stone stand ]

スクリーンショット 2024-05-17 004727.png

[ Rendered Images ]

Candle_renderingpractice.004.png
stone_stand.png

Animation Prototype

Here is the finalised prototype of the animation. By studying lighting, I especially paid attention to making the tome highlighted by spotting lights. 

Further Development

Throughout this semester, I collaborated with the client and teammates to complete the axolotl, as well as the prototype of the opening animation. Although these tasks were completed, there are still opportunities for future improvements and developments. For instance, the axolotl's material may need to be adjusted to better align with the character's evolution. Also, since we only completed a prototype, the development of the opening cinematics will continue as a future project. 

 

In preparation for these future endeavours, I have created handover documents and shared all the files needed for future implementation into the game with the client, ensuring they meet the required format (PNG files for textures and FBX files for 3D models and animations). I also aimed to promote the game and myself by utilising social media to showcase the progress of modelling and advertise the RaRa Games, as well as through an exhibition held at the University of Winchester.

スクリーンショット 2024-05-13 221259.png
スクリーンショット 2024-05-17 024740.png

Moreover, this client project may contribute to a sustainable society, as mentioned in the Sustainable Development Goals (SDGs). For example, one of the targets raised in SDG 17 is a global partnership. If we successfully release the game on a global scale with various languages, it will promote global partnerships. Additionally, the experiences and skills I acquired through this project may contribute to educating people about the global economy by creating animations (SDG 8).

handover documents

To download the handover documents, please click on each icon.

[ Axolotl ]

[ Opening Cinemtics ]

Address

University of Winchester

Phone

07547668449

Email

Connect

  • Twitter
  • Instagram
  • LinkedIn

©2024 Portfolio Karin Nakane

bottom of page