5.1さらうどん

@giginetの技術ブログ。ゲーム開発、iOS開発、その他いろいろ

究極のレトロゲーコンソール『RetroN 5』ファーストインプレッション

f:id:gigi-net:20140610145614j:plain

究極のレトロゲーム互換機、『RetroN5』がついに届きました!プレオーダーしてから9ヶ月。長かった!

RetroN 5 |

試しに遊んでみたら、想像以上に良いハードウェアだったので、是非皆様にもこの素晴らしさをお伝えしたいと思ったので、記事にすることにしました。

RetroN 5とは

5スロット9機種互換レトロゲーム機 RetroN 5、ファミコン / NES / SFC / MD/ GBA でステートセーブ可能 - Engadget Japanese

超高機能なレトロゲーコンソールです。

主な特徴は以下の通り。

このように、コンセプト段階から機能があまりにも豊富で、期待度が高いガジェットでした。

購入まで

昨年の3月ぐらいに商品化が決まってから、Pre Order開始まで情報を追い続けていました。

昨年の9月になって、ようやっとAmazon.comでのPre Orderが開始したので速攻で予約。国外配送も可能とのこと。 価格は日本への送料を含め$98ほど。

Amazon.com: Hyperkin RetroN 5 Retro Video Gaming System - Gray: Video Games

当初は昨年11月に発送予定だったのですが、今年1月に伸び、さらに延期。

そのままずっと音沙汰がなかったのですが、先日になってようやっと配送されました。 当初、昨年の夏ローンチ予定だったのに待ち続けること1年以上!長かった。

開封の儀

注文してから延期を重ね9ヶ月、ようやっと昨日届きました。うおおお。

f:id:gigi-net:20140609085635j:plain

開けてみる。海外製なので箱が潰れてる。雑だ・・・・・・。

f:id:gigi-net:20140609183617j:plain

micro-USBや、HDMI、日本向けのACアダプタなども最初から同梱されているので、買ってすぐに使えます。低価格なのに嬉しい。

実際に遊んでみる

上から見た図。上(奥)から順番にMD(Genesis)、SFCNES(北米版ファミコン)、FCの4スロット。手前にはGB/GBAのスロットが。

f:id:gigi-net:20140609194627j:plain

マスターシステムで遊ぶには専用の端子が必要らしい。

f:id:gigi-net:20140609190704j:plain

とりあえず手持ちのソフト何本かで検証。

起動後のメニュー画面。設定でスキップさせることもできます。

f:id:gigi-net:20140610145932j:plain

まずはファミコン。個人的神ゲーの『ランパート』。

f:id:gigi-net:20140609191410j:plain

次にGBA。『チューチューロケット』。

f:id:gigi-net:20140609192205j:plain

一応メジャーなのも遊んでおくかー、と思って『ポケットモンスター サファイア』を起動。問題なく遊べますねー。素晴らしい。

f:id:gigi-net:20140609192340j:plain

最後にメガドライブ。『サンダーフォースⅣ』を起動。メガドライブだけ、やたらと端子が堅くて、刺すのも抜くのも一仕事。壊したのかと思ってビビる。

f:id:gigi-net:20140609192615j:plain

さすがにHDMI出力なのでどのゲームもめっちゃ綺麗。大画面で遊んでも全く問題ありません。

GBとSFCはパッと出てこなかったので検証していません。SFCのソフトどこかにあったはずなんだけどなぁー。

スターフォックス』や『スーパーマリオRPG』といった、特殊チップを積んだゲームにも、対応している様子。実機を持っていなかったので検証できなかったのですが、今度試してみます。

唯一残念な点として、5つあるスロットのうち、2ヶ所以上の端子にカートリッジがあると、エラーが出て起動しないこと。 複数さして置いてメニュー画面で選択できると嬉しかったんですが・・・・・・。

コントローラー

お次はコントローラーの話。

