Ren'Py memo

Ren'Pyの個人的なメモ

透過ありのムービーを使用する

資料
ムービー — Ren'Py Documentation
WebM + webM masking on mac : Ren'Py

1.ffmpegをインストールする

やり方と使い方はここより詳しい所がたくさんあるのでぐぐってね……

2.動画素材をお借りしてくる

sozaino.site
OKUMONO+Vさんの動画素材など~

3.動画をリサイズ(任意)

コマンドプロンプトとかターミナルを動画のある場所で呼びます
詳細はここより(略)ぐぐってね……

素材になる動画は割と大きめに作られがちなので先にリサイズします。
解像度と拡張子はアドリブでなんとか!ゲームと同じ解像度がおすすめです。

ffmpeg -i syutyusen_kuro.mov -s 1280x720 kuro.mov

4.マスク用の動画を作る

透過のために用意します。

ffmpeg -i syutyusen_kuro.mov -s 1280x720 -filter:v alphaextract mask.mov

5.合体する

これで出力されるwebmファイルがゲームで使うものになります。

ffmpeg -i kuro.mov -i mask.mov -filter_complex "hstack" -codec:v vp9 -crf 10 syutyusen_kuro.webm

6.動画を使用する

5で出力されたwebm動画をgameフォルダに入れます。
moviesフォルダを作って分けたい場合は"movies/syutyusen_kuro.webm"
みたいな感じでplayのところに指定します。
(imagesフォルダに入れる場合も指定しないと参照されないので注意)

image Movie1 = Movie(play='syutyusen_kuro.webm', side_mask=True, loop=True)

label:

    show Movie1
    a"ほにゃほにゃ"
    hide Movie1

GIFの場合

1. マスク動画を作る

元画像のgif 1.gif
マスクのgif mask.gif

 ffmpeg -i 1.gif -filter:v alphaextract mask.gif

2. ゲーム用の動画を出力

ffmpeg -i 1.gif -i mask.gif -filter_complex "hstack" -codec:v vp9 -crf 10 douga.webm
image Movie1 = Movie(play='douga.webm', side_mask=True, loop=True)

label:

    show Movie1
    a"ほにゃほにゃ"
    hide Movie1

ブックマークメモ

WebGL shader examples

webgl-shaders.com
例になるシェーダーのコードをまとめたサイト。最終更新は5年前ぐらい
ライセンスはCC BY-SA 4.0 DEED
(クレジット表記あり・改変する場合は同じ条件のライセンスで頒布が必要)

Awesome WebGL

github.com
WebGL関係で役立ちそうなリスト

CC0をShaderToyで検索したURL

www.shadertoy.com
CC0であることを明記しているシェーダーの検索リンク
ShaderToyで著者が明記していない場合デフォルトで設定されるライセンスは、
CC BY-NC-SA 3.0 DEED(表示 - 非営利 - 継承 3.0 非移植)になる。非商用
ShaderToy利用規約https://www.shadertoy.com/terms

ブックマークメモ

アニメーション資料

公式サイト
www.mixamo.com

わかりやすい紹介記事
「mixamo」で人間の様々なアクションを見る【お絵描き資料】 - 物覚え雑記帳

ライセンスに関する記事
MixamoアニメーションのNFT化|問い合わせと調査報告|HGk1-nft

以下公式のFAQから引用。

ロイヤリティフリーのキャラクターとアニメーションの両方を個人、商用、非営利のプロジェクトに使用できます。以下に例を示します。

・キャラクターをイラストやグラフィックアートに組み込む
・3D 印刷のキャラクター
・映画の制作
ビデオゲームの作成

会員登録が必要。3Dモデルのアニメーション。


Python

envader.plus
クラスのわかりやすい解説。


ノベルゲーム関係の資料

www.youtube.com

Visual;Conferenceビジュアルノベル開発者向けのカンファレンス)にて公開された動画のリスト。


以下ほんの一部の抜粋(英語が読めなくても参考にし易い系)

ビジュアルノベルをより映画的に見せるためのポストプロダクション・テクニック10選
VNConf 2024 - 04 - Justinn - 10 or so post-production techniques to make your VN look more cinematic - YouTube


画像素材圧縮の技術: より少ない素材でより多くを生み出す
VNConf 2024 - 07 - Shino - The Art of Asset Reduction: Make More With Less - YouTube


