ゲームエフェクトデザイナーのブログ (新)

レポート記事とかUE4のマテリアルとか。C#とかも触ったり。

メインコンテンツ目次

●ニュース

Unreal Engine 4UE4)について書いた記事(主にVFX Artist向け)

エフェクトツールを使ってできること
エフェクトのワークフロー

テクスチャのインポートについて
テクスチャのプロパティについて
テクスチャのフォーマットについて

マテリアル作成の基本的な知識
最終マテリアル入力の各ポートについて
パーティクル向けのマテリアルの設定について

BISHAMONについて書いた記事

BISHAMONの最初のステップ
BISHAMON Personal v1.8 の新機能について
BISHAMONへのカメラのインポートについて

●Houdiniについて書いた記事

Houdiniの学習について
Billowy Smokeを使った煙のチュートリアル(前半)
Billowy Smokeを使った煙のチュートリアル(後半)

Mayaについて書いた記事

MELの最初のステップ
MELのウインドウ作成について
MELでシェーダー作成 1
MELでシェーダー作成 2
MELスクリプトのある場所を参照する
MELを配布する時のプロシージャについて
UVの正規化
頂点カラーを別のモデルに転送
テクスチャの色を頂点カラーに転送

Photoshopについて書いた記事

Photoshopのスクリプトを書いてみる

C#やプログラム全般について書いた記事

C#のはじめ方
C# ソリューションの基本的なファイル構成について

C#で正規表現による置換を行う
C# DataGridViewの主なプロパティ

C#で作ったツール一覧

GitHubでのツールやソース公開について(CGアーティスト向け)
ライセンスについてのメモ

●その他の記事

数学が苦手な人向けのCG数学シリーズ

イチオシゲームエフェクトアレコレ

処理速度と処理量のお話 ms(ミリセカンド)について
ドローコールについて

おおまかな開発コストの計算方法
おおまかなゲームソフトの売り上げの計算方法

勉強会開催のすすめ
大阪・京都の貸し会議室メモ

続きを読む

C# Buttonコントロールの枠線を消す方法

.NET Frameworkを使ったWindows Form Aplicationで、Button Control の Border を無くしたい‥
つまり「ボタンの枠線(輪郭線・境界線)を消したい」場面があります。

例えばボタンに背景画像を設定してアイコンに見せたいような時です。

こちら、もちろん消せますがVisual Studioのフォームデザイナのボタンコントロールのプロパティには見当たらないので、初学者が詰まるところだと思います。

そしてググっても案外スっと回答が出てこない。なのでメモっておきます。

続きを読む

C# コントロールの表示をボタンで切り替える

Formアプリで2つのDataGridViewをタブで切り替えるようなことをしたいのですが、TabControlは標準のプロパティでは外観をほとんど変えられないので、単純にボタンと表示/非表示の切り替えだけでやってみました。

まずフォームデザイナで下図のような感じでボタンとDataGridViewを2つずつ配置します。

f:id:moko_03_25:20180919220720j:plain

ボタンクリックイベントを追加してこちらのように記述します。
ボタンを押したら片方のDataGridViewを表示、もう片方を非表示にするだけ。

private void button1_Click(object sender, EventArgs e)
{
    if (dataGridView1.Visible == true)
    {
        return;
    }
    else
    {
        dataGridView1.Visible = true;
        dataGridView2.Visible = false;
    }
}

private void button2_Click(object sender, EventArgs e)
{
    if (dataGridView2.Visible == true)
    {
        return;
    }
    else
    {
        dataGridView1.Visible = false;
        dataGridView2.Visible = true;
    }
}


するとこのような感じで正常に動作しました。

f:id:moko_03_25:20180919220716g:plain

ただし、最初から片方のDataGridViewを非表示にしておかないと、どちらのボタンを押しても何も反応しないという状態になってしまいました。なぜ。。

お次は、2つのDataGridViewを同じ位置にピッタリと重ねて、ボタンもタブのように隣接させてみました。すると、まるでタブで切り替えているようになりました。

f:id:moko_03_25:20180919220711g:plain

アクティブなボタンの輪郭が太くなるのは不細工なので、ボタン初期化時に border = 0 で枠線を消してしまうと良いです。こちらの記事で解説しています。