付属のワイヤレスBluetoothコントローラーがあるので、とりあえず遊ぶだけならすぐに遊べます。

f:id:gigi-net:20140609190202j:plain

しかし、このコントローラー、お世辞にもあんまり使いやすくなくて微妙な感じなのですが、外部のBluetoothコントローラーで自由に拡張可能らしい。

オマケにNESSFC、MDのコントローラーポートが計2つずつ。合計6つ。実機のコントローラーも使えます。

f:id:gigi-net:20140609185801j:plain

繋いでみた。ご存じ、日本版のFCはコントローラーの取り外しができないので、このポートはおそらくNES(北米版ファミコン)向けかと。さすがに手持ちにコントローラーがなかったので検証できず。

f:id:gigi-net:20140609192814j:plain

コントローラーは最大で5台まで接続可能で、SFCのマルチタップを使うようなゲームにも完全対応。これだけで『ボンバーマン』などの5人プレイが遊べます。

さらに凄いことに、全てのコントローラーを相互に利用可能。ファミコンのゲームをメガドラのコントローラーで遊んだり、自由自在。至れり尽くせりですね。

キーマッピングも自由自在で、プリセット登録まで対応。 余ったボタンにステートセーブや早送りなどのマクロを割り当てておくこともできます。

セーブデータとステートセーブ

素晴らしいと思ったのがセーブデータの仕様。まず、カートリッジにセーブデータがあるソフトを初回起動すると、自動的にセーブデータがSDカードにインポートされる。 さらにSDカードに保存したセーブデータとカートリッジのデータをいつでも自由に読み書きできます。

f:id:gigi-net:20140609192305j:plain

そして、全ゲームでステートセーブ/ロードが可能。スロットも複数箇所あって、前述の通り、マクロで一発呼び出し。

神設定だと思ったのが、自動ステートセーブ&ロード。設定しておくと、次回起動時に自動的に前回終了したゲームが読み込まれ、つづきから遊べます。もちろんソフトごとに保存される。

各種設定

設定もムダに充実。グラフィックの表示モードを切り替えたり、オーディオ周りの設定をしたり・・・・・・。

f:id:gigi-net:20140609195210j:plain

リージョンも設定できるので、海外製のソフトも遊べます。

その他の機能

まだちゃんと試せてないけど、チートコード機能。チートコードの定義ファイルをSDカードに突っ込んでおくと、ゲーム中、いつでもチートコードが呼び出せます。

RetroN 5 | Cheats

細かい機能だけど、スクリーンショットを撮ってSDカードに保存することも可能。

まとめ

想像以上に究極のコンソールでした。これは絶対に買い!

豊富な機能があるのはもちろん、全ての機能が全ハードで同じインターフェイスで扱える作り込みが素晴らしい。レトロゲー遊びたい人の決定版ですね。 価格を考えても非常にお買い得。

案の定、海外では売り切れ続出のようで、Amazon.comでは現在価格が$230ぐらいまで高騰してます。

Amazon.com: Buying Choices: Hyperkin RetroN 5 Retro Video Gaming System - Gray

買いたい方は、在庫が安定するまで待つしかないんじゃないかなあ・・・・・・。他に買えるところがあれば教えてください。

Markdownでスライドを作る決定版!「Deckset」が非常に良かった話

スライドを作りたい

photo by James Jordan

勉強会に出席するような意識の高い読者諸賢であれば、各々様々な方法でスライドを作っているかと思います。

僕は、markdownを使って楽にカッコイイスライドを作ろうと、今までいろいろ試行錯誤してきたのですが、どれも僕の要求を満たすような感じではなくて、結局Keynoteを使ってせっせとスライドを作っていました。

Decksetが凄く良い

Markdownからスライドショーを生成してくれる「Deckset」というMac用のアプリを2000円も出して買ってみたのですが、凄く良かったのでご紹介します。

