地獄の“大開発者”養成ブログ

HTML5, CSS, JS, AIR, Flash, Objective-C, openFrameworksを使いきり、俺は死ぬ。

[jigoku-no]

クレイジー極まりないToolkit for CreateJSのワークフローをどうにかしよう その1 問題を整理しよう

CreateJSはFlasherの味方である。だが、そのワークフローはグダグダである。フルFlashに近い構造にすると、すごく手間がかかる。

この問題を数回にわたって、なんとか解決してみよう。 最終的な理想型はPNG画像はSpriteSheetになって出てきて、諸々のjs・imgが適切な場所へ配置される、というところだ。Flashがパブリッシュしたswfの状態に近づけることである。

対象: CreateJSやったことあるひと(やってなくても2分で作れる)

やったことないひとは、

いますぐFlash立ちあげて、

画像をタイムランアニメーションさせて、

Tools for CreateJSのパブリッシュボタンを押してみよう！

2分くらいでここまでできるんじゃないかな。

普通にCreateJSをパブリッシュするとこうなる

hoge.fla

hoge.js

hoge.html

img/

hogehoge.png…

hoge.js

MCの座標管理や、タイムラインアニメーションなどの設定が書いてある

hoge.html

CreateJSまわりの初期化やimgの管理(manifest変数) ←これを別で管理したい！

img/

使う画像。SpriteSheetじゃないので、大量の読み込みになってしまう… ←SpriteSheetにしたい！じゃないとスマホで使えない！

なぜか最適化されておらずimageOptimを通すと、20-40%ほど圧縮できたりする……

と、あまり最良の状態ではない。

現状のワークフローのおさらい

Flaファイルのライブラリで、画像にIDをきちんと割り振る(複数のFlaファイルを扱うときに困る)

Tools for CreateJSのパブリッシュボタンを押す

js, htmlが吐き出される

画像はSpriteSheetじゃない

SpriteSheetにするには、別途手順必要

htmlからmanifestを抜き出す

js, imgをdistにコピー

imgをimageOptimで最適化

CoffeeScriptとかコンパイル → ブラウザリロード

Ctrl + Enter で最良のswfができていたワークフローと明らかに違う。

現在のToolkit for CreateJSは「swfをcanvasで動かす」ところで止まっている

つまり、更新作業や複数Flaファイルを使った中・大規模サイト構築はまったく考慮されていない。

我々の仕事とはなにか

プロトタイプ作成

本実装

本実装のイテレート

最後のほうにデザイン差し替えが大量に発生

ロンチ

更新・運用

である。これがうまく回るようにストレスなくやっていきたい。

ということを、今後数回に分けてつらつらと書いていこうと思う。

Githubはこちら。 https://github.com/katapad/CreateJSAssetsSampler

[jigoku-no]

jadeでmarkdown記法を混ぜたり、coffeescriptを読み込ませたりして、超省力化しよう

以前の記事で、markdownファイルをゴニョゴニョしてjadeに混ぜよう！みたいなことを言ってたのだけど、ちゃんとしたやりかたがあった。

jadeのFilterを使うとmarkdownやless, coffeescriptなどを解釈できる

標準では以下が使えるようになっている。

:stylus

:less

:markdown

:cdata

:coffeescript

使うときは、ちゃんと以下のように使うものをインストールしておく

`npm install coffee-script`

jade側では

#mdBlock :markdown # markdownで見出し1 文章を書きますね。書いてますよ。書いてるんです。書いてるでしょ？書いてるんです！

と、書くと出力がこんな感じに。

<div id="mdBlock"> <h1>markdownで見出し1</h1> <p>文章を書きますね。書いてますよ。書いてるんです。書いてるでしょ？書いてるんです！</p> </div>

これはうれしい。

coffeescriptもインライン展開できる

jadeで

include /coffee/test.coffee

こうすると、test.coffeeをコンパイルしたうえで、展開されてる

<script type="text/javascript"> (function () { console.log('うんこ'); }).call(this); </script>

jsでPC/スマホ判定リダイレクトを入れるときとかに便利そうだ。

以下、gistです

[jigoku-no]

grunt-contrib-jadeでmarkdownを取り込んで、二度と利用規約とプライバシーポリシー.htmlを触らない人生を歩もう

