Global Game Jam Sapporo 2013 に参加しました #ggjsap

初めてのGGJ！

http://atnd.org/event/ggjsap13
チーム4にプロが来たと思った？ 残念、あんにゅいちゃんでした！

私の役割

今回はグラフィッカとして参加しました。
ゲーム制作経験が全く無いので、参加時点でプログラマは志望せず。
チーム4は Rails+CoffeeScript だったので、Rails部分なら力になれるかなぁ…とか思ったけど、実際に走り出したらまったく追えなくなったので静かにしていました。

私の関わり方

コミュニケーションチャンネルはSkypeが主で、私はほとんどSkypeに引きこもっていました。事前ミーティングは不参加。期間中、初日は顔出して企画のお話とかしたりしたけど、あと２日は体調崩しておうち参戦でした。

ゲーム制作をふりかえる

企画の時間

チーム4のゲーム制作は、企画にたくさんの時間を使いました。

以前、参加した春祭りの時は、チームで集まったその日にゲームの構想がかたまったのでそれくらいの時間を想像して挑んだのですが、今回はテーマ発表〜2日目の昼過ぎくらいまで、作るものが揺らいでいました。
何が違うのかなーと考えてみて気づいたのは、春祭りの時は最初に「シューティング」というのが決まっていたということです。あれは大きかった気がします。

今回はメンバーのスキルを考慮して、事前にブラウザゲー(ソシャゲ)にしようということは決めていたけれど、これだと媒体しか決まっていないんですねぇ。その上になんでも作れちゃう。jsで画面遷移なしのゲームを作ったので、もうアクションでもなんでも乗り放題です。ブラウザゲーというと 脱出ゲー or ブラウザ三国志 くらいしか思い浮かばない私には目から鱗でありました。各々、ブラウザゲーのイメージも違ったのかなぁと想像します。

もしもう一度やるとすれば、もっとジャンルまで絞ってから挑むかなぁ。そうしたら大分構想を練るのが楽かもしれません。実際、クリックゲーにしよう って決まってからは初日分の時間しか使っていない気がします！(あんまり会場にいなかったので詳しい時間はわかりません><)

リーダーのすごみー！

miioたんがリーダーだったんですが、まじすごい。
ゲーム基盤の事前作成とかgitに慣れていない人のためのサポートツール作成とか、Skypeの窓分けとかゲームの方針決めだとか、チームのインフラ設計みたいなところを一手に担っていました。
githubを回したり滞りがちだったりするところへ気を回したりもしていて、企画/プログラム/絵 とどのSkype窓で困っていても降臨して一言くれるし、あなたが神か…。
なんか…事前込みでものすごく負担が偏っていた感じがあるので、微力でも力になれるとするとどこかなぁと考えました。役割分担難しそう。そのあたり何かあれば今度聞かせてください！
その前に顔出せって話ですね！すみません！

グラフィッカとして

mabちゃんありがとう！

今回一緒にグラフィッカとして動いていたmabちゃん！
めちゃんこお世話になりました…!
私はゲーム向きの画像というのがイマイチよくわかっていないので、mabちゃんの描くドット絵がすごく参考になりました。テイストとか作るものとかの方針ぎめがすごく助かった！ 私はほとんどmabちゃんの操作で動いていました(^o^)

グラフィッカは事前情報がほしい

絵師は作る物が具体的にあがるまではすごく動きづらいのだなぁ というのを感じました。
今回は流れがあんまりわからず、2日目午後に自分駆動でつくりはじめちゃったけど、画像サイズとか必要な画像の種類とかをもらってから作った方が良かったのかなー。でも自分の発想が1日で間に合う気がしなかったので、64×64でアイコン作りはじめちゃったし、結局合わせてもらっちゃいました！エヘヘ
指示貰う前に描いたものは全捨てしたのですが、どんどん描きやすくなっていったので、数描くのアリな感じします。ただ、サイズだけは決めてもらったほうが良かったのかも…？
もし遠隔参戦じゃなければ、企画段階から画面のイメージラフを描いてみつつパーツとか決めるのが良さそうですね。自然と必要なものに辿り着けそうな感じ！

githubとグラフィッカ

今回は画像もgithubで管理しました。画像diff超べんり！
github駆動だとモヤッとしたものがコミットしづらいので、序盤はdropboxを使って良かったです。でももっと早く pull request 送ればよかったかな。
もう一度挑戦するとすれば、今度は必要な画像一覧とその大きさ、ファイル名だけ決めてから作り始めたいです。ダミー画像から順番にプルリクしていけそうな感じ！
この情報が必要っていうのは、グラフィッカで参加しないとわからなかったかも。
今までのプログラマ人生ではまったく想像できなかった。勉強になりました。