https://itunes.apple.com/jp/app/deckset-turn-your-notes-into/id847496013?mt=12&uo=4&at=10l8JW&ct=hatenablog

Deckset for Mac: Turn your notes into beautiful presentations

作ってみた

このスライドはこんな感じのmarkdownからできてます。

deckset

Decksetはここが凄い

大抵のメインの機能はスライド内で述べてしまったのですが、他にも細かい機能が多数実装されてます。

  • markdownからスライド生成できる
  • 豊富なデザイン
  • Github Flavored Markdown(GFM)対応
  • 画像の設置位置を指定できる
  • 文字のサイズも変更できる
  • 一部HTMLタグが使える
  • 発表用メモが書ける
  • 動画も埋め込める
  • 4:3, 16:9のアス比に対応
  • PDFにはき出せる
  • 外部の好きなMarkdownエディタと連携できる

特に、画像を専用のシンタックスで制御できるところが満足度高い

今までやってきたこと

photo by mdalmuld

お金なんかかけなくてもタダでできるよ!と異を唱えたい方は多いと思うので、Decksetに辿り着くまで、僕が試してきた方法をご紹介します。

もっと良い方法があれば教えてください。

slideshow

Ruby製のスライド変換ツールであるslideshowなどを使って、HTMLに吐きだしていました。割と簡単にできて嬉しいし、結構カスタマイズ性も高かった。

slideshow-s9/slideshow

さらに、以下に紹介されているようにguardなんかを一緒に使ってあげると、markdown保存するだけでスライドができて便利でした。

Markdown × slideshow × guard で快適プレゼン資料作成 - Confront my ignorance

しかし、初期状態には良いテーマがなかったり、日本語を扱うと微妙になったり、テーマを増やすにはCSSを書くのが面倒だったり、画像の細かい位置調整がうまく行かなかったりと、使い勝手が悪いところも。

Pandoc + Reveal.js

Pandocを使ってMarkDownからreveal.js用のスライドを作ってしまおう。 - 亀岡的プログラマ日記

Pandoc - About pandoc

hakimel/reveal.js

Haskell製のドキュメント生成ツールPandocで、実はmarkdownやreStructuredTextからスライドショーを作ってくれる機能があります。

これを使っても良いけど、環境構築が面倒なことに加え、結局は前述のslideshowと同じような問題に陥る。

Glide.so

f:id:gigi-net:20140505214704j:plain

Gistにmarkdownを上げるだけでスライド化してくれる便利サービス、『Glide』。

Glide

これはかなり良い線まで行ってて愛用させて頂きました。

凄く便利だったのですが、デザインテンプレートが少ないのと、改ページの仕様が面倒なこと、いちいちオンラインに上げないといけないこと、さらに画像を別の所に保存しておく手間などが不満でした。

僕はGistにmarkdownを上げて、それをリポジトリとしてcloneして、そこに画像を突っ込むみたいな運用をしていましたが、高々スライド一つ作るだけで凄く面倒だったので、徐々にあまり使わなくなりました。

Keynote + カッコイイテンプレート

結局、Keynoteでいいやーという結論に落ち着く

Keynote

Keynote

  • Apple
  • 仕事効率化
  • 無料

Azusa」というKeynoteテンプレートが非常にカッコよく、とりあえずこれを使っておけば見た目が良くなるユニクロ装備ので、これでいいやーと言った結論に落ち着きました。

大体いい感じになるKeynoteテンプレート「Azusa」作った - MEMOGRAPHIX

オススメMarkdownエディタ

Markdownを編集する方法はいろいろあるのですが、Macでのエディタはいろいろ試した感じ無料で使える中では「LightPaper」というエディタが一番良かったです。

Simple, beautiful & free Markdown editor for passionate writers on Mac

有料の奴はもっと良い物があるかもしれませんが、フリーはこれが一番オススメ。これもGFMが使える。