利用規約には、いい思い出がない

利用規約・プライバシーポリシーとは、

コーディングが超つまらないうえに

絶対Wordでくるので、コピペしまくり作業に追われ

リリース前の佳境に3、4回差し替えが発生する

という、誰も読まないページのことを指します。

なので、利用規約書くひとのファイルをそのままhtmlに反映させよう。

めんどくさいもん。markdownで書いてもらってそれを取り込んでしまおう。

手順

フォルダ構成はこんな感じにする

├── md │   ├── policy.md │   └── terms.md ├── policy.jade └── terms.jade

md2html インストール

$ npm install grunt-md2html

jadeでつかう

jadeに以下のような感じでインクルードさせる。htmlはそのまま読み込める。

!!! html body include md/terms.html

Gruntの設定

markdown → jadeの順にコンパイルするとよし！

grunt.initConfig md2html: build: files: [ expand: true, cwd: 'src/jade', src: ['**/*.md'], dest: 'src/jade', ext: '.html' ] jade: terms: hogehogehoge: hogehoge grunt.registerTask 'html', ['md2html','jade']

gistはこっち

俺は利用規約とプライバシーポリシーをやめるぞ！ジョジョーッ！！

ズキュウウウン

[jigoku-no]

grunt-contrib-jadeのめんどくさいパラメータ渡しをラクにしよう

Node製のtemplateエンジンはいくつかあるが、だいだいjadeを使っている。

gruntではgrunt-contrib-jadeがある。非常に少ない手数で大きなリターンがあって便利なんだけど、テンプレートのパラメータの受け渡しがめんどくさい。

何も考えずにやると、多くの設定コピペをしなくてはいけなくなる。

たとえば、about.htmlとpolicy.htmlでdescription は一緒だが、titleはカスタムしたい、ということはママあるわけで。これをコピペせずにいい感じにしよう。

ベースになるオブジェクトにどんどん上書きしていく

ベースの設定を上書きしていくようにすると、とてもラクができる。

ほかにも応用できる

AIRのapplication.xml

iOSとAndroid両方書きだすときなんか、application.xmlをたくさん書かないといけない。当然同じ記述はたくさんでてくるので、この方式でやる。具体的なコードは別記事にて。

コード

[jigoku-no]

JSでドロネー図をやっていました。GoogleMapにドロネーでラインを引きました。それだけの空虚な話。

いきさつ

静かに流行り始めているポリゴン風デザインに挑戦！ | Webクリエイターボックス

ここで、ローポリ風な絵について書いてあった。 オシャレだよね。リンク先にあるジェネレータtriangulator というやつを使ってみたが、なかなか作業量が多くて根気がいる。

@rettuce の陽くんがoFでやってるじゃねーか→JSでやってみるか→もうやられてるじゃねーか←イマココ

blog.rettuce.com » Kinect x openFrameworks x Delaunay → Simple Polygon

ここですでに完成している。 なら俺はJSでやろう！と息巻いたところ、後ろの席の外人に教えてもらったのがこれ

Tri Me

もうやられてるじゃねーか！

ちょいちょい触ってみたが、クオリティが出てない。陽くんのブログをよく見てみると、Cannyで輪郭抽出して、特徴点を増やしていた。なるほどー。でも、いまのところJSをで輪郭抽出はできても、Cannyができるか確認してないので、それはまた次回。

で、GoogleMapでやってみよう。東京のマクドの位置でドロネー

東京がどれだけハンバーガーとポテトで埋め尽くされているのかと、マクドの座標でやってみた。

Google Places API を使って東京周辺のマクドを洗ったが、圧倒的に数が少ない。こんなものかな？

ここまで学んだこと

ドロネーはボロノイ図の母点を線で結んだやつ。ボロノイ図はいろんな活用方法があるとか。詳しくはドロネー図 - Wikipedia

マクドの店舗を取得してきたのはGoogle Places API

jsonpが使えないので、JSから使うにはプロクシー的なことが必要。

というただそれだけの話。

[gifgif2]

[jigoku-no]

Flasherでした！って言えるように、ドロネーをCreaateJSでやってる。ドロネーはボロノイ図の母点を結んだ線でできるとか初めてしった。