また、タブっぽい画像を背景にするというのも良さそうです。

C# Twitterアプリを作ってみる2

前回の記事の続き。

とりあえずツイートとタイムラインの取得ができるというだけですが、形にはなったので初学者な方のために公開しておきたいと思います。

GitHubはこちら。
GitHubにも書いていますが、ソリューションを開いたらまずはNuGetでCoreTweetをインストールして、開発者サイトからAPI Key等を取得してコード内で参照するようにしてください。そうしないとエラーが出てビルドも実行ファイルの起動もできません

こちらのGIFアニメのような感じで文章のツイートと、自身のタイムラインのツイートを最新のものから任意の数だけ取得してTextBoxに表示します。
ページ数(引数 page)というのは、一度に取得する数(引数 count)を1ページとして、何ページ先のものを取得するかという指定のようです。でもあまり先のページは読み込めない様子。。

f:id:moko_03_25:20180917015151g:plain

続きを読む

C# Twitterアプリを作ってみる1

プログラム初心者がいきなりTwitterアプリを作ろうとすると思いのほか大変な印象でした。
例え任意の文字列を投稿するだけでも。。

なのでざっくりと備忘録としてメモっておきたいと思います。

大まかな流れ


① 開発者サイトへのアカウント登録

② 開発者サイトから「API Key」「API secret Key」などを入手

Visual StudioWindows Form Application の新規プロジェクトを作成

④ NuGet で Twitter APIC# で利用するライブラリ「CoreTweet」をインストール

ソースコードに以下のような処理を記述(方法はいくつもあるのでその一例)

 1. API Key を使ってTwitterアプリ連携認証ページへアクセス
  ※認証するとウェブ上にPINコードが表示される
 2. ダイアログボックスを表示するなどしてPINコードの入力を受け付ける
 3. 入力されたPINコードを使用してトークンを取得
  ※ここでようやくTwitterへの読み書きが可能に
 4. ツイートしたりタイムラインを表示したりと実行したい処理を書く

開発者サイトへのアカウント登録


Twitter公式のAPIを利用するには、まず公式の開発者サイトへの登録が必要なようです。
なんと面倒な。。

Twitter Developer Platform — Twitter Developers

理由はスパム投稿など不正アプリ防止のようで、登録したは良いもののアプリからのツイート数制限など色んな制限が設けられている模様‥

アカウント登録の際には全て英語で入力が必要で、それはGoogle翻訳で十分なのですが、どんなアプリを何のために作りたいかの説明を300字以上書かないと登録を完了できません。。

開発者サイトから「API Key」と「API secret Key」を入手


開発者サイトにログインしている状態だと右上にアカウント名が表示されますが、そのプルダウンメニューで「Apps」を選択、開いたページ先で「Detail(詳細)」ボタンを押す。

f:id:moko_03_25:20180916025605j:plain

f:id:moko_03_25:20180916025603j:plain

そしてジャンプ先のページ上部にある「Keys and tokens」タブを開くと「API Key」と「API secret Key」などの記載があるのでこちらをForm上で使用します。

f:id:moko_03_25:20180916025601j:plain

f:id:moko_03_25:20180916025559j:plain

最初どこに記載されているのか分からず探しました。。分かりにくい。。

「CoreTweet」をインストール


Twitter APIC# で利用するライブラリは色々あるみたいですが、ググってみた感じでは「CoreTweet」が最もポピュラーで良さそうな印象です。

こちらを NuGet で探してプロジェクトにインストールします。

具体的にコードを記述していく


ここは色んなサイトにそれぞれ色んな方法でサンプルが紹介されています。

最初はこちらのあたりを参考にしました。

C#でTwitterにつぶやく - プログラミング素人のはてなブログ

クイック チュートリアル · CoreTweet/CoreTweet Wiki · GitHub

C#でTwitterアプリを作る 第1回 OAuth - らこらこブログ

