このブログについて
当ブログは、プログラミングの知識の全く無い管理人が、ゲーム製作ツールである「CF2.5(インディゲームクリエーター)」を使ってゲーム製作していくのを眺めるブログです。
ゆる~く更新していきますので、放置系ゲーム感覚でお暇な時にお楽しみ下さい。
また、当ブログはリンクフリーです。
お気軽にリンク頂けましたらとても嬉しいです(*´ω`*)
http://vobo.hatenadiary.jp/ *リンク先はこちらにお願いします
ゲーム用のフリー素材をアップ致しました。
上記リンクか、カテゴリー「フリー素材」より御利用下さい。
使って頂けると嬉しいです(*´ω`*)
☆NEW☆2016/02/07
フリー素材に、
「シラカバ風の木」「リンゴ」を
アップ致しました。
アンリアルエンジン(UE4)について
突然ですが、アンリアルエンジン4(以下UE4)を触り始めました。
おそらく世間では認知度においてCF2.5よりも高いと思われます。
ご存知無い方の為に申し上げますと、
アンリアルエンジン4=通称UE4は、epic社より2017年11月現在無償で提供されている3D、2Dゲームエンジンです。
*厳密には一定の売上が発生した場合にロイヤルティの支払い義務が発生しますが、ただ使う分には無料です
DLして約1時間、チュートリアルに従って操作していたところ、下の動画のような物を作る事が出来ました。
ぶっちゃけ脳汁噴出レベルの感動があります。
幼少期に憧れていたCGグラフィックを遥かに凌ぐレベルの物をこんなに簡単に作れる時代になっちゃったんですね。
とはいえ、マスターするのは明白に難易度高そうな臭いがプンプンします。
これはステージの編集画面ですが、(CF2.5でいうとフレームエディタ?)
半端ない情報量、及び半端ないクピポ?感。
この時点で圧倒的な美麗グラフィックに魅かれたゲ製ドリーマーの心を蹂躙するに足りる破壊力があります。
チュートリアルを見ても、出てくる言葉の半分以上は意味が分かりません。
んじゃあそんな高いハードルに何で挑んでみるのか?という事ですが、
UE4を触る本当の目的はこれです。
まだ何にも触ってないので、何のこっちゃ分かりませんが、UE4の最大の売り(らしい)『ブループリント』というシステムです。
ざっくり言えば、
プログラミングの知識無しでも超ハイレベルな3D(2D)ゲームが作れちゃうよ!
ってシステムだそうです。(勿論プログラミング言語による作成、拡張は可能)
CF2.5と大分勝手は違いそうですが、同じコンセプトですね。
まあ、コーディングが出来なくても作れます!でもプログラミングの基礎知識は必要です♪って事なんじゃないかなとは思っていますが…
ともあれ、ノンプログラマーでも2Dゲームを作れるソフトに、比較対象があったって事を知りましたので、どっちが楽に作る事が出来るのか?を知る為にも試しに触ってみようと思った次第です。
まだゲーム部分は全く触っていませんので、実際のところどうなのか?
分かったらまたレポートさせて頂こうと思います。
では!
CF2.5でDOF(被写界深度)を表現してみる
今日は小ネタ更新です。
さて皆様、被写界深度ってご存知でしょうか?
上の写真を見ると、被写体になっている向日葵はクッキリ写っていますが、後に並んだ向日葵はボケて写っていますね。
超ザックリ言うとこれが被写界深度という奴です。
最近の3Dゲームでは「DOF=depth of field」などと呼ばれて、遠近感の表現として標準装備されているものが多くなってきましたね。
今回は、この「被写界深度」効果を手軽にCF2.5で表現できないか?やってみようと思います。
静止画で見てみると、
こんな感じです。
ちょっとだけボケているのがわかりますでしょうか?
勿論、元になるオブジェクトは等身大のオブジェクトと同じ物です。
…とっても残念クオリティですが、特殊なペイントソフト、エクステンション無しでの作り方を紹介します。
手順①元になる画像をクローンして拡大
これは文字通り、小→大サイズに拡大してやる事で、解像度が下がりこの時点で若干ボケてくれます。
手順②専用のレイヤーを作り、スクロール係数を調整
手前にあるオブジェクトなので、ステージ部分よりも左右スクロールを早くしましょう。
専用レイヤーをクリックしてプロパティで調整。今回のgif動画では1.3倍速を選択。
手順③ピンボケオブジェクトをコピペ。左右に重ねる
一応これが今回の肝になる部分です。
画像のような重なり順で、左右に少しだけハミ出るように調整します。
そうして出来た物(左)と、拡大しただけで重ねていない物(右)とを並べてみました。いかがでしょう?
…ちょっとだけボケているのがわかりますでしょうか?
実に心元無いボケ感ですが、他のソフト、エクステ要らずという事で、宜しければ使ってやって下さい
それではまた!
オブジェクト間の直線距離を測ってみる cf2.5で三平方の定理
さあ、タイトルだけで文系脳の私達にとっては脳が爆発四散気味ですが、今回は以前の三角関数講座の続き、二つのオブジェクトの直線状の距離の求め方に関するお話です。
具体的には二つのオブジェクト間の
ここ
この距離が一体何ピクセル離れているか?を計算する方法を探ってみよう、という事になります。
今までの三角関数講座記事から、X軸、Y軸の距離は簡単に求められる事が分かっていましたが、直線状の距離に関してはノータッチでしたね。
X軸距離「a」は、右オブジェクトのX座標から左オブジェクトのX座標を引いた値
Y軸距離「b」は、右オブジェクトのY座標から左オブジェクトのY座標を引いた値
でした。
じゃあ、直線距離はどう計算すんの?って事ですが、実は既にCF2.5wikiに答えが出ております。
テクニック集/2つのオブジェクト間の距離を取得する - Multimedia Fusion 2 Wiki*
これによると、計算式は以下のようです。
sqr((X("Object")-X("Target"))pow2+(Y("Object")-Y("Target"))pow2)
**公式はwikiより引用**
…くっ……
くぴぽ?
となってしまった方は私だけでは無いはずです。まず()の多さに加え、sqrとかpowとか見た事無い英語に心の扉も閉じっぱなしってなもんです。
というわけで、この記事では先人の残してくれた公式を、理解して使いこなす為の解説回となります。前回同様、数学的な正しさは一秒も保障出来ない事をご承知の上で宜しくお付き合い下さい♪
理解の為の手順①三角形に置き換えて考えて見る
ここで、さっきの図を三角形に置き換えて考えてみましょう。
何故そうするか?大人の事情です。
するとどうでしょう、よく見ると、直角三角形の斜辺の長さを測ればいいんじゃね!?って事が分かりましたね!狂ったように三角関数を調べ続けた甲斐があったってもんです。
理解の為の手順②三平方の定理を理解してみる
さあ、「斜辺の長さ」というキーワードが分かれば後は簡単です。
大人のリテラシー能力を駆使してググりましょう!そうすると、中学当たりでうっすら習った気がする、『三平方の定理』という公式で求められる事が分かります。
それによれば、
a2 + b2 = c2
つまり、斜辺の長さを2乗した数字が、辺a、bを2乗した数字の合計と一致するんだそうです。何でそうなるのか?という事に関しては詳しいサイト様で各自調べましょう!
理解の為の手順③CF2.5の座標計算を公式に当てはめてみる
辺a,bに関しては、二つのオブジェクトのXY座標を使って簡単に求める事が出来ましたね。それでは、三平方の定理に座標計算の式を当てはめて考えてみましょう。
*以下、右オブジェクトを㊨ 左オブジェクトを㊧と表記
a2 + b2 = c2
この式が、
(㊨X座標ー㊧X座標)の2乗 +(㊨Y座標ー㊧Y座標)の2乗=斜辺cの2乗
という事になりますね。
ここで一つ、数式を覚えておきましょう。
『POW』というものです。
POWは「累乗」を表す数式になります。
例えば、「3POW2」と記述すると、3の2乗である9が返ります。
「3POW3」と記述すると、3の3乗である27が返ります。
これを踏まえて、先ほどの式を数式で表してみます。
(㊨X座標ー㊧X座標)POW2 +(㊨Y座標ー㊧Y座標)POW2=斜辺cPOW2
と、いうように、大分wikiの公式に近づいてきましたね!
それでは、最後に、斜辺cの数字を求めましょう。
理解の為の手順④斜辺aを求める数式を理解する
辺a(X軸の差異)を2乗したものと辺b(Y軸の差異)を2乗したものの合計値は上の公式で簡単に出てきますね。
ここで厄介なのは、2辺abの2乗の合計が、斜辺cの2乗である事。
つまり、2辺abの2乗の合計が仮に「9」だとしたら、これを2乗する前の数字に直してやらねばなりません。
ここで覚えるべき数式が『sqr』です。
sqrは、「平方根」という物で、「ルート」とも言います。「√9」と表すと思い出す方も多いんではないでしょうか?
sqr( )と記述する事で、()内の数字を2乗する前の数字を返します。
例えば、sqr(25)と記述すると、25を2乗する前の数字「5」が返ってきます。(5×5=25)
それでは、これも踏まえて、先ほどの公式を書き換えてみましょう!
この状態から
(㊨X座標ー㊧X座標)POW2 +(㊨Y座標ー㊧Y座標)POW2=斜辺cPOW2
こう書き換えてみます。
sqr((㊨X座標ー㊧X座標)POW2 +(㊨Y座標ー㊧Y座標)POW2)=斜辺c
式の左側を「sqr」で囲った事で、斜辺cを2乗する必要が無くなった事が分かるでしょうか?これで後は斜辺cを変数に代入してやれば、二つのオブジェクトの直線距離を求める事が出来ます!
こんな風に記述してやる事で、二つのオブジェクト間の距離を常に取得する事が出来ます。
直線距離を記録した変数をカウンターで表示させてやると、
こんな感じです。ちゃんと計算されていますね!
この直線距離計測を応用する事で、
「絶対当たる放物線軌道の攻撃」とか、「常に最短距離にいるオブジェクトをサーチする攻撃」なんかも出来るようですね。
ただ、前者の放物線軌道は、海外のユーザーさんがアップしたイベントサンプルを拝見したのですが、計算が高度過ぎて、一秒も理解出来ませんでした♪
お願いします、誰か私に教えてくだせぇ…
cf2.5 暗闇表現的な物の作り方
記念すべき当ブログ100記事目のタイトルが「暗闇」という、不穏な空気を垂れ流しながら本日も更新していきます。
超絶不定期更新のこんなブログですが、いつも閲覧してくださったり、コメント頂いたりした方々、励みになっております。今後とも宜しくお願いします!
さて今回の記事のテーマはこんな演出処理です。
横スクロールアクションでよくある、
「プレーヤーの周囲だけ明るくする事で、視界を表現する」という演出ですね。
動画では若干サーチライトっぽくなってしまっていますが。
一見難しい表現ではないか、と思ってしまいがちですが、非常に簡単な作りになっています。このやり方では外部エクステンションも一切使いません。
手順①ベースとなるフレームを作る
動作は「ジャンプとはしご」でも*1「PMO」でも動けばどちらでも構いません。
*1 Platform Movement objectの略
手順②「視界」表現用のオブジェクトを作る
画面を縮小して表示してみました。
作成するのは、上に表示されているオブジェクトです。
ポイントは、まずベース色をフレーム背景と同色に設定し、円形で抜きましょう。
同時に、抜いた円の中心にホットスポットを必ず設定します。
また、オブジェクトのサイズは必ず画面サイズ以上の大きさに設定しましょう。
と、ここまででもう何となくお察しかと思いますが、要は、
巨大な暗闇オブジェクトを常時プレーヤーに追従させる
という仕組みです。それでは最後にイベントで位置を設定しましょう。
手順③「視界」オブジェクトの位置を常にプレーヤー位置と同期させる
必要なイベントは1行だけです。
はいこれだけ!
とりあえず最低限、暗闇と視界を表現するだけならこれだけで出来ちゃいます。
最後に、ちょっとした発展型のご紹介です。
発展型 明かりを表現してみる
まずは、明かりを表現するオブジェクトを作成。
半透明のエフェクトをかけ、数字を調整します。
次に、明かりの明滅をこんなイベントで表現してみます。
0.25秒毎にフラグを切り替え。
フラグが切り替わる毎に、明かりのサイズが変化するようなプログラムですね。
位置を暗闇オブジェクトと同様、プレーヤー位置に同期させます。
再生するとこんな感じです。
ちょっとそれっぽくなりましたね!
結構簡単に出来て応用の利くイベントだと思います。
他にも処理が軽かったり、簡単なやり方があるかもしれませんが、とりあえず実装したい方は是非使ってやって下さいな。
それでは!
雑記 ゲームレビュー 『サイコブレイク』シリーズ
ここ1週間程絶賛活動停止中の大福島です。
ゲームブログがゲームも作らず何をしていたのか?と申しますと、
この2本をプレイし続けています。
steamでは洋題の『the evil withiin』となっていますが、日本では
『psychobrake』として販売されていますね。
*以下、この記事ではsteam版も「サイコブレイク」と記載します
実はサイコブレイク1が発売時、予約購入していたのですが、有名な「PC版日本語削除事件」、プレイアビリティの低さにより、積みゲーと化していたのですが、2がPC版も日本語有りで発売された事を知り、改めて2→1の順にプレイし直してみました。
*現在も1はDLC含めて日本語データはありません
この点だけは本当に残念…
結論から申しますと
どっちも買いだと思う
純粋にゲームとして遊びやすくなった2、ホラー映画のような雰囲気重視の1、という感じでどちらも非常に楽しめました。
発売当初は中々プレイに難のあったプレイアビリティもアプデでかなり改善されており、PC版でプレイする限り、殆どストレスは感じなくなっておりました。
ビバ!Tango Gameworks!
という事で、プレイ感覚やゲームの特徴なんかは他の有名サイトに詳細な記事がありますから、このブログでは雰囲気やアートワークに関する部分をレビューしてみたいと思います。
まず、ザックリと申しますと
という価値観を持っている方にお勧め出来ます。
日本製ホラーゲーム2大巨頭を例に出せば、雰囲気としてはサイレントヒル寄りだと思われます。
勝手なイメージですが、
バイオハザードシリーズが、「実際こんな凶悪なウイルスがあったら、世界がこんな風に荒廃して、生物がこんな感じに進化するよね」
っと、割と理論を基に世界観を構築しているのに対して、
サイレントヒル・サイコブレイクシリーズは、「多分、大多数の人はこういう造形、こんな組み合わせに生理的な不快感・恐怖感を感じるよね」
っと、イメージ先行で世界観を構築している気がします。
なので、
現実感は不要。とにかく悪夢のような世界に没入したい
という人にとっては1.2共に逸材だと思います。
特にサイレントヒルシリーズが終了してしまった今となっては、このテイストの大型ゲームは貴重。
Tango Gameworksさんには、是非シリーズ化して太く長く続けていってほしいものです…
最後に、サイコブレイクを初めてプレイする場合に、1を飛ばして2から初めても大丈夫なの?って点に関して、私なりの意見で御座いますが、
『2から初めて問題は無いけど、ストーリーを重視するなら絶対1から始めた方がいい!』
っと思います。
1をSTEAMで購入する場合、日本語化は出来ませんが、今なら攻略サイトが充実し、日本語字幕版の実況動画も溢れていますので、とりあえず英語版で進めて、チャプター毎にインターネットを通じて日本語を確認すれば、十分にストーリーは理解出来ます。
というわけで、悪夢系ホラゲー好きの方には買って悔い無しの出来になっております。
購入を迷っておられる方は是非プレイしてみてはいかがでしょうか♪
雑記 最近購入したゲーム
先日、紹介文に惹かれてアイフォンアプリ『Sprinkle Islands』を購入しました。
ゲーム画面はリンク先をご覧頂くとして、詳細な内容としては、
プレーヤーは消防士として消防車を操作し、左手スワイプで放水ロープの高さを。
右手タップで 放水。
ステージ上のあちこちに燃え広がる炎に放水し、全ての炎を鎮火したらステージクリア、というシンプルなシステムのアクションパズルゲームでした。
物理エンジンが搭載されており、水の力で岩を動かしたり、架け橋を水流で倒して、消防車が通る為の道を作ったりと、ステージが進むにつれて一筋縄では消火活動出来なくなっていきます。
見た目の可愛らしさに似合わず、割と難易度は高いような気がします…。
このアプリをプレイして思ったのは、
物理エンジンなんぼ進化してんねん
って事。
アプリの目玉になっている「水」の動作が非常に良く出来ています。
PCや据え置き型ゲーム機ならともかく、もう今や携帯電話アプリでここまで精緻な物理エンジンを搭載出来るんですね…
案外「水」のリアルな動きをメインに据えたゲームって無かった気がします。
ビバ水物理!
ちょっと変わった物理動作系のパズルゲームをお探しの方にはおすすめです♪
追記
ガチの「水」物理エンジン動画を発見しました。
もう実写でいいとおもう
早くこのクオリティのエンジンでゲームしてみたいっすね!
*これを動かせる環境を買えるとは限らない
CF2.5 体力ゲージの作り方
今回はこんな処理の解説です。
おなじみ体力ゲージの実装の仕方に関して簡単に解説します。
上の例のような動作に必要なイベントは以下の通りです。
すくなっ!!
という感じですが、この体力ゲージの動作自体はCF2.5本体で用意されているので、必要なイベント自体は非常に少ないんですね。
次に必要なオブジェクトを見てみましょう。
今回私が準備したのはこの二つだけです。
上の実際に伸縮するゲージ部分は実は「カウンターオブジェクト」。
下は適当に作ったゲージ外枠用の「アクティブオブジェクト」です。
カウンターオブジェクトというと、指定した変数の中身を数字で表示するだけ、というイメージがありますが、プロパティをいじると色々な形で数値を表現してくれる優れ物です。
カウンターオブジェクトをクリックで選択→プロパティを表示して、
赤丸で囲った部分をクリック。
今回は「水平バー」を選択しました。
後は上下の項目に詳細を設定します。
「カウント」の項目では、ゲージが増減する際に、左右どちらを起点にするかを選択。
「塗りつぶし」「色」の項目でゲージのビジュアルに関して設定します。
説明を省いた「初期値」「最小値」「最大値」ですが、ゲージの元となる数値が変数にヒモづいているケースの場合は結論設定不要のようです。
これはおそらくカウンター単独で動作させる場合に必要な数字なのでしょう。多分。
*画像では設定していますが、変数とヒモ付けしていれば設定不要である事が判明しました。
今回の解説はここまでとなります。
カウンターの種類を色々変更する事で様々な表現が出来るのですが、その辺はまた別の機会に♪
CF2.5 ホーミングミサイルの作り方
さあモチベーションが一向に上がってきません。
どうしましょ。
というわけで、更新をお休みしていた期間、全く製作が進みませんでした。
もう何というか、
私って一生完成させられない人なんじゃないか
という疑念がツチノコの如く首をもたげているんでありますが、
そう言っていても何も進歩もありませんので、ちょっとした作り方講座でもアップしていこうかと思います。
今回はこんな動作の作り方になります。
二つの動作を実装しています。
①猫が緑のオブジェクトの方向を常に向く
②ミサイルが角度を変えながら常に緑のオブジェクトを追い続ける
どちらもシューティング系のゲームでよく見られる動きですが、まずイベントを見てみます。
補足として、緑のオブジェクトはマウスカーソルに常に張り付くように動作させています。
ではまず猫オブジェクトがマウスの方向を見る処理です。
『Atan2(アークタンジェント)』の使い方が分からない方は、まず過去記事を参照してみて下さい。
まずは、常時実行でマウスカーソルの位置と猫オブジェクトとの角度をアークタンジェントを使って、変数に格納します。
次に、猫オブジェクト自体の角度を、マウスとの角度に「マイナス1」を乗じた数値に変換させてやるわけです。
角度を用いる事はイメージしやすいと思うのですが、一体何故マイナスを乗じる必要があるのか?
残念ながら私も理解していません。
管理人は算数が非常に苦手だからです…
ともあれこれによって猫オブジェクトを常にカーソルの位置に向かせる事が出来るわけですが、注意点が一つ。
回転させるオブジェクトの基本の向き(対象と正対した時の向き)
は、「右向き」に設定してやりましょう。
これを間違えると、狙った通りに動いてくれません。
続いて、ミサイル側のイベントです。
これも、ミサイルの角度を変える部分は猫オブジェクトと全く同じ処理をしています。
常時対象を追い続ける部分に関しては、過去記事に実は書いています。
という事で、一見難しそうなホーミング攻撃ですが、
「自機狙い弾」の動きと、「オブジェクトの角度変更」の基本が分かれば実装出来ます。
是非作ってクルクル回して遊んでみましょう♪
ただし、CF2.5のオブジェクトの角度変更は、グラフィックが崩れるという、致命的な欠点があるのですが、これに関する対策を私は知りません…
誰か知っていたら教えて下せえ…
コメント機能の意義
あれっ?数日ぶりにフレーム再生してみたら思った挙動と違う…
どれ、イベント内容の確認でもしてみるか…
↓
やだ…私計画性無さ過ぎ!?
どの行で何を処理しているのか分からない…
どの変数で何が変わるのか分からない…
↓
もういい、やめぽ。寝よう
ハイ、私の事です。
結構あると思うんですが、一度自分で組んだはずのイベントが、数日経って見返すと、もうわけが分からない…
誰かが「1週間経つと他人のコード」と仰いましたが正にそのとおりだと思います。
というわけで、今日はインディゲームクリエーター(CF2.5)での『イベントの可読性』を高める方法の考察です。
■最も可読性が高くなるイベントエディタは?
CF2.5にはフレーム、オブジェクト、グローバルの3つのイベント入力エディタが備わっていますが、内最も可読性(後からイベントを読み返した時に、どこで何をしているかの分かりやすさ)が高くなるのはどこか?
それは間違いなくフレームエディタだと思います。
何故なら、
イベントリストエディタで表示出来るから
です。
画像のように、イベント条件に対するアクションが一覧で表示される為、どこで何を処理しているのかがリスト状で表示される為一目で分かり、かつイベント順の入れ替えも容易です。
ですが、この機能は残念ながらフレームイベントにしか適用出来ない為、オブジェクト、或いはグローバルイベントに組んだイベントをリスト化する事が出来ません。
じゃあそっちに組んだイベントはどうやったらいいのか、という事ですが、これには二つやり方があると思います。
①最初からフレームイベントで設計して、後からグローバル、オブジェクトイベントに移行してやる
②デバッグ用のフレームを用意して、フレームイベントにコピペしてリスト化する
私の場合は、デバッグ兼新規オブジェクト開発用のアプリケーションを別に用意して、そこのフレームイベントで先ず作成、9割完成してから本体のグローバル、又はオブジェクトイベントに戻して調整しています。
■コメント機能をフル活用しよう
上の画像は私が現在開発しているゲームのイベント画面です。
他人に見せる為に作っているのか?と言わんばかりにコメントを打っております。
イベントを組んでいる時は今自分が何の動作を処理しているのか認識しているので、こんな作業はバカらしいと思いますが、数日後に見返すと本当に他人が作った物かのように何をしているのか分からなくなります。
しつこいくらいにコメントに「当時考えていた事を記録する」事で、デバッグや、動作を拡張する時に大いに役立ちます。
少し面倒ですが、凝った処理をしようとすればする程、未来の自分に向けてログを残す事は重要だと思います。
いつも自分の作ったイベントに苦しめられている…という方は是非やってみて下さい♪