(思い返してみると、春祭りの時はそうやって情報を用意してもらってたのに一個も画像提出しなかったのでした…ｼｬｾﾝ…ｼｬｾﾝｯ……)

すごく印象に残ったツイート

最初見た時「ん？」ってなったけど、何度か読んで、もう、なんか、すごく印象に残りました。
自力以外出せないっていうのは、今まで積み上げてきた知識とか経験とかそういうものからしか、力は出せないということ…!

必要になった時に調べてみても、自分の中に似た経験やベースがないと、すぐに力として使うことなんてできないですよね。私は何度か似たようなことを感じたことがあって、わかっていたはずなんだけれど、実際に参加した人からこのツイートが出たことで思い出したようにハッとしました。きっと忘れていたんですね。
多分、そんな気持ちを強く感じないように、わからないことを避けてすごしているんだと思います。だってつらいし。

GGJに参加するということ

ずっと思っていたこと

もうね、私は恥ずかしかったんですよ。恥ずかしくて今までハッカソン系イベントは避けまくっていたんです。
何もできない気持ちが強いし、多分実際何もできない。プログラマを名乗っていても、急に何かを作れって言われた時に何も作れない。
仕事では、ハッカソンのようにストイックな作業はしたことがないし、職業プログラマとして、ハッカソンで何か作れることが重要かと問われれば、NOと答えます。
でもハッカソン会場ではそれを求められるし、それができるプログラマが集っているわけですよ。その中に居ることが恥ずかしい。
できないこと自体は悪いことでも恥ずかしいことでもないと思うし、できるようにならなければいけないとも思っていないけれど、できないことが恥ずかしいと思うようなところに、楽しく参加できる人達に憧れているわけです。だいぶ強く。

参加を決めた時の気持ち

そんな私なので、GGJ参加にもだいぶ躊躇していました。
12月22日にgiginetからお誘いリプライをうけても、まったく登録する気になれず。だってこわいし。それでずっと躊躇してそっとしておいたのだけれど、1月13日にもう一回お誘いリプライをもらったんですよ。

最初は「よかったらぜひ！」だったのが「ゲーム作りませんか？」になっていたんですよ。なんかその時に「これ断ったらずっと負けな気がする…」と思ったんですよ。普段勝ち負けって表現は大嫌いなんですが、この時は強くそう思ったんですよ！
で、この瞬間に決めなきゃ多分参加できないと思ったんですよ！
これ以上躊躇してはいけないと！

なんかだいぶ躊躇感漂っていますがすごくがんばりました。プログラマは志望できなかったのだけどね。

参加してみて

力になれたかって言うとほとんどなれてない感じするけど、タイトルが画面に出た時はわわわって思えたの、よかった…! Ust越しだけどちょっとどきどきしました。ふしぎ！

あとは何より、近くでプログラマ勢の死屍累々感を感じられたのがよかった！（えっ）
これは冗談じゃなくてですね〜
普段一緒にコード書いているわけではないメンバーと、事前のSkypeとその場の会話でもってプログラムの方針を決めたり、満身創痍な感じになりながらコードを書いていけるというの、すごいなと思ったんですよ。ほんとすごい。それを近くで感じられたのはほんとによかったと思ったんですよ！

多分いくつかよかったと言えるための条件もあって

  • 仕事と遠い
    • 本職カテゴリで参加していない
    • 職歴よりゲーム制作歴が重要
  • 日常と遠い
    • まわりは普段接することのない人ばかり
    • 参加者はプロだけじゃないしプログラマだけでもない

みたいなとこ。これらのおかげで、自分がどうかとかは置いといて、周りをフラットに見られる状態だったの。そういう場所に居させてもらったのは結構大きいとおもいます。
自分が中に入っちゃうと、できない申し訳なさとか後悔とか色々出てくるだろうけど、睡眠時間削りながらその時々全力で参加している人達を外側から見てるとそんなの全然関係なかった。負の念というのは自分の内側だけの問題だよなと思いました。ほんとプログラマかっこよかった。変態ばかりですよ。あの中に混ざりたいと本当に思いました。駆動する力になりたい。

それでね、次のGGJに参加するとしたらどこに入るかなって考えたんだけどね、プログラマ枠は目指し辛い感ありますね！
だって絶対肌に悪いもん……

そうかつ！

私くらいの参加度で振り返ってみてこれだけ感じるものがあるのだから、3日間フルに頑張ってた人はまだ全然抜けてないだろうなぁ と思って#ggjsapタグ周辺みたらそんな感じでワロタ
参加したおかげで、手元のコードをさわるのが楽しくなりました。ふしぎ。
参加してみてよかったよおおっ　チーム4のみなさんありがとうございました！
ぎぎたん誘ってくれてありがとう！ Organizerおつかれさまでした！