まとめ

  • Deckset凄い
  • スライドはmarkdownで作った方が楽
  • いろいろ悩むぐらいなら2000円払ってDeckset買おう
  • Macでタダでmarkdownを書きたければ「LightPaper」がオススメ
  • 意味なく画像を入れるとスライドショーもブログも格好良くなる

cocos2d-x 3.0でクロスプラットフォームなインディーゲームを開発した話

『Wave Weaver』リリースしました!

シンプル操作で脅威の中毒性。波をよけ続けるゲーム『Wave Weaver』をリリースしました!

詳しくは以下の記事とトレーラーをチェック!

波をかわして曲を紡ぐ、カジュアル中毒ゲー『Wave Weaver』をリリースしました - 5.1さらうどん

Google PlayApp Storeで大好評配布中です!非常に多くの方に遊んで頂けているようで驚いています。

for iPhone / iPad

https://itunes.apple.com/jp/app/waveweaver/id841280819?at=10l8JW&ct=hatenablog

iTunes の App Store で配信中の iPhone、iPod touch、iPad 用 WaveWeaver

for Android

Android app on Google Play

Wave Weaver - Android Apps on Google Play

この記事は

この記事はWave Weaverの開発話を交えて、cocos2d-xを使ったクロスプラットフォームなゲーム開発の知見をお伝えするつもりです。

Wave Weaverは、cocos2d-x 3.0のβ版を使用しており、国内では最速レベルのプロダクトだと思われます。そのため、今後使う人に使用感など含め、お伝えしていきたいと思います。

Global Game Jam Sapporo

f:id:gigi-net:20140323102644j:plain

このゲームのプロトタイプは、48時間でゲームを開発するハッカソン、GlobalGameJamの中で作られています。48時間で基本的なプロトタイプはできあがっていた!

詳しくは、gihyo.jpに僕が寄稿したイベントレポートをご参照ください。

ソーシャルゲーム,ボードゲーム,ファミコンまで!? Global Game Jam 2014参加レポート:レポート|gihyo.jp … 技術評論社

cocos2d-x 3.0を使ってみた

最終的に、本作ではcocos2d-x 3.0beta2を使っています。

現在ではRC版が出ているのですが、GGJ当時(1月末)の最新版はβ1でした。

lambda超便利

3.0最大の恩恵は、C++11で実装されたlambdaに完全対応しているところ!

特に、今作ではエンディングなど、逐次的な処理があったので、大体はAction + lambdaで、cocos2dのBlocksライクにかなりお手軽に記述できました。今まではわざわざコールバックを定義して、なんてことをやっていたので、非常に利便性が上がっています。

反面、lambdaを使いすぎると、コードの可読性が落ちて大変でした。特にGGJでは尚更。

さらにC++のlambda-captureと、cocos2d-xのautoreleaseが相性最悪な感じで、captureしたと思ったら、autoreleaseされててぬるぽ、みたいなことがよく起きたのもハマりどころでした

クロスプラットフォーム化が楽

3.0からプロジェクトを生成した時点で、全てのプラットフォーム用のテンプレートが生成されるので、クロスプラットフォーム化がかなり楽でした。ありがたい変更。

alpha, beta, rcで仕様が変わりまくった

まだリリース前なので、仕様がコロコロ変わって大変でした。

以前、alpha版を基準にスライドを作ったのですが、それからGGJで利用したbeta1は、ArrayやDictionaryが廃止されていたりと、結構大きな変更が。

cocos2d-x 3.0 + C++11で始めるゲーム開発超入門

最近リリースされた3.0のrc版ではプロジェクトの生成方法が変わっていたりして、あんまり原形を留めていない感じです。

開発スピードが速すぎて仕様が安定しなさすぎるので、正式リリース前のフレームワークを使うのは危険な感じ。

クロスプラットフォーム + Universal対応

今回はゲーム自体がシンプルだったのもあって、プラットフォーム別に4種類画面を作りました。

