NUTハッカソン2014成果報告
- 1. NUT Hackathon 2014 成果発表 ＼ ٩('ω')/و ／ @Joe_noh
- 2. ３つ あります ＼ ٩('ω')/و ／ ＼ ٩('ω')/و ／ ＼ ٩('ω')/و ／
- 3. 1. Yakman ● テクノロジーが果たすべき役割とは – みたいなことを酔っ払って考えたら浮かんだやつ – 作りかけで放置してたものを仕上げた – 複合役満は無し ● https://Joe-noh.github.io/yakman
- 4. 1. Yakman ● つかったもの – CoffeeScript – Sass – Middleman ● CoffeeScript と Sass をよしなに ● gh-pages へのデプロイも – SVG ● 拡大縮小や色変更など自由自在ﾋｬｯﾎｰ !! – velocity.js ● js でアニメーション ( 速いらしい )
- 5. 1. Yakman ● 工夫したとこ – SVG をどうやって貼るか ● background-image として読ませると簡単 – だけど fill とかの CSS が効かなかった ● DOM として扱わねばならぬ – 使わない漢字も最初に全部読み込んじゃえ – display: none で隠す – 使うときにそこから引っ張ってくる
- 6. 2. Replace with ＼ ٩('ω')/و ／ ● Chrome Extension – クリックしたやつが＼ ٩('ω')/و ／になる – レイアウトがシッチャカメッチャカになるので条件つけた ● 子要素を持たない ● テキストが 4 〜 20 文字 ● https://github.com/Joe-noh/replace_with_it
- 7. 3. くるくる ● Canvas でゲーム – 反射神経系 – 名前は適当 – 自分で書いたのは 200 行弱 ● https://Joe-noh.github.io/kurukuru
- 8. 3. くるくる ● 使ったもの – CanvasEngine ● Canvas をつかったゲームのフレームワーク ● あんまり活発じゃないっぽい ● Kinetic.js のほうが有名？ ● これの話をあとでするかも – あとは Yakman で使ったものとほぼ同じ
- 9. 3. くるくる ● 工夫したとこ – 回っているのはキャンバス自体 – キャンバスを円い <div> で囲ってる – 円に内接する正方形のキャンバスがあるけど隠してる – 座標計算とか回転演算してない
- 10. 3. くるくる ● まるごと回転の問題点 – まっすぐな状態に戻せない ● できるような気はしてる – スコア表示するとそれも回っちゃう ● キャンバス２枚連動させられないか？ ● その他 – 難易度がマシンスペック依存
- 11. おつかれさまでした