世界最大規模のゲーム開発イベント。ティラノゲームフェス2024エントリー受付中 

  • 採用実績は20000作品以上。PC・スマホ・ブラウザ対応のノベルゲーム製作キット
初心者の壁を突破しよう!

目パチ・口パク機能

*この機能はティラノスクリプトV525、もしくはV600以上が必要です。

ティラノスクリプトでは目パチ・口パクを簡単に実現することができます。
以下のページで実際に動作するデモを確認することができます。

動作サンプルURL



目パチ・口パクの差分画像を用意する

さっそく、ティラノの目パチ・口パクを使ってみましょう。
最初に差分画像を用意する必要があります

今回は次のような画像を使用します。



これがベースとなる画像で「base.png」とします 続いて、目パチと口パクの差分画像を用意します。これらは先程のベース画像と同じ解像度で用意する必要があります。

今回の例ですと452x720pxです

【目パチ差分画像】


それぞれ、開いている状態(open.png)中間の状態(mid.png)閉じている状態(close.png)となります。

同じ容量で口パクの差分画像も用意してみましょう。

【口パク差分画像】


こちらも、開いている状態(open.png)中間の状態(mid.png)閉じている状態(close.png)となります。
用意したら通常のキャラクター表示と同じように「data/fgimage/chara1」フォルダに配置します。
今回は以下のような状態でフォルダ配置しました。

目パチ・口パクのキャラクターを表示してみる

それでは先程用意した画像をつかってキャラクターをゲームに表示してみましょう。

特に通常のキャラクター表示と大きく変わることはなく、簡単につくることができます

必須ではありませんが、キャラクター差分パーツ機能について知っておくと、より理解が深まるかと思いますので 後で確認しておいてください。

キャラクター差分パーツ機能とは

それでは早速コードを記述してみましょう


;chara1
;キャラクターの定義
[chara_new   name="chara1" jname="佐藤" storage="chara1/base.png"]

;目パチの設定
[chara_layer name="chara1" part="eye" id="normal" storage="chara1/eye/open.png" frame_image="close, mid" frame_time="4000-6000,80,80"]

;口パクの設定
[chara_layer name="chara1" part="mouth" id="normal" storage="chara1/mouth/close.png" lip_image="mid, open"]

;キャラクターを画面に表示
[chara_show name="chara1"]

#chara1
こんにちは。口パクできてますか?[p]



動作確認すると、目パチと口パクできていることが確認できますね?



まず、[chara_new]タグでベース画像を登録します


;chara1
;キャラクターの定義
[chara_new   name="chara1" jname="佐藤" storage="chara1/base.png"]
                    
つづいて、[chara_layer]タグを使って目パチと口パクを登録していきます。大事な点としては
storageパラメータで目が開いている状態(open.png)を登録し、frame_imageパラメータに中間(mid.png)、閉じている(close.png)を登録しています


storage="chara1/eye/open.png" frame_image="close, mid"
                    
frame_imageパラメータは拡張子(.png)の省略が可能です。
open.pngと同じ階層に画像ファイルを配置しておく必要があります

つまり、上記の記述は open→close→mid
の順番で差分がアニメーションするという定義になります。
そして最後のframe_timeパラメータでアニメーションの時間を制御することができます。


frame_time="4000-6000,80,80"
                    
これは順番に
・open.png(4000〜6000ミリ秒の間でアニメーション実行)
・close.png(80ミリ秒間表示)
・mid.png(80ミリ秒間表示)

という意味を表現しています。
数字を-(ハイフン)で区切ると、その間でランダムに繰り返すころが可能です。

目パチなどは一定間隔ではなく、ランダムに実行したほうが自然な表現が可能です

口パクの記述も同じです。
ティラノではnameで自動的に紐づけを実施し、当該のキャラクターが話している間は自動的に口パクをしてくれます。

口パクにはテキストの口パクとボイスの口パク(リップシンク)の2種類があります。
特に指定がなければテキストタイプの口パクになります。

ワンポイント

途中で目パチや口パクの速度を変えたい場合
[cahra_layer]タグを再定義すると上書きすることが可能です

例えば


[chara_layer name="chara1" part="eye" id="normal" storage="chara1/eye/open.png" frame_image="close, mid" frame_time="100,100,100"]
#
瞬きの回数増えたぞ?[p]

このような演出も可能になりますね。

ボイス音声と連動したリップシンク

ここまではテキストと連動した口パクをつくりましたが 音声と連動したリップシンクも簡単に作ることができます

次のコードを見てください


;口パクの設定
[chara_layer name="chara1" part="mouth" id="normal" storage="chara1/mouth/close.png" lip_image="mid, open" lip_type="voice"]

;キャラクターを画面に表示
[chara_show name="chara1"]

#chara1

[playse chara="chara1" storage="voice/chara_1.mp3"]
こんにちは。口パクできてますか?[p]

変更した点はパラメータに「lip_type="voice"」を追加しただけです。
あとは音声を再生するタイミングで

[playse chara="chara1" storage="voice/chara_1.mp3"]

のようにキャラクター名を指定すると、その音声に合わせて口がアニメーションしてくれます。
通常は無音のときは閉じた状態で、少し音量が上がると中間。一定レベルの音量になると最大といったように変化します。
この変化のレベルは「lip_volume」というパラメータで調整が可能なので、詳しくは目パチ・口パク機能の詳細解説記事 のご参照ください。

さらに詳しいパラメータ解説

ここまで見ていただくとわかると思うのですが、大変強力な機能なので
目パチ・口パク以外でも例えば風になびく服や髪の毛などを表現することもできますね。

さらに詳細や詳しい機能は以下のリンクからご確認ください。

目パチ・口パク機能の詳細解説記事