f:id:gigi-net:20140323104935p:plain

左からiPhone(4.0インチ)、 iPhone(3.5インチ)、iPadAndroid

iPhone / iPad

iPhone開発はノウハウがあったので、いつも通りこちらを基準に作りました。

iPhoneRetinaとNon Retinaの画像を用意する必要があるのですが、Retina版を基準に作り、Pythonで簡単なスクリプトを書いて、Non Retina用に自動変換をしていました。PIL便利。

4インチ対応は背景画像だけ別に用意して、あとは同じリソースを画面サイズから相対位置で配置するように切り替え。

iPad対応もほぼ同様。iPad版は実は実装上はiPhone版より画面が狭いです。反面、非常にボタンが押しやすくなっていて割と別ゲーに。

Retina iPad用にはSplash画像を別途用意しただけで特に何もしていません。意外と見た目は気にならない感じ。

Android

Android対応は初だったので、動けばいいや的な感じで、あまり機種ごとの最適化は行わずに、一律iPhone3.5インチのNon Retina版と同じ表示になるように作りました。Androidはこの辺が大変ですね。

ビルドにはGradleを使用。NDKの対応にはこちらの記事が大変参考になりました。

gradleでCocos2d-x3.0alpha1のアプリをbuildしてAndroidのapkを作成する - きょこみのーと

古い機種だと重たいという話も聞こえており、今後の課題ですね。

ちなみに、開発中は幻のOUYA版が存在してましたが、コントローラーへの対応が面倒だったので、リリースは見送りました。

Jenkins + TestFlight/DeployGateで高速テストプレイ

ゲームの質は、開発者が如何に遊びまくったかが全てなので、テストプレイ超重要です。

今作では、Jenkinsを用いて、コミットと同時に、各プラットフォーム向けに自動ビルドをしておりました。

f:id:gigi-net:20140323105404p:plain

コミッタはiPhone 4.0インチ環境で開発するだけで、あとはチームメンバーが勝手に確認したりテストしたりしてくれるので、非常にスピード感がありました。

今回のようなクロスプラットフォームの開発では、いちいち全機種ビルドして確認してられないので、CIは必須な感じがしますね。

gitは共通言語

f:id:gigi-net:20140323110020p:plain

ゲーム開発はプログラマの仕事が増えると大変なので、gitを共通言語にして、皆がリポジトリにコミットできる環境を作るべきだと感じました。

例えばデザイナーに「画像が差し替わったのでDropboxに上げましたー」とか言われると、わざわざ持ってきて、ファイル名を変えて、差し替えたのか差し替えてないのかわからずに面倒なことになります。

今回はgitを使えるメンバーが多かったので、その辺が非常に楽でした。プログラマ以外のデザイナーやコンポーザーもgitを使うべき。

辛かったところ

逆に今回の開発環境で上手く行かなかったところについて。

SpriteStudio for cocos2d-xが辛い

f:id:gigi-net:20140323111825p:plain

今回は演出を少しでもリッチにするために、アニメーション作成にSpriteStudioというソフトウェアを使用していました。

SpriteStudioはGGJのスポンサーも努めており、インディー開発者向けに、プロユースの物と同等の機能を持ったモノが無償で提供されています。ありがたい!

「超汎用」データ制作 あらゆるゲーム開発シーンに対応。2Dスプライトアニメーションデータ作成ツール「OPTPiX SpriteStudio」 | ウェブテクノロジ

しかも公式でもcocos2d-xをサポートしていたため、今回導入してみたのですが、標準で用意されてるものを再実装していたり、インターフェイスが独特だったりと、ライブラリのできがあまりよろしくなくて大変でした。

補助ツール・ライブラリ群・サンプルのダウンロード | OPTPiX Help Center

リリース前だったので、当然3.0には対応しておらず、動くように書き直したのですが、アルファブレンディングなどがちゃんと動かずに、そのまま使えない自体が多発。