まじかわいい

おまけ

一人アセンブラチームの変態っぽい人がハイテンションで超楽しそうだったの、すごく良かった！ あんな感じで参加したい！ 絶対つらい！（ジレンマ）

capybaraについて勉強した

capybaraはユーザが行うブラウザ操作をプログラムしてテストを行うためのインターフェースです。実際にブラウザからボタンを押して遷移できるか とか〜 タイトルがちゃんと表示されているか とか〜 目視することなくコードを書いて確認ができます。とっても便利！
capybaraはドライバを変更して使うことができます。

f:id:EnnuimaZ:20130106175251p:plain

調べてみたけど壮大過ぎて把握できない！
以下簡単なまとめです。

drivers

RackTest Driver

Class: Capybara::RackTest::Driver

  • JavaScriptを使う必要がない時はこれがうごく
  • capybaraデフォルト！

selenium

  • JavaScriptを使う必要があるときのデフォルト
  • ブラウザを起動するもの

capybara-webkit

"A Capybara driver for headless WebKit so you can test Javascript web apps"

"A capybara driver that uses WebKit via QtWebKit."

poltergeist

"You need at least PhantomJS 1.7.0. There are no other external dependencies (you don't need Qt, or a running X server, etc.)"

engines

Selenium

"Selenium automates browsers."

  • selenium はブラウザを自動操作するもの！
    • selenium-webdriver っていうのがあって、これでブラウザを起動することができる。この中のドライバを変更すると立ち上げるブラウザを変更できて、capybaraからもこの機能を使うことができる。(いくつかのCI環境を用意して、こっちはIE こっちはSafari ってテストができて便利だね！)

QtWebKit

  • QtWebKit
    • QtとWebKitをあわせたもの？ QtがどうやってWebKitとつながるんだろう。UIの部分？

Qt

"Qt is a full development framework with tools designed to streamline the creation of applications and user interfaces for desktop, embedded and mobile platforms."

  • [qt.digia.com/Product/:title=Product - Qt]
WebKit

"WebKit is an open source web browser engine."

PhantomJS

"Full web stack
No browser required"

  • PhantomJS
  • ブラウザを使わずにすべてのweb機能を！（かっこいい）
  • webkit をラップしたコマンドラインアプリケーション

以上！

画像以上のことはわかっていない感じありますねえ。

rbenv + ruby-build 環境で新し目のRubyを使いたい時

ruby-build rbenv ruby

Ruby 1.9.3-p327 をインストールしたい

定義されていません

$ CONFIGURE_OPTS="--with-readline-dir=/usr/local --with-openssl-dir=/usr/local" rbenv install 1.9.3-p327
ruby-build: definition not found: 1.9.3-p327
  • 1.9.3-p327 なんてありませんねぇ と言われている
    • `$ brew update ruby-build` しても変わらない

ruby-build の定義情報はどうやって更新されるのかなと思ったのだが、
・ruby-build 自体に ビルド方法の定義を更新するオプションやサブコマンドはない
・ruby-build 自体を Homebrew などで入れ直す必要がある

  • `ruby-build` コマンドで確認
    • 使っているものは20121104
    • ruby-build の Version History を見ると、p327を取り込んだのは20121110
      • インストールしなおしましょう

ruby-build をインストールし直す

以下実行ログ


*追記*

unlink で unlink できないとき

$ brew unlink ruby-build
Unlinking /usr/local/Cellar/ruby-build/HEAD... 4 links removed
$ brew install --HEAD ruby-build
Warning: Your Xcode (4.5.2) is outdated
Please install Xcode 4.6.3.
Warning: ruby-build-HEAD already installed, it's just not linked
$ brew remove --force ruby-build

そっからruby-buildをインストールしなおす

切り替え

$ rbenv global 1.9.3-p327
$ rbenv local 1.9.3-p327
  • 本当はglobalはp194のままです
    • 急に切り替えるのこわい

rvm から rbenv+ruby-build へ移行した

移行手順

rvm を使わないようにする

$ mkdir rvm_backup
$ mv ~/.rvm rvm_backup
$ vi ~/.bashrc           #rvmの記載を消す
$ vi ~/.bash_profile     #rvmの記載を消す

rbenv, ruby-build をインストールする

$ brew install rbenv
$ brew install ruby-build

Ruby をインストールする