[jigoku-no]

BowerでインストールしたJSはdistディレクトリにコピーして使う物です(さっき知った)

理解力のない開発者にとってBowerは便利じゃない

俺の頭が悪いだけだったんだけど、どうもBOWERが使いやすいと思えなかった。

bower install jquery

ってすると、jquery.jsとjquery.min.jsだけが入手できんじゃねって思ってたら、単にgit cloneしてるような感じだった。

えらいこっちゃ

これがwww/js/componentsみたいなフォルダに入るからキツイ。

npmのnode_modulesも同じような仕組だと思うのだけど、node_modulesは公開用のディレクトリとは別だから全然いい。IDEではExcludeして.gitignoreすればいいし。

なにがしんどいのか

まるっとjsライブラリのリポジトリを落としてくるので、IDE上でこれらのリソースが検索対象に入ってじゃまになる

package.jsonを開こうと思ったら、requirejs/package.jsonを開くことに……

かといって、componentディレクトリを除外指定すると、本来使うjs(jquery.jsとか)が検索対象外になるのは、あまりよくない

サーバーにアップするのがダルい。

管理するファイルは少なくしたい

解決策 copyかconcatして持ってくる

grunt + bower で一気に環境構築 | デブ ハゲ ここではgurnt copyしてdestディレクトリに持って行っている

なるほどなるほど。こうやって持ってくるもんなんだね。

おれの場合はいつもライブラリ系はconcatで結合してlib.jsみたいにしてたから、こうしてみた。ついでにcopy版もどっかで使うかもなので書いといた。

以下、ざっくり例

最初がめんどくさいけど、これでIDE側もストレスなく、bowerをちゃんと使える状態までもってけた！

[jigoku-no]

Gruntのwatchで更新されたファイルだけをFTPできるようにする

全部FTPやっちゃうと遅いので、更新のあるファイルだけアップできるようにした。

やってること

watch に nospawn: true を追加して、設定を上書きできるようにする

grunt.event.on "watch", (action, filepath) -> でフック

ftp-deploy の exclusions から該当のファイルだけを残す

[jigoku-no]

CreateJSしてみた

無茶な作り方をすると重い

でも、Flash感覚で作れて、一瞬で作れるっぽい気がする

マウスイベントが若干ややこしい。

[jigoku-no]

ImageMagickで飛び道具サンプルを試してみる

Imagemagick本買ったけど、実用的な内容で、変態的な使い方は書いてなかった

書いてる内容

主要なコマンドのざっくり解説

convert (いつも使うやつ)

display (GUIでいろいろできる)

animate

import

identify

mogrify

montage

composite ()

トリミング・リサイズ

図形描画

画像結合

文字列処理

などなど。実用的なリファレンスだが、おれの求める変態的な内容は書いてなかった。なので、どんなエフェクトがあるかを試したりしてログしていこう

主要な変なエフェクトを使ってみよう

ImageMagick

モノクロ

ハイコントラストなモノクローム。クマが粒子になった。

convert -delay 6 *.png -monochrome -coalesce -layers OptimizeFrame +dither jigoku.gif

反転

convert -delay 6 *.png -negate -coalesce -layers OptimizeFrame +dither jigoku.gif

輪郭抽出

星空になった。イカしてる。レベル補正やポスタリゼーションと組み合わせたら、いろんなものに応用できそう。

convert -delay 6 -dispose background *.png -edge 3 -coalesce -layers OptimizeFrame +dither jigoku.gif

Charcoal 木炭画

convert -delay 6 -dispose background *.png -charcoal 3 -coalesce -layers OptimizeFrame +dither jigoku.gif

paint 油絵風

convert -delay 6 -dispose background -paint 5 *.png -coalesce -layers OptimizeFrame +dither jigoku.gif

わかりにくいので別バージョンでやってみる

(東進ハイスクールの林先生を抜き出すffmpeg)

ffmpeg -i original.mp4 -vf scale=480:-1 -r 10 -ss 19.3 -t 3.1 img%03d.png

スケッチ

convert -delay 6 -dispose background -sketch 0x10+135 *.png -coalesce -layers OptimizeFrame +dither jigoku.gif

Spread

