読者です 読者をやめる 読者になる 読者になる

KUMAGATA-DENKYU

つくるのがすきなくまによる開発ブログ

10日間まったく会話せずひとりお正月ハッカソンして得た教訓まとめ

Webサービス

f:id:mofukuma:20140109225031j:plain

家族は実家に帰ってまったりと過ごす予定の中、くまは作りたいものがあったので、一人自宅に残り正月ハッカソンしてたのです。

10日間、人とまったく会話せずに部屋に篭って・・・。


ここまで声を発しない生活が続くとなにが起こるかというと、本日久々の知り合いとの会話で、 「わあ、こんなに人との会話って嬉しいものなんだ!」って感動するレベル。人間は社会性をもつ生き物なのだと遺伝子レベルで思い知らされます。

ではでは今回の成果報告と、この偏った生活を送る上で勉強になったことをまとめます。

結論からいくと、今回は設定した目標まで完成させられませんでした。無念だくまー。


つくってたの

ブラウザ上で簡単にiPhoneアプリやゲームが作れるWebサービス「くまじん(仮)」を作っています。いわゆるjsdo.itやcodepen.ioなどのオンブラウザ開発系のサービスです。

f:id:mofukuma:20140108232121p:plain

作ったシーン・書いたコードのリアルタイムプレビューとか。


いまあるブラウザ開発系サービスの機能に加えて、新しく開発したオープンソースKmagine.jsを使うことによって、画像のD&Dでの配置やシーン管理などのリソース重視の機能を提供します。

Kmagine.js



f:id:mofukuma:20140109225045j:plain

ドラッグドロップでアップロード・お手軽配置、シーン管理はUnityっぽいツリー構造。既存のウェブに重ねて表示できるのが面白いところ


また、HTML5 Canvas不使用というコンセプトにより既存サイトとの相性がよく、モバイルファーストなフラッシュレスティザーサイトにおいて現在主流の実装方法( CSS3 transform )で作れます。

フラッシュレスティザーサイトの一例: ファミコンリミックス ※外部サイトです


さらに、コードを変えずにそのままiOSアプリとして動かす技術を提供します。 これは以前に実験的に作った「スペースくま」というiOSゲームの技術をさらに発展させたものです。 ネイティブ並のアニメーションが期待できます。

スペースくま


残作業

もうすこしだったのですが、 残り作業、TOPページデザインとシナリオテストが残ってます。ぐふ・・・。

というわけで反省会として、なぜ目標を達成できなかったかを考えてみます。


教訓① ちゃんと使えIDE

今回のWebサービスではGoogle Apps Engineを採用してます。理由は以下のとおり。

  • 画像ストレージの取り回しがとても楽で、維持コストも安い。
  • PythonPython萌え。
  • DataStore+memcache調教。遅い。結果整合性。うまく作れば早い。楽しい

で、いつもSublime Textのviモードで開発しているし、Google Apps Engine用に便利に使えるIDEってよく知らなかったし、調べたりセットアップするのも時間かかると思ってIDEを使わずにやってたのですが、さすがにデバッグとかリファクタリングで限界を感じて最後のほうでPyCharmを導入しました。

1年99ドルってちょっと高いけど、最初から金で買える効率は率先して買うべきでした。

そりゃやっぱり有料かつ高機能なIDEを全力で活用したほうがいいよね。


教訓② ちゃんと寝よう夜

あまり寝ないで作業するとプログラムはまあまだいいですけど、レイアウトとか絵をイメージする能力はがくっと落ちる気がします。

予定していた作業なのに、全然レイアウトが思いつかなくて困りました。

やっぱり寝ないとダメだとわかっていながらプログラムしてると寝付けなくなるんですよね。気をつける。


教訓③ 認証から用意せよ

認証の仕組みは仮でつくっておいて、もっとも大事なコア部分から作っていたのですが、あとで認証の仕組みを変えた時にセッションとかユーザデータの持ち方を変えたくなっちゃって、それで結構色々変えるところが多かったりして時間を取られちゃった。

コアなところからやるのはいいと思うんですが、最低限、認証のところは事前用意して変えないほうがよかったです。


教訓④ Jadeはよいものだ

Preprosっていうフリーソフトを愛用してます。

f:id:mofukuma:20140109225435j:plain

これはHTMLを簡単に書けちゃうメタ言語であるJadeやSlim、 CoffeeScript、SCSSなどを監視して自動コンパイルしてくれるすぐれもの。

さらにすごいのは「ダウンロードしてダブルクリックしてインストールするだけ」で動いちゃうところ。 ブラウザのオートリフレッシュとかPNGの最適化とかもできるし最強です。

で、くまはJadeを使っているのですが、これはやはりとっても早く書ける。早く修正できる。 インデントで構文作る系はviモードと非常に相性がいい・・・。 Slimとちがって括弧まで排除してない分、見通しが良いし。

Jade、おすすめです。


教訓⑤ CoffeeScriptも使えばよかった

  • 文法に若干のキモさを感じる(functionが->矢印とか)
  • コンパイル後のデバッグが大変そう、エラー行がどこかわからなさそう
  • 他にも色々なメタ言語でてて目移りする(DirtとかHaxeとか)

などなどの理由でCoffeeScript使うタイミングを逃し続けてやってなかったんですが、 出来上がったイマイチで行の多いコードを見て、やっぱり使うべきだったクマ・・・と後で思いました。

デメリットもありますが、短く簡潔に書けるってのは時短と保守にはいいですよね。 どういう風にJSに展開されるのかもJavaScriptがちゃんと判っていれば明快だし。 Preprosで即時コンパイルされるし。

本当に、これを使ってたら間に合ってたかも。 次からは導入しよう。


教訓⑥ RAMはよいものだ

といっても主記憶装置じゃなくて、Daft Punk のアルバム Random Access Memoriesのことです。


Get Lucky (Official Audio) - YouTube

「One More Time」とか、音楽シーンを作っちゃうくらい影響を与える音作りをすることで有名なロボの人たちです。

今回はつくるのに5年かかったと書いてましたが、一曲一曲がとにかくすごい。 中でもフュージョン+ボコーダーな音が新鮮で気持ちよすぎる。

まったく聴き疲れしないし、懐かしくも新しい音に癒やされます。

作業BGMにオススメ。

ずっと聴いていたので、聴いていない今もずっと頭の中でループしてます・・・・。


教訓⑦ でもラップは聴くな

TLに流れてきたニコニコ動画エミネム先生が教えてくれるシリーズのこの動画を見てしまったのですが、その後、脳内で彼のライムがループして困りました。・・・これは気が散る系の脳内再生だ!やめてくれ!

洗脳されるくま


まとめ

あのときああしていれば・・・最初からこう作っておけば・・・と思うことばかりですが、なんだかんだ集中してほぼ完成まで漕ぎ着けたのでよしとし、次回に活かそう・・・。

そもそもとしてnode.js+MySQLで作っておけばよかったかも、と思いました。でも、よさげなPaaSがどれかわからなくて踏み出せなかった。heroku+AWSの各種サービスAPIかな。

極端な生活をすることによって、やっぱり人に会うことって嬉しいことだなあと再確認できたのはよかったかも。

完成までがんばるくまくま