$ brew install readline
$ brew link readline
$ brew install openssl
$ brew link openssl
$ ls /usr/local/Cellar/readline/
6.2.1 6.2.2 6.2.4
$ ls /usr/local/Cellar/openssl/
0.9.8r 1.0.1a 1.0.1c
$ CONFIGURE_OPTS="--with-readline-dir=/usr/local/Celler/readline/6.2.4 --with-openssl-dir=/usr/local/Celler/openssl/1.0.1c" rbenv install 1.9.3-p194

bashrc の一番最後に以下の設定を入れる

PATH=$HOME/.rbenv/bin:$PATH
PATH=/usr/local/bin:$PATH  #既存のPATH設定を移動
eval "$(rbenv init -)"

※PATHの設定順間違えてすごくハマった

使用する Ruby のバージョン変更方法

$ rbenv global 1.9.3-p194
$ rbenv local 1.9.3-p194

OS X Snow Leopard から OS X Mountain Lion へのアップデート

流しのプログラマをしている女子高生(27)は無職で暇なので
雪豹にお別れを告げて山獅子を飼うことにしました。

Mountain Lion のインストールから開発環境を整えるまで

  1. Apple Store で OS X Mountain Lion を購入して DL and Install
  2. https://developer.apple.com/downloads/index.action DL and Install
  3. $ sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer/

※上の手順に至った背景 → https://gist.github.com/e8d7f7672d55ae02b2d3

FreeMindをインストール

「PowerPC アプリケーションはサポートされなくなったため、アプリケーション”FreeMind.app”を開けません。」

検索すると ”FreeMind活用クラブから配布されているFreeMindは古いバージョンです” とある。 FreeMindをダウンロード してインストールして /Applications/ 配下に追加。

起動しようとするとエラーが表示されるが、調べたところセキュリティが厳しくて使えていないだけなので、以下の手順で許可する。

  1. システム環境設定 > セキュリティとプライバシー
  2. 「すべてのアプリケーションを許可」
  3. FreeMindを実行

これで立ち上げることができる。
セキュリティの設定は戻しておいた。

gimpが使えない

なんと Mountain Lion は自分でX11入れなきゃいけないらしい。

リンク先からダウンロードしてインストール

  • http://xquartz.macosforge.org/landing/

    • XQuartz-2.7.4.dmg
      • そしてgimpを開く！
      • X11指定しろって言われた…どこに入ったの…?

  • そもそもgimpを Mountain Lion 用にしなきゃいけないらしい。

  • 起動する。起動中画面がきれいな感じ。 -- 起動後も画面が黒背景になっていてかっこいいし気が散らない。

  • タスクにX11じゃなくgimpと表示されるのが良い。
  • ⌘Qすると固まるのでメニューから落としている。バグかな。

pull request のおくりかた

対象となる状況

よそさまのリポジトリに pull request を送る場合 且つ、 オリジナルを clone してきて手元で変更してコミット後、github で Fork して push して pull request したい！ なんてとき

今回の仮定

手順

1. オリジナルのリポジトリを手元に持ってくる

git clone git://github.com/imaz/sample.git
cd sample
git log
git status 　 (このへん2行は完全に無意識に行ってたわー)

2. 誤字っている部分を編集する

git checkout -b fix-typo 　 (修正内容にあわせて branch をきる)
vi README.md 　 (修正する)
git diff 　 (修正内容に問題がないか見る)
git add .
git log 　 (主に編集している人のログを確認)
git commit -m "Fix typo" 　 (頭が大文字のようですね!)
git diff master 　 ( branch での変更点が見れる)

3. github 上でオリジナルのリポジトリを Fork する

オリジナルのリポジトリの右上に Fork ボタンがあるのでぽちっとします。  
ぽちっとするとオリジナルリポジトリが自分のリポジトリとして複製されます。

4. Fork してきたリポジトリに変更を push する

手元の git に SSH の URI (書き込み可能)を教えてあげましょう。

git remote add imazun git@github.com:imazun/sample.git 　 (手元の config ファイルに Fork したリポジトリの情報を書き込む)
git remote
  imazun 　 (増えた)
  origin
git push imazun fix_typo 　 
                 ↑             ↑
          リモート名  リモートのブランチ名

git remote add するだけで遠隔でブランチを作って push できちゃうのすごいね!
github で Fork してきたリポジトリを確認すると変更が反映されています。

5. ねんがんの pull request する

github 上で左側からブランチを選ぶ  
pull request ボタンをおす  
diffとかcommitとか確認する  
コメント書く  
ぷるりくえすとする！

おわりに

  • Fork した後に clone とか、自分のリポジトリに pull request とかいろんなケースがあるけれど、一連の流れに慣れたら他のケースも想像つくようになりました。
  • merge と reject するのは(確か)未経験なので、これから pull request される方はぜひこちらで練習してください!!
    https://github.com/imaz/sample