完成した作品を磨きあげる: そのための小さな機能
VNConf 2023 - 08 - Shino - Polishing your Release: the Little Features that Could - YouTube


ビジュアルノベルの映画撮影術とインタラクティブデザイン
VNConf 2022 - 08 - Vimi - Visual Novel Cinematography and Interactive Design - YouTube


アニメーションでビジュアルノベルに命を吹き込む
(Visual;Conference 2020) 04-Lucy - Using animation to bring life to your visual novel - YouTube


超初心者向けの H シーン
(Visual;Conference 2019) 21 - Ryechu - H-scenes for Dummies - YouTube
(これは選出の例外に当たりますが面白かったので……)


jaimescribblesgames.com
ビジュアルノベルのプレスキットの解説。
プレスキット:広告用にまとめた資料のこと。

画面クリックで確認ウインドウを呼び出す

screen credits():
 key "mouseup_1" action Confirm(_("エンドロールを飛ばしますか?"), Jump("credits_after"))

表示しているスクリーンか、確認ウインドウが必要なスクリーンに記述する。

"mouseup_1":右クリック。
キーの指定方法はキーマップのカスタマイズ — Ren'Py Documentationを参照

Confirm:確認ウインドウのscreen action。
詳細はScreen Actions, Values, and Functions — Ren'Py Documentationを参照

ブックマークメモ

loyaltyfreakmusic.com
ほとんど(全てではない)CC0の音楽素材を作者自体が配布しているサイト。
ジャンル・ライセンスのフィルターがあって便利。


f95zone.to
(リンク先は18禁・会員登録をしないとプレビューが見られないため注意)
GLTransitions(MITライセンス)から5個シェーダーをRen’Py用に移植し、トランジションとして使用できるようにしたコード。

ムービー操作に関するサンプルまとめ

lemmasoft.renai.us

以下は上記tipsの目次を日本語機械翻訳したもの(2024/01/30時点)

  1. 全画面で動画を再生 (Android対応)
  2. Ren'Pyに動画をimage画像 (またはvideo sprite) として表示させる
  3. 動画の属性を指定し、サイズとオーディオチャンネルを即座に調整して、設定で音量を調節する
  4. 動画を一時停止するスクリーン
  5. 動画を自動で全画面に拡大する
  6. 動画上のテキストを自動的に反転する
  7. 動画や音楽の音声を再生する
  8. (Null)
  9. 連続した動画間のちらつきを防ぐ
  10. タイトル画面でビデオを一時停止する古い方法
  11. ハードウェア ビデオ レンダリング モードを有効にする
  12. 動画の最初のフレームに画像を指定する
  13. 動画をサポートしていないAndroidのために画像を表示する
  14. タイトル画面に動画を再生するボタンを追加
  15. 動画ギャラリー
  16. (実験的なコード) 動画の早送り
  17. hoverすると動画が表示される方法
  18. 動画間のトランジション
  19. video spriteの挿入・チャンネルの切り替え

2024/01/30ブックマークメモ

※ 動作確認はしてません。

・ドット絵風テクスチャシェーダーのコード
Shader Texture Position - Lemma Soft Forums
Shader - Shadertoy BETA

・レイヤー分けした背景をスクロール表示するRen’Pyプラグイン
GitHub - Foxcapades/renpy-horizontal-parallax: Configurable scrolling images with a parallax effect.

・キャラクター名をフィルタリングしてボタンを表示する検索ボックス
How to create a search box function with imagebuttons? - Lemma Soft Forums

renpy.get_screenで表示している画面を取得して何かする

例1

screen notify(message):

    zorder 100

if renpy.get_screen("main_menu") != None:
    style_prefix "title_notify"
elif renpy.get_screen("nvl") == None:
    style_prefix "notify"
else:
    style_prefix "nvl_notify"

例2

if renpy.get_screen("splash") != None:
    null height 40
else:
    null height 50

例3

textbutton _("Flowchart") action [SelectedIf(renpy.get_screen("flowchart")),NullAction()]

スクリーンをshowまたはhideした時にactionを起こす

例1

screen help():
 on "show" action SetVariable("persistent.last_menu", "help")

表示した時に変数を変える

例2

on "show" action Function(renpy.show_layer_at, blur_in2, layer="screens" )
on "hide" action Function(renpy.show_layer_at, blur_out2, layer="screens")