結局、SpriteStudioで作ってもらったアニメーションを目コピーして、コードで実装したりしていました。

さらに、現在Mavericksで動かないのも辛いところ。わざわざVM立ち上げて作業してました。

ライブラリも1000行ぐらいあって、読み解いたり修正が大変な感じだったので泣く泣くそのまま使用。今後とも使っていくのであれば、しっかりと書き直したい感じですね。

とはいえ、今回のように趣味で開発する場合は、SpriteStudioは無償で使えるという点でかなり魅力的。

お金があるのであれば、標準でサポートしているSpineなどを買うのが良いと思いますが・・・・・・。

CocosDenshion::SimpleAudioEngineが辛い

cocos2d-xの音周りは、SimpleAudioEngineってのがついているんですが、必要最低限の機能しかついていない上に、なぜか実装がいろいろと酷い

などなど。

そのため、ゲーム途中でアプリをバックグラウンドに送ったときの音周りの挙動などに苦労しました。

前作の『VOXCHRONICLE』はサウンドを動的に操作する必要があったので、自前でOpenALガリガリ書いていたため、音周りの混乱はありませんでした。iOS版のみのリリースであったことも幸いして、クロスプラットフォームを意識せずに設計できたのも楽な点。

もう少し時間があればガッチリと手を入れていきたいところ。結構基本的な機能も揃っていないので、割とみんな困ってると思うんですけど、みなさまどうしてるんでしょうね。何かご存じでしたら教えてください。

ビルド時間が長すぎて辛い

cocos2d-x 3.0は2.xに比べて、かなりビルド時間が長くなっているように感じました。

特にiOS版はObjective-C++を使っている関係で、ビルドがタダでさえ遅いのに加え、本プロジェクトではboostを使っていたため、さらにビルド時間が長くなりました。

特にMacBook Airでは、クリーンビルドだと5分以上待たされることもザラ。48時間しかないGGJでは致命的な感じでした。

レベルデザイン

『Super Hexagon』を意識しまくった

f:id:gigi-net:20140323110707p:plain

このゲームは、『Super Hexagon』というインディーゲームに強くインスパイアされています。

『Super Hexagon』の中毒性を踏襲すべく、以下のような仕組みでレベルデザインを行いました。

  • 波の排出や、数秒間待機するなどの命令をOrderと呼ぶ
  • 各Orderには排出開始位置や、波の色、Easingなどが設定されている
  • 一連のOrderのまとまりをPatternと呼び、レベル毎にPatternを何種類か定義し、ランダムに出現順を変えている

このように、毎回適当に波を出すのではなく、ある程度のパターンをデザインし、ランダムで出すような仕様になっています。

これによって、一見突破不可能な波であっても、何度も遊ぶことで記録が伸びていき、中毒性の高いゲームに仕上がっています。

レベルデザインについては様々な声を頂いています。ありがとうございます。

レベルデザインや、波のエミッター周りの実装は、『Super Hexagon』を最高レベルまでやり尽くした[twitter:@tcptr]さんが作り込んでくれたので本当に良いモノができました。

ちなみに、だいたい1時間ぐらいでエンディングを見れるように調整してみたのですが、概ねそんな感じになっているようで何よりです。

タダでもここまでできる!

最近はゲーム開発用の環境もだいたいはOSSで揃うようになってきたので、お金をかけずにここまでの開発が個人でできます。良い時代ですね!

他の人の開発裏話

デザインや音楽などにも、細かなところに工夫が生きています。ご興味のある方は是非。

ゲーム開発したい方は

f:id:gigi-net:20140323111018p:plain

札幌ゲーム製作者コミュニティKawazでは、プロアマ交えて楽しくストイックにインディーゲーム開発をしています。是非ご参加ください!

おまけ

ありがたい

*1:最初はTestFlightを使っていたが、サービス終了に伴い移行した