convert -delay 6 *.png -spread 3 -coalesce -layers OptimizeFrame +dither jigoku.gif

implode

convert -delay 6 -dispose background *.png -implode 3 -coalesce -layers OptimizeFrame +dither jigoku.gif

swirl

convert -delay 6 -dispose background *.png -swirl 180 -coalesce -layers OptimizeFrame +dither jigoku.gif

wave

convert -delay 6 -dispose background -wave 5x5 *.png -coalesce -layers OptimizeFrame +dither jigoku.gif

カラーハーフトーンもできる

画像処理についてあれこれ: ImageMagickで、画像にハーフトーンのディザリングをする

GIFアニに応用するとすごくオシャレになる。実写に合わせるとオサレ。

convert -delay 6 -dispose background *.png -ordered-dither h6x6a,2 jigoku.gif

ほかにも

いろんな技があるようだ

distort ImageMagickで画像を変形させる

ImageMagickで青色っぽい部分以外をスケッチ調に変換する

もうちょっとグイーンとかぐおーんとかやりたい

ターミナルでやるのもめんどくさくなってきた。pythonかなんかでできるものなのかな。

[jigoku-no]

FFmpegでGIFアニ用のPNGを吐き出すメモ

GIFアニ作成用でコピペで使っていたけど、ついでに覚えとこう

480pxにスケールして、フレームを10に落として、pngで出力する

ffmpeg -i original.mp4 -vf scale=480:-1 -r 10 img%03d.png

-i 入力ソース

-vf フィルター系操作(-filter:v)

scale: スケール。高さに-1を入れると勝手にアスペクト比保ってやってくれる How to resize a video to make it smaller with FFmpeg - Stack Overflow

-r フレームレートを指定値に変換する。指定しない場合は入力ファイルの値を継承

これがこのエントリ「人間ていいな」の草原や東進ハイスクールの黒板をグリーンバックにしてimagemagickで抜いてみよう で使ってたコマンド。

thumbnailでもいけないこともない

フレームの落とし方の例として -vf thumbnail=2というやりかたでもいける。 thumbnailは数値ごとのサムネイル画像を作成する。本来がサムネイル作成用なので、引数は2以上でなくてはいけないので、フレームを間引くなら -r オプションのほうがよい。

thumbnail は tileができるようなので、これで遊んだほうが楽しそうだ。

ffmpeg -i original.mp4 -vf scale=80:-1,thumbnail=15,tile=8x8 img1.png

これなら誰が一番長く尺を取っているのか、というのもすぐわかる。

以下参考

公式

imagemagick同様、読みにくい Documentation

リファレンス的なやつ

最新FFmpeg - MobileHackerz Knowledgebase Wiki ↑ここに死ぬほど載っている

SE奮闘記: 【ffmpeg】動画変換のコマンド一覧メモ よく使うやつだけ載ってる

【ffmpeg】動画から特定フレームを画像で出力する方法 : ニコニコ動画研究所

使い方/サンプル

なんとなく基本がわかる

サンプルで使って慣れる。ffmpeg の使い方。 - それマグで！

リナックス LINUX 初心者の会 - ffmpeg 使い方

[FFmpeg] FFmpeg コマンドメモ | hirooka.pro

ffmpeg と ImageMagick で動画をアニメGIF 変換

[jigoku-no]

Android ANEをつくるにあたり、プログラマとしてあるべき姿に気付かされた話

あまり技術的でないスピリチュアルで意識高い系な話は誰得状態になるので、増田あたりで書くべきかとも思ったが、ここは地獄だし書くことにした。

スピリチュアルな側面が大きいので、まず結論

「苦しみから解放されたい」というモチベーションより、「仕組みを知りたい」という欲望を。

エラーメッセージから逃げない

経緯: AndroidプッシュANEをつくっていた。

Androidのプッシュをするにあたり、UrbanAirshipというサービスを使うことにした

Andoirdのプッシュの仕組みがC2DMからGCMに変わっていた

プッシュには端末のトークンを取得する必要があるが、UrbanAirship独自のデバイストークンの取得が必要であった

ここで、そのへんにあるフリーのGCMプッシュ用のANEは使えず、自力でANEを作成しなくてはいけなくなった

サンプル通りに動かしても、動かなかった