showした時にscreensのレイヤーにtransformをかける
hideした時に上でかけたtransformを外すtransformをかける

2024/01/28時点の役立つかもしれないブックマーク

ブックマーク系

VNDEv Wiki

vndev.wiki
ビジュアルノベルに関するリソースと参考資料のリスト

Visual Novel Assets, Tutorials, and Tools

itch.io
itch.ioにある素材(プラグイン・ツール含む)リスト ノベルゲームの最新素材を探すのであればこの方のコレクションを逐一チェックするのがよさそう

Open source, experimental, and tiny tools roundup

tinytools.directory
オープンソース、実験的、小さなツールのリスト

Awesome Design Tools

github.com
デザインツールとプラグインのリスト

Magic Tools

github.com
ゲーム開発リソースのリスト

Awesome RenPy

github.com
Ren'Py関係のリスト(最後の更新は2年前)


素材系

Animated emotes for visual novels

vf-traveller.itch.io
無料の動くアニメーションエモート素材 商用利用可

Better EMR Phone

elckarow.itch.io
Ren’Pyの携帯電話フレームワーク MITライセンス

Ren'Py Vertical Android GUI Template

mugimvgi.itch.io
1080x1920の縦型Ren’Pyテンプレート

Shooting Game Plugin for Ren'Py (FPS)

seo-a-nam.itch.io
Ren'PyのFPSミニゲームプラグイン CC0

YuiTube UI Pack

xxmissarichanxx.itch.io
youtube風のRen'PyUIテンプレート 1280x720


動画系

Game Maker's Toolkit

www.youtube.com
ゲーム制作等に関する解説動画 一部日本語字幕あり


UI系

ゲームUI演出

gameanimation.info
UI演出の解説、NG例などのブログ

資料系

The Ultimate Guide to Camera Shots (50+ Types of Shots and Angles in Film)

www.studiobinder.com
カメラショット・アングルの一覧

The 12 Principles of Animation (With Examples)

idearocketanimation.com
アニメーションの12原則(GIF付き)
"アニメーションの12原則"で調べると他にも多く記事・動画あり

Japanese version of Access Needs Posters

github.com
アクセシビリティのためのデザイン」ポスターの日本語版

How to communicate with composers?

lemmasoft.renai.us
音楽制作を依頼するときに必要なこと

An in-depth look at what otome players want

An in-depth look at what otome players want
tailortales.wordpress.com
海外乙女ゲームユーザーのアンケート統計(800件・2018年12月)

Project Gutenberg Australia

gutenberg.net.au
オーストラリアにおいてはパブリックドメインのデジタルライブラリ

ツール系

PhotoMosh

photomosh.com
画像加工ツール 無料版は右下にロゴがつく

LayeredImageのコードを短縮するプラグイン

(2024/07/14) ブラウザ版に使うとエラーが出ます

draida.itch.io

注意

  • Ver.8.00以上、pngとwebpの画像のみ対応
  • 2024/01/28現在、ルートフォルダーに無いimageは使用できない→目パチなどでimageに直接transformを使用するLayeredImageには適さない
  • sprite_imagesのエラーが出る場合、55行目辺りに_sprite_images = []を入れる

内容

画像名・コードがスッキリする。
例:cg1_a_a1.png → cg1/aのフォルダにa1.pngを入れるだけでよくなる。

コード例

短縮前のコード

    layeredimage cg1:
        at zoo1
        always "cg1_base"

        group a:
            attribute a1 default
            attribute a2
            attribute a3
        group b:
            attribute b0 default
            attribute b1
            attribute b3
        group c:
            attribute c1 default
            attribute c2
            attribute c3
        group d:
            attribute d1 default
            attribute d2
            attribute d3
        group e:
            attribute e1 default
        group f:
            attribute f1 default

短縮後のコード

    image cg1 = FolderSprite(
        "images/cg1",
        at = zoo1,
        auto_attributes = True,
        a = "a1",
        b = "b1",
        c = "c1",
        d = "d1",
        e = "e1",
        f = "f1")
フォルダ構造の例

一部のconfirmに次回からこの画面を表示しないをつける


必要な変数を用意

options.rpy

default ask = ""
default conf = conf1

define conf1 = _("☐次回からこの画面を表示しない")
define conf2 = _("☑次回からこの画面を表示しない")
define conf3 = ("persistent.ask_save","persistent.ask_del","persistent.ask_load","persistent.ask_title")