OAuth認証を利用しクライアントアプリケーション(デスクトップアプリケーション)から Twitterにつぶやきを投稿する (C#プログラミング)

.NET向けのTwitterライブラリ「CoreTweet」の使い方まとめ - 酢ろぐ!

認証ひとつとっても3種類くらい方法があるようで‥

とりあえずはPINを発行してそこからトークンを取得するというものを試してみました。

アプリ実行時には、例えばFormに配置したボタンをユーザーがクリックすると、ブラウザが自動で開いてTwitterアプリ連携認証ページを開き、「認証」ボタンを押した先で表示されるPINコードを入力して欲しい訳ですが、手っ取り早くテキスト入力欄があるダイアログボックスを開いて入力待機させようと思いました。

任意のURLをブラウザで開く


まず、指定のURLをブラウザで開かせるのは非常に簡単でした。

外部アプリケーションを起動する、ファイルを関連付けられたソフトで開く - .NET Tips (VB.NET,C#...)

こちらを参考にして‥

Process.Start(”アクセスするURL”.AbsoluteUri);


たったこれだけでいけるようです。

つまりアプリケーションに関連付けられたファイルを指定してやればそのアプリで開いてくれるように、URLを直接渡すだけでブラウザで開いてくれるんですね。便利!

ボタンクリックイベントでPINコードを取得する


PINコードを入手したは良いものの、それをダイアログボックスで入力してもらって取得したい訳ですが、どうも C# 標準のダイアログボックスにテキストボックス付きのものは無い様子。

そこで、Visual Basicの「InputBox」クラスを利用する方法を試してうまくいきました。

という訳で、起動する度にPINコードを入力する手順を踏む必要がありますが、こちらのような記述でとりあえずTwitterへの投稿ができました!

private void button1_Click(object sender, EventArgs e)
{
    // API Key と API secret Key を入力(ハードコーディング時は注意)
    var session = OAuth.Authorize("API Keyを入力", "API secret Keyを入力");

    // ブラウザでTwitterアプリ連携認証ページを開く
    Process.Start(session.AuthorizeUri.AbsoluteUri);

    // ダイアログボックスを表示
    var pincode = Microsoft.VisualBasic.Interaction.InputBox( "PINコード を入力してください", "title", "", -1, -1);

    // トークン取得
    var tokens = OAuth.GetTokens(session, pincode);

    // ツイートする
    tokens.Statuses.Update(status => "hogehoge");
}


やったー! 成功!

ちなみに API Key と API secret Key は誰にも知られてはいけないものなので、コード内に直接書く(ハードコーディングする)場合には注意が必要そうです。GitHubでバージョン管理していてうっかりPublicにしてしまったりとか、ありそう。。

こちらの記事内にも書かれていたのですが、セキュリティ対策のひとつとしてパスワードのようなものは環境変数に登録してソースコードで参照するような形にすると良いと。

なるほど‥!

そういう発想は全くありませんでした。。勉強になる。。

という訳で、とりあえず投稿までは上記の流れでいけたということで。

追記:この後、PIN取得を省略する形でツイートとタイムライン取得まで実装できました。
   その解説はこちら

C# ファイルパス・フォルダパスをリストアップするツール

指定したフォルダ内のファイルまたはフォルダを全てリストアップするツールを作りました。
こちらからDLできます。

GitHubにも実行ファイルとソリューション一式をアップしています。
ライセンスは MIT License です。

f:id:moko_03_25:20180915040627g:plain

ファイルリストとフォルダリストのどちらを作成するかをラジオボタンで選んでおいてから「List up」ボタンでリストアップするだけのシンプルなものです。

過去に似たようなツールを作っていますが、不便なのをそのままにしていたので一から作りました。

▼こちらは指定フォルダ以下のファイルを全てリストアップした場合
 フォルダパスとファイル名を別の列に分離して表示します。
 サイズをByte・KiB・MiBで出しています。

f:id:moko_03_25:20180915040623j:plain

▼こちらは全てのサブフォルダをリストアップした場合
 「pass」の列しか表示されません。

f:id:moko_03_25:20180915040622j:plain

実装はシンプルなので、使用者によっては以下のようなあたりで不満が出るかも。

▼全体的なこと
・ファイルを開くダイアログでフォルダを選択したい
・サブフォルダを対象に含めなくて良い時がある
CSVで出力して欲しい
・xlsxで出力して欲しい
・表に結果を出すのはいらない
・Copy to Clipboard ボタン名が長くて邪魔
・Clear ボタンは別にいらない

▼ファイルリストの場合
・特定の拡張子だけリストアップしたい(または除外したい)
・フォルダパスとファイル名を分離しなくて良い時がある
・サイズはByteかKBかMBかを選んで表示させたい
・サイズは小数点第何位まで表示するか指定したい
・大量にファイルがあると時間がかかるのでプログレスバーを表示して欲しい

▼フォルダリストの場合
・フォルダごとにファイル総数と総ファイルサイズを出したい
 現状はこちらを使用していただければ‥

 
このあたりは将来、気が向いたら拡張するかも。。
特にプログレスバーとxlsxでの出力は試してみたい。

     *      *      *     *     *

余談ですが、プログラマさんがこういったツールを作成する場合はCSVで出力することがほとんどだと思います。エクセルで開けば表の状態で閲覧できますし、ログとして保管していくのにも便利ですし、他のツールに読み込ませる中間ファイルとして汎用的で便利というのもあると思います。

でも、自分は表からコピペが馴染む感じで。

CSVで出力しても出力先のフォルダを開いてCSVを開いて、そのままエクセルでは編集せずにいったん全選択コピーしてテキストエディタに貼り付けて正規表現マクロで整形してエクセルに貼り付けて編集する‥という流れで表を作ることが多いので、CSV挟むとむしろ少し手順に感じてしまうんですよね。。

エクセルで先に表のデザインを作っておいて値だけ後から貼り付けることも多くて。

ちなみにCSVを扱う場合の注意として、1項目の中にカンマが含まれてる場合・タブスペースが含まれている場合などの対処が必要だったりと案外面倒な部分もあるので注意が必要のようです。と言っても、そのあたり全てフォローされたサンプルやライブラリは探せばすぐ見つかりそうでもあります。

twitterのモーメント一覧

自分以外の人のモーメントにアクセスする方法、またログインせずに自分のモーメントにアクセスする方法が分からなかったので、こちらにリンクを貼っておきたいと思います。

モーメント、色々機能が足りなさ過ぎて力を入れてるようにはとても思えないのだけど‥そのうちモーメントがまるっと削除されたりしそうでこわい。。

続きを読む

「ゲームプランナーのドキュメント作成例<基本編>」がKindleストアでリリースされました!

安 幸村さんの「ゲームプランナーの参考例」シリーズ最新作の宣伝になります!

と思っていたら翌日にはリリースされていました‥!!
Kindle Unlimitedに加入している方は無料で読めますっ

表紙イラストは「eldenka(@eldenka)」さん!

女の子が一生懸命、仕様書を書いている姿‥!
そして机の上に広がるミニマムなファンタジーRPG感がとても素敵です‥!
ロゴは私が担当しました!‥が、拙いロゴデザインがイラストを台無しにしている感もあり‥自分に絶望しつつな感じで‥ごめんなさい精進します‥ごふっ‥

という訳で本書について、Amazonの紹介文そのままですがこちらにもペタリ!


 ゲーム開発の現場で、プランナーはどの様に仕様書を作成すればいいのか?

 仕様書の実装へ向けて、現場でどの様に動くべきなのか?
「自立したプランナー」をテーマとした物語を通して、プランナーの実務を解説します。

【目次】
はじめに
Introduction
第1章 苦情
第2章 ドキュメントの構成
第3章 ビジョン
第4章 仕様の作成とは
第5章 仕様書の作成
第6章 打ち合わせ
第7章 メンテナンスと実装確認
第8章 再生
Conclusion
第9章 ドキュメント作成の要点
第10章 「自立したプランナー」を目指して
終わりに

本書は小説の形を取りながら、架空の会社で働く新人プランナーの子と、彼女が一人前になるべくメンターとして導く先輩のお話です。そして物語に登場する架空のゲームの仕様書をサンプルとして解説がされています。

その仕様書に添えられるゲーム画面用の素材をお手伝いさせていただきました。
キャラクターの立ち絵とか、背景の酒場や寺院、アイコンなど。。

f:id:moko_03_25:20180831030053j:plain

f:id:moko_03_25:20180831030044j:plain

自分は背景はほとんど描けないので、、ゼロから描いてたら間に合わないと思い、UE4で球・円柱・立方体・円錐・アーチのプリミティブを組み合わせて作りました。書いてて恥ずかしいのですが、、建物の体を成してないし、色々アレです。。建物の構造からちゃんと調べないとダメですね。。

参考資料はほぼPinterest

でも仕様書内の図はアーティストに伝えたいイメージが伝わればいいのですよ‥!(開き直り)

あと、スマホやKndleで見た際に仕様書は恐らくかなり小さく表示されるので、分かりやすい見た目にして、モノクロなのでキャラが手前に乗っても大丈夫なよう全体的に明るくコントラストを抑えたトーンにしています。

作ること自体は楽しかったので、一度ちゃんと構造から勉強して作ってみたい。

       *        *        *        *


という訳で、本作も大変な力作ですので、ぜひお手に取って頂ければ幸いです!

そして今後も「ゲームプランナーの参考例」シリーズは続いていく予定だそうなので、ぜひぜひご注目いただければと思います‥!

※こちらも Kindle Unlimited で無料です!

C# よく使う文字列をコピペするための補助ツール

作りました。こちらからDLできます。

GitHubにも実行ファイルとソリューション一式をアップしています。
ライセンスは MIT License です。

「しばらくの間、同じような文字列を頻繁にコピペする」という時に使ってみてください。
ちなみに自分はバージョン管理ソフトのコメントコピペ集として使うために作りました。

f:id:moko_03_25:20180828025825p:plain

7つの項目xタブで3ページは固定です。

同梱している「Default.ini」にテキストの内容を記憶します。
ツールを終了する際の保存ダイアログに対応しました(2018.9/6)。

Vectorとか探せばもっと良いツールがあるかも知れませんが探していません。。

UserControlは超便利!


プログラムとしては、テキストボックスの内容を何らかのファイルに保存して読み書きする部分以外は「初めてツール作るよ」という人でも作れるくらい簡単だと思います。チュートリアルに向いているかもと思いました。

なにせツールの挙動周りでやってる主なことはこれだけです。

・CopyボタンでTextBoxの文字列をクリップボードにコピー
・ClearボタンでTextBoxの文字列を消去
・TextBox内で Ctrl+A を押すと文字列を全選択する
・ツール起動時にTexBox内にiniファイルから文字列を読み込む
・ツール終了時にTexBox内の文字列をiniファイルに書き込む


ただし大量に同じコントロールを配置していますが、これを私みたいな超初心者だと同じ命令をコントロールの数だけ根性で書いていきがちだと思います。そこを効率良く記述・管理するのに「UserControl」という機能を利用しました。こちら大変便利です!

ユーザーコントロールを作成する (C#プログラミング)

コントロールの集合体をまとめて1つのクラスにして、Form1に配置する際にインスタンスが生成される感じです。つまり下図のような1セットで1つのコントロールのように扱えます。

f:id:moko_03_25:20180905034136j:plain

こちらを利用すれば、Copyボタンの挙動、Clearボタンの挙動、TextBoxの挙動や文字列のiniからの読み込みと書き込みなどを、ひとつ分記述するだけで済むのでとても楽です。

一番最初は、それぞれの挙動を21個分ずらずらっと書いてました。こんな感じで‥。

f:id:moko_03_25:20180905033824j:plain

さすがにこれはひどいなと。。

UserControlのプロパティ


さて、UserControl内にコントロールを色々配置したは良いものの、ではTextBoxの文字列をForm1からアクセスしたい場合はどうしよう?と思いましたが、プロパティが便利でした。

// TextBoxの中身をプロパティでアクセス可能にする
[Browsable(true)]
public string TextBoxText
{
    get
    {
        return this.tbText.Text;
    }
    set
    {
        this.tbText.Text = value;
    }
}


このように記述すれば、Form1のデザイナーにUserControlを配置した際のプロパティウインドウにもちゃんと設定が表示されます。便利!

逆に隠蔽したい場合には Browsable(false) にしておけば良いようですね。

UserControlのクローズ処理


標準ではUserControl自身がクローズした際のイベントが用意されておらず、じゃあUserControl側からForm1のクローズイベントを受け取ろうと思っても、こちらも標準では用意されていないようで、ツール終了時にUserControl自身でiniファイルへ書き込むのに手間取りました。

ググると色んな方法があるようですが、こちらの記事で紹介されているコンストラクタ内でDisposeを使った方法が一番シンプルで良いと思います。

iniファイルのフォーマットは非常にシンプルです。こんな感じ。

[TextBox_00]
Text=A
[TextBox_01]
Text=B
[TextBox_02]
Text=C


[セクション]
キー = 保存する値

‥という感じです。

iniファイルへの書き込み・読み込みですが、セクション名をForm1に配置した各UserControl自身の名前にすることでやり取りをスムーズにしました。名前はTextBox_00~TextBox_20の21個になります。「this.Name」でUserControl自身がForm1に配置された際の名前を取得できます。

しかし、そうするとUserControlのコンストラクタで初期化時にiniから文字列を読み込みたくても、この時点ではまだ生成されてForm1配置時の名前が設定される前なので自身のインスタンスの名前を取得できません。

なのでコンストラクタではなく「userControl_Load」イベントでiniから読み込むようにするとうまくいきました。UserControlのクローズイベントは無いけどロードイベントはあったので助かりました。。

ただしDisposeでの終了時では「this.Name」で名前を取得しようとしてもすでにTextBoxが解放されているためか取得できません。そこで「TextChanged」イベントでTextBoxの内容が変わる度に変数に文字列を保存しておき、変数の内容をiniに書き込むようにすると大丈夫でした。つまり変数の値ならDispose時にちゃんと取得できたという感じです。

iniファイルを扱うクラス


今回、テキストの保存には初めてiniファイルを利用してみました。
ずっと以前から馴染みがある設定ファイルですし一度使ってみたかったんですよね。

ところが.netでは設定の外部保存はXML推奨みたいでiniファイルを扱うライブラリが用意されていないらしく、iniファイルを扱うための古いDLLを読んで、それを扱うためのコードを含めるのがちょいと面倒な感じでした。

iniファイルを扱うコードは検索すると色んな方の事例が出てきますが、こちらの記事の内容がシンプルで分かりやすかったので参考にさせていただきました!感謝です!

クラスを新規作成してこちらの記述をまるっと書くと良い感じです。
今回は文字列しか書き込まないので、読み書きのメソッドはstringのものだけにしています。

ただし二点注意があり、まずusingに下記の一文を追加する必要があります。

using System.Runtime.InteropServices;


また、iniファイルからは一行しか読まないため、改行部分「"\r\n"」を何かしら改行を表す文字列に置き換えてやる必要があります。

これはiniファイルを読み書きするメソッド内で置換を行うとなぜかうまくいかず、userControl内でTextBoxの文字列を扱う部分で置換させたら素直にいけました。

こんな感じです。

// 定数
// iniファイルで改行を表す記号をここで定義
const string rn = "<rn>";

// iniファイルからの読み込み
string s = ini.getValueString(myName, "Text");
// 独自の改行記号を改行に置換
tbText.Text = s.Replace(rn, "\r\n");

// 改行を独自に定義した改行記号に変更
myText = tbText.Text.Replace("\r\n", rn);


iniファイルの良いところは中身の記述がシンプルな点で、ユーザーがテキストエディタで開いた時に項目が一目で分かり編集しやすいところですね!

逆に言えば想定しない編集をされてしまう危険性もあると。。

お次はjsonファイルを試してみたいと思っています。

タブコントロールの利用


タブは標準では背景色を変えるプロパティが無いなど色々不便です。
そしてググっても情報もあまり出てきません。

ツール起動時にiniファイルの文字列を各タブの名前に設定する方法が軽くググっても出てこなかったのですが、「Form1_Load」イベントに下記のように記述するとうまくいきました。

private void Form1_Load(object sender, EventArgs e)
{
    // iniファイルを扱うクラスのインスタンスを生成
    nifileUtils ini = new InifileUtils();

    // iniファイルからタブ名を読み込んで設定
    tabControl1.TabPages[0].Text = ini.getValueString("Tab0", "Text");
    tabControl1.TabPages[1].Text = ini.getValueString("Tab1", "Text");
    tabControl1.TabPages[2].Text = ini.getValueString("Tab2", "Text");
}


タブコントロールにはページをいくつも増やせるため、各ページの情報はコレクションの形で格納されているようです。なので TabPages[0] のようにindexを指定した上で .Text と続けてやればタブのボタン部分の文字列のプロパティにアクセスできました。

以上、色々と詰まったところなどでした。