という、初めて挑戦する課題において、動かなくなる壁にぶつかっていた。

初めて挑戦する技術において、とるべき態度

右も左もわからない状態ではこの苦痛から早く解放されたい、という気持ちが強くなる。

なんでもいいから形にして終わらせたいと思うか

一方、プログラマとしてのあるべき姿は次である。

Androidの挙動や仕組みから学び、自分の支配下におこうと思うか

これらはまったく相反する気持ちであり、同居する場合もある。俺がまさにそうだった。

一刻もはやく、この苦しみから解放されたいと思う気持ちに負けた

エラーメッセージを無視して、自分の思い込みを元にしたデバッグ方法を選択した

結果、もちろん直らず、ものすごく時間を無駄にした

ここのくだりはこちら → エラーメッセージからメッセージと向きあおう

根っこから学んだ場合は、意図しない挙動に対してもすぐに対応できる

一方で、難しい課題を一発でクリアしていたところもあった。それは、根本から理解をしようとつとめていた箇所だった。

AndroidにはActivity, intentなどと聞きなれない単語がたくさんある。それは新しい概念のもとに作られているわけでもある。

プッシュされた文言をタップしても、アプリが起動しない問題にぶつかった。理由はreceiverというものがMainActivityにIntentしていなかったためだ。

エラーメッセージを無視したところよりも、こちらの方がより複雑だったと思う。

ちゃんとした意識付けをするには

根っこから怠惰な人間なので、普通にやってたらうまく行きそうにない。 自分がなりたいところをちゃんと見ておくことだろうか。意識の高さが要求される。なんつーか、はずかしいけど、ちゃんとやろう。

[jigoku-no]

エラーメッセージと向きあおう

スーパー時間のロスをしたので自戒系ポスト。

エラーメッセージには最短の道が記されている

エラーメッセージに書かれていることだけを、まずは疑うべきだ。

まずはエラーメッセージに書いてある手がかりをもとに、条件を洗いだしてすべてをクリアしていくのが近道

あるあるミス

初期設定系

設定コピペミス

xmlやjsonの入れ子ミス

jsonのidの書き損じ (AIR for Androidならidにair.が頭につくなど)

初期設定の類である。一度しか通らない道は、ミスの温床であり、見つけにくいものでもある。

iOS系

プロビジョニングとアプリIDの不一致

Android

パッケージ名にair.が入っているか？

入ってないのが正解だが、C2DMでの設定などにはair.からのパッケージ名を入力する

エラーメッセージからエラー範囲を予想する

今回ハマったのはUrbanAirshipというサービスでの設定ミスだった。

GCM Failure: INVALID_SENDER

というエラー。自分がミスりそうなところばかりやってたら2時間経過してた。

ここから割り出せるのは

Sender_idがおかしい

Sender IDは正しいか？(プロジェクトナンバーを使用しているか？)

UrbanAirshipでの設定

Api Keyは正しいか？

パッケージ名は正しいか？

アプリ側でのSenderIDは正しいか？

設定ファイルは正しいか？

develop, productionの設定は正しいか？

というところか。

このメッセージからは、このあたりをしらみ潰しに当たるべきで、それ以外の自分があやしいと思い込んでいるところはスルーすべきなのだった………。

なぜこうなったのかは次回

心の弱さが起こすのです

[jigoku-no]

iPhoneで回線速度シミュレートしてみよう

iOS6以降では回線速度シミュレートが簡単にできる。Xcodeが必要だけど、すぐにできる。

開発モードをONにするだけでOK

iPhoneをMacにつなぐ

Xcode [Window] [Organizer]で[Use for Development]を押す

iPhoneの[設定]に[デベロッパ]が追加される

これでOK！

開発モードでできること

Energy Diagnostic (電池消費のログ取得)

Network Link conditioner (回線速度のシミュレート)

iAd Developer App Testing (iAdの設定、表示頻度、切り替え秒数設定)

PassKit Testing (PassBookまわりのテスト)

回線速度のシミュレートをしよう

Network Link conditionerに入るとそれっぽいのが並んでいるのでえらぼう。

これでSafariだろうが、アプリだろうが回線速度が制限される！

わーい！デバッグ終わったら、もとに戻すのをおわすれなく！！

[jigoku-no]

HTMLでひらがなとカタカナの文字のトラッキングをして、文字組を改善しよう

HTMLは文字組がガチでダりーんですけどぉ。みたいな声をよくきく。

↓これは画像なんだけど、単純にletter-spacing: -0.1emを適用している。

英文と漢字がすごい詰まっている。 日本語はアキすぎ。きれいじゃない。

カーニング、トラッキングの解説は↓が詳しい。なんとなく、お作法がわかるとおもう ワンランク上のデザインにはかかせないPhotoshopの文字詰め「カーニング・トラッキング」についてのまとめ

ひらがなとカタカナをspanで囲み、spanにletter-spacing: -0.1emしてみると失敗する

普通にひらがなとカタカナをspanで囲んでletter-spacing: -0.1em;している。

しかし、意図した結果とちがう。「前向き」の「向」と「き」が離れすぎてる。 どうやらletter-spacingは設定した文字の、後ろの文字を詰めるらしい。

なので、ひらがな、カタカナの1文字前の文字にspanを適用してみよう。

ひらがな、カタカナの1文字前の文字にletter-spacing:-0.1emする

だいぶよくなった

ひらがなorカタカナの取得の参考↓ javascriptで日本語文字の種類（漢字・ひらがな・カタカナ）を判別するためのメモ - 超自己満足プログラミング

以下、コード

[jigoku-no]

Unity入門講座に行ってきて、前向きな気持ちになりました

第2回 京都インディーズゲームセミナー Unity入門講座 : ATND

すごいおもしろい内容でした。以下、ざっくりメモ。 勘違いして聞き取ってるところもあると思います。 おれの個人的な感想は()内に書いときます。

内容

「Unity 超入門 〜Unityって何だ？〜」

そもそもUnityって何？　基礎知識を中心に紹介

「Unity ライブコーディング – 2D ゲームを作ってみよう！」

Unityでのゲーム制作を実演

「ゲーム作りは○○だ」

高橋さん、山村さんと天谷さんにとって、ゲーム制作とは？

Unity 超入門

IDEでいろいろできます

すぐに3Dのオブジェクトをシーンに配置できる

すぐにゲーム画面内に反映

PSD修正 → 即反映

JS修正 → 即コンパイル → 反映

Asset Storeで3Dのモデルとか、スクリプトとか買えます。

マルチプラットフォームです

Unityはトライアンドエラーが超やりやすい環境。(このへんはFlashと同じか、もっと手数がすくないのかもしれない、と思った)

事例1 Bad Piggies

Bad Piggies

Angry Birdのスピンアウト作品的な。

Angry Birdの豚がメイン

Angry Birdとは違うコンセプトで作りたい

→ プロトタイプ

→ Unity

→ いい感じ

→ そのまま製品版までUnityでやっちゃおう

事例2 Jack Lumber

Jack Lumber

7ヶ月で作った。

が、最初の5ヶ月は迷走。ひたすら薪を割るゲームだった。

知人？のアドバイス「木こりが超人だったらいいんじゃね？」により、コンセプトがきまる。

7日間でプロトタイプ作って、固まる。

→ プロトタイプは7日間で終わらせる

→ で、1ヶ月でブラッシュアップする

事例3 Puzzle Juice

Puzzlejuice | iOS Game of Champions

Puzzlejuice Launch Trailer from Asher Vollmer on Vimeo.

テトリス + もじぴったん的なノリでブロックを消すゲーム

学生がプロトタイプを作る

→ 「ここまでできたから、誰かデザインしてくんね？」

→ デザイナーがついて、完成

Unityはプロ版？フリー版？

会社はプロ買ってね

個人・学生はフリーで事足ります

2Dゲームをライブコーディング

洞窟物語の天谷氏がデザイン、音、

Unity山村氏がプログラム

4-5日前からSkypeでやりとりしながら準備してきたそう

Unityは基本3Dなので、2Dを作るときは平面的に配置していく

基本機能でつくれる

もくもくとつくっていく

(DreamWeaverのビヘイビア的なノリでGUIでスクリプトを割り当てとかしてる)

2dゲームもポリゴンでやる

Unityは元が3Dなので、2Dの場合はシェーダーを消す必要がある

nonlit?とかいうやつにする

GameObjectのtagという機能を使うと便利だとか

矢が画面に一本だけしか発射できないような仕様

→ 画面内GameObjectにtag('ballet')があれば、キー連打されても矢を発射しない

敵の出現頻度をアニメーションカーブGUIで設定(トゥイーンのアニメーションカーブみたいな感じ)

(UnityのIDEは相当柔軟な感じ)

完成

もうちょっとブラッシュアップしたら、コーディングファイルがzipであげてくれるそうです。うれしい！

パネルディスカッション 「ゲーム作りは○○だ」

ゲーム作りは

山村氏 「ゲームだ」

制約の中でつくっていく

高橋氏 「ソーシャルゲームだ」

人を巻き込んでつくる

人にほめられる、という要素もある

天谷氏 「料理」

いい素材だったら塩だけでいいとか、しょぼい素材でも手間かければOK

料理を出すタイミングとか、お皿とか、どういうシチュエーションとか

Unityのいいところとか注意点とか

高橋氏

一回は失敗しておくとよい (Unity独特のなにかがあったりするのかな)

リソースまわりの管理大事

デザイナーとかもさわれると楽になる。それが強み

全員がさわれると効率的

デザイン組み込み後にデザイナーがキャラの動きを自分で微調整するとか

普通の開発では組み込み後はデザイナーはそういうことができない

山村氏

OpenGL、DirectX覚えなくてすむ

マルチプラットフォーム

モチベーションってどう保ってます？

天谷氏

環境を変える

休憩とる

水分補給

環境を変える

家でやってたらゲームや漫画とか誘惑

インキュベーションセンター的なところで仕事すると3倍能率上がった

ゲーム作ることが価値になることなのに、家にいると事務作業して仕事した気になったり。

休憩とる

2時間やって10分やすむ。能を休ませると休憩後にパリっと仕事できる

というセミナーでした。前向きな内容でたのしかった。

Unityやってみよう！という気持ちにさせてくれるセミナーでした。 とりあえず、プロトタイプをつくってみよう！

あと、スピーカーのみなさん、それぞれ自分の信念をお持ちでスラスラと言葉がでていました。しかもわかりやすい言葉で。そのへんのひとの会話ではない感じで、ゲームへの思いを聞いているだけで勉強になった。深い。

とくに天谷さんの話に引きこまれてしまって、ゲームって絵本とか映画とかみたいに世界を作って見せるものだよねってすごいおもった。

突拍子もない世界のほうが引き込まれるとか、

(マリオは人間が土管に入ってカメを倒すとか、今回のライブコーディングゲームの世界ではネコが魚を矢で射る)

ゲームの絵はスクショだけで楽しい妄想できるかとか、

なるほどーと関心しきりだった。

京都で6月にまたやるらしい

です！

[jigoku-no]

初めてPython触ってSublimeTextのプラグインを作れるようになったので、篠崎愛or突然の死。

いきさつ

「CSVのやりとりめんどくさいよね」

「GAEでモデル作って管理画面からいじってもらえばよくね？」

→ Pythonでも触ってみるか

Pythonのメリット

Python書けるひとに聞いたところ

「CoffeeScriptができるなら、Pythonもできる」

難易度的には JS >>> python >> coffeescript だとか。

画像処理がそこそこできるらしい

GAEで使われてる

おしゃれっぽい

Python初めてだったけど、簡単に書けそうな感じ

20分くらいここを読んで把握。Python基礎文法最速マスター - LazyLife@Diary

なんか作って覚えよう

「Sublimeのプラグインの作り方」でググる。すぐできそう。

Sublime Text 2 のプラグインの作成方法 - ゆり日記 と、APIリファレンス があればすぐできる。

作った物 「篠崎愛or突然の死。」

ファイルを保存するごとに

篠崎愛が俺に近づいてきて、

♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡♥♡

たまに、突然死ぬ

使える言語を増やしなさいと、いろんなプログラム本に書いてた

プログラマが知るべき97のこと にも書いてたような気がする。

使える言語が増えてよかったー。

ちなみに、冒頭のCSVはGAEでやればよくね？という話は、なかったことにしました。

GitでCSV管理してるほうが融通がきく……。