confirmを使用するボタンにactionを追加

screens_saveload.rpy

screen file_slots(title):
(省略)
button:
(省略)
action [SetVariable("ask", "persistent.ask_load"),FileLoad(slot, confirm=persistent.ask_load)]
(省略)
action [SetVariable("ask", "persistent.ask_save"),FileSave(slot, confirm=persistent.ask_save)]
(省略)
action [SetVariable("ask", "persistent.ask_del"),FileDelete(slot, confirm=persistent.ask_del)]
(省略)

screens.rpy

screen navigation():
(省略)
textbutton _("タイトル") action [SetVariable("ask", "persistent.ask_title"),MainMenu(confirm=persistent.ask_title)]

confirmのコードを変更

screen confirm(message, yes_action, no_action):

    modal True
    zorder 200
    layer "confirm"
    style_prefix "confirm"
    add "conf_background"

    dismiss action [If(conf==conf2,true=SetVariable(ask, False), false=SetVariable("ask", "")),SetVariable("conf", conf1), SetVariable("ask", ""),no_action]
    key "game_menu" action [If(conf==conf2,true=SetVariable(ask, False), false=SetVariable("ask", "")),SetVariable("conf", conf1), SetVariable("ask", ""),no_action]

    frame at conf_appear:

        vbox:
            xalign .5
            yalign .5
            spacing 30

            label _(message):
                style "confirm_prompt"
                xalign 0.5

            hbox:
                xalign 0.5
                spacing 50

                if "quitload" in ask:
                    textbutton _("Yes") action [If(conf==conf2,true=SetVariable(ask, 2), false=SetVariable("ask", "")),SetVariable("conf", conf1), SetVariable("ask", ""),yes_action] background "color2" hover_background "color4"
                    textbutton _("No!") action [If(conf==conf2,true=SetVariable(ask, 2), false=SetVariable("ask", "")),SetVariable("conf", conf1), SetVariable("ask", ""),no_action]
                else:
                    textbutton _("Yes") action [If(conf==conf2,true=SetVariable(ask, False), false=SetVariable("ask", "")),SetVariable("conf", conf1), SetVariable("ask", ""),yes_action] background "color2" hover_background "color4"
                    textbutton _("No!") action [If(conf==conf2,true=SetVariable(ask, False), false=SetVariable("ask", "")),SetVariable("conf", conf1), SetVariable("ask", ""),no_action]

            if ("save" in ask and persistent.ask_save == True) or ("del" in ask and persistent.ask_del == True) or ("load" in ask and persistent.ask_load == True) or ("title" in ask and persistent.ask_title == True) or ("quitload" in ask and persistent.quitload > 0):
                textbutton "[conf]":
                    style_prefix "confirm2"
                    action [ToggleVariable("conf", true_value=conf2,false_value=conf1)]

スクリーンのactionが思うように動かないとき

action Confirm(_("戻りますか?"),[Jump("A"),SetVariable("B",True)])

こう書くと、変数の変更が飛ばされる。

action Confirm(_("戻りますか?"),[SetVariable("B",True),Jump("A")])

actionの配列は左から実行される
→Jump("nantoka")は最後に入れるようにする

フローチャートプラグインの紹介と簡単な説明

devilspider.itch.io

フローチャートプラグイン

・ライセンス:質問してみたところ"The license - if any - would simply state “feel free to use it in and modify for your game, just credit me”(もしライセンスがあるとすれば、簡単に言うと"あなたのゲームに使ったり改造したりするのはご自由に、ただ私のクレジットを入れてください "というものです)"とのこと

  • 通過した場所のボタンをセレクト→ジャンプが可能
  • 変数(現在地より前の質問の答えなど)を変更できる機能あり
  • 6~7つほど画像を用意する必要あり
  • 隠しチャートを後から表示させる機能あり
  • クレジットに制作者(Devil Spiδεr)の方の名前を載せることを推奨
  • 1つのセーブファイルからエンディングを参照する設計であるため、エンディング後タイトルに戻るなどの設計で使用することは非推奨

最初からスタンドアロン版を入れるより前に、デモ版のscript.rpyを合わせてflowchart.rpyを読んだほうが理解が深まると思います。

続きから

を載せます。

続きを読む