ニコ生ゲームを作ろうと思ったらすぐ作ろう その１
この記事ではニコ生ゲーム（ニコニコ新市場対応コンテンツ、ニコ生ネタ、生ゲーム、生ゲ、ニコゲー）の作り方を解説していきます。
ニコ生ゲームはニコ生で放送者と視聴者が一緒に遊ぶことができるゲームです。他のゲーム公開プラットフォームと比べて以下のような非常に魅力的な点があります。
筆者はいくつかニコ生ゲームをリリースしていますが、プログラミングを本業でやったことはありません。
プログラミングに関する詳細は、専門家の方に任せて基本省略します。素人目線でニコ生ゲームリリースにたどり着くことを意識して解説をやっていきます。
一連の解説の全体像はこのようになる予定です。
まず開発が用意しているサンプルゲームを改造して、リリースするところまで行きます。
手順を真似して習得してもらってもいいですし、パラパラ眺めるだけでもいいです。
- 開発準備 ＆ サンプルゲーム起動 ← この記事です
- サンプルコードの数値を変更する
- サンプルコードに表示を追加する
- サンプルコードにゲーム要素を追加する
- サンプルコードの見た目を変えて別のゲームにする
- ニコ生ゲームとしてリリースする
実際にはサンプルゲームの改造だけでは、新しく作るゲームに対応できないですね。
その後は色んなタイプのシンプルなゲームを作って、その中身を紹介していきます。
- クリックして得点を集めるゲームを作る
- キャラクターが移動するゲームを作る
- タイミングよくクリックするゲームを作る
etc..
これらのゲームを改造して、また新しいゲームを作れればと思います。
しかし、体系的でない流れになるので、別途まとめとして以下の記事も予定しています。
- 記事の目次 こちら
- やりたいことー記載例 対応表
[2021/6/2追記]
公式の逆引きリファレンス（やりたいことー記載例 対応表）が公開されました！
https://akashic-games.github.io/reverse-reference/v3/
また、ここの記事ではなく公式の入門記事で一通り機能に触れる方法もあります。
こちらのリンクへどうぞ。
https://akashic-games.github.io/tutorial/v3/
https://akashic-games.github.io/shin-ichiba/
前置きが長くなりましたが、この記事では以下の２章をやります。
開発の準備を整え、最終的にサンプルゲームを起動する所まで行きます。
■目次
【開発準備】
- Node.jsインストール
- コマンドプロンプトを使う
- Akashic Engine のインストール
【サンプルゲーム起動】
- 保存場所
- ダウンロード
- 起動テスト
【開発準備】Node.jsインストール
はい！ Node.jsという文字を見て「なんか難しそう」と思ったあなた！
ちょっと待ってください！
これが何なのかは知らなくていいし説明しません。何より私が知りません。
下のサイトの「LTS 推奨版」をダウンロード・インストールしてください。
間違って「最新版」をインストールしても多分問題ありません。
わけのわからんものをインストールできるか！
という方は大変ごもっともなので公式の記事を見てやってください。
逆に「Node.jsが難しそうとか何いってんだこいつ」と思った方には、
私の説明は冗長になると思います。
どんどん読み飛ばすか。公式の記事を読んでもらえば十分理解できるはずです。
【開発準備】コマンドプロンプトを使う
インストールが上手く行ったかどうかを知るには「コマンドプロンプト」(Windowsの場合)を使います。コマンドプロンプトはこのあとも頻繁に使うのでやってみましょう。
コマンドプロンプトの使い方詳細は一般の解説サイトに任せますが、初回は以下の起動方法でいいでしょう。
- 「Windows」キー を押しながら 「R」キー を押す
- 「cmd」と入力して 「Enter」キー を押す
コマンドプロンプトは下のような見た目のやつですね。毎回のように使うのでどこかにピン留めやショートカットしておきましょう。
では、Node.jsとやらがインストールされているか確認しましょう。
以下の呪文を唱えます。（コマンドプロンプトに入力してEnterをおします）
node -v
下のような雰囲気の数字が出たらインストール成功です。数字は時価です。
いまならv14とかになってるはず。
【開発準備】Akashic Engineインストール
Akashic Engineはドワンゴが作ったものっぽいので、一応形だけでも使わせていただけることに感謝しておきましょう。
私のような素人が説明して万が一間違いがあると良くないので、これが何なのかの説明は省略します。
さっきのコマンドプロンプトを使って、以下の長い呪文を入力してインストールします。
npm install -g @akashic/akashic-cli
コマンドプロンプトは右クリックから貼り付けをすることができます。
Ctrl+Vはできません。
ちょっと時間がかかりますがこんな感じの呪文がかえってきますね。
何が書いてあるんでしょうか。もちろん説明しません。警告メッセージが出ている？ ふーんそうなんだ。
もう一つ呪文を入力します。これはなんか別のやつです。（なんで別々なんだよ・・・）
npm install -g @akashic/akashic-sandbox
以下の２つの呪文で同じようにインストールの確認をすることもできます。
めんどくさかったら無視してしまって、後でおかしなことがあったらやってください。
akashic -V
akashic-sandbox -V
【サンプルゲーム起動】保存場所
これからサンプルゲームをダウンロードするので、保存場所を決めましょう。
Cドライブの直下などにニコ生ゲーム用フォルダ「namage」をつくり「sample」というフォルダにサンプルゲームを入れることにしましょう。
C:\namage\sample
フォルダ名は好きにしてもいいですが文字数少なめで打ちやすい名前がいいですね。
漢字と仮名をいれるのはやめておきましょう。
【サンプルゲーム起動】ダウンロード
サンプルゲームのダウンロードもコマンドプロンプトでやります。
まず、コマンドプロンプトでさきほど作った保存場所に移動します。
移動には「cd (半角スペース)」と入力してから、sampleフォルダをコマンドプロンプトにドラッグアンドドロップして、Enterします。
cd
移動ができるとコマンドプロンプトにこのように表示されます。
そして、ダウンロードを始めるために以下の呪文を入力します。
akashic init -t javascript-shin-ichiba-ranking
そうするとゲームの「幅」「高さ」「fps」の３つを聞かれます。ダウンロードをしつつ初期設定もやってくれるわけです。そのままEnterを押すか、自分で入力します。
ゲームの 幅x高さ は640x360などの16:9が無難です。今回は1280x720にしてみます。これはあとから変えられますが、最大は1280x720です。
私は最初に768x432をよく使っていましたが、公式が提供しているキーボード素材が1280x720だったので最近はそちらに合わせています。
fpsは30でいいでしょう。60も一般的にはよく使われますが、重いゲームでは処理落ちしやすくなります。
さきほどのsampleフォルダにファイルがダウンロードされているでしょうか。
【サンプルゲーム起動】起動テスト
いったい何をダウンロードしたのか気になりますが、
そんなことよりゲームを起動しましょう。
起動にはコマンドプロンプトに以下の呪文を入力します。
akashic-sandbox
こんな文字が出ていれば起動に成功しています。
そして、ブラウザ（Chrome、Firefoxなど）で以下のURLにアクセスします。
せっかくなのでブックマークしておきましょう。
下のようなキャラクターが表示されたでしょうか。
クリックで射撃もできます。射撃ごとに得点が上がり、時間制限もあります。
上の呪文がうまく行かない人もいるようです。その場合は下のプランBでやってみましょう。
akashic serve -s nicolive
これは本来マルチゲーム用ですが、普通に使えるみたいです。
テスト起動をやめる時はコマンドプロンプトでCtrl+Cを押すとやめるかどうか聞かれます。
y をおして Enter をおすとやめられます。
終了
ゲームの起動に成功しました。一旦この記事は終了です。
次回からこのサンプルゲームの改造として数値を変更していきます。
