- 2011-09-06 (火)
- CSS | Design | HTML・XHTML | JavaScript
Node.js Knockoutに参加しました。
8月27〜28日の48時間でnode.jsを使って制作する大会?に参加しました。
作品の内容はリアルタイムで複数人が演奏するというもので、メンバーはプログラマー3名とデザイナー1名(自分)で先輩の家に泊まり込んで2日間ぶっ通しでデザインやら開発を行ったんですが、結果完成せずでした。。。
ただその限られた時間の中で自分はデザイナーとして、みんなの認識を合わせつつワイヤーを組んでデザインしてマークアップをしました。対象ブラウザをchromeのみにしたことで、HTML5やCSS3も積極的に取り入れられたので勉強になりました。
今回は残念でしたがまた来年挑戦できたら良いなぁと思います。
日の目を見なかったデザイン。。。

また他のチームの作品を見ることができるので次回の参考にでもしようかなと思います↓
http://nodeknockout.com/
- Comments: 2
- Trackbacks: 0
- 2011-04-15 (金)
- JavaScript
jQuery Mobileで少し遊んでみた
最近よく耳にするので簡単ですが実装してみました。
現在はwordpressのプラグインであるWPtouchでスマホ対応は任せっきりなのでプラグインを使わずにできたらなと。
- 現在 ※WPtouch使用時

- jQuery Mobile適用

左側のメニュー部分を行ったのですが、下記だけでこの表示になります。
<ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b"> <li data-role="list-divider">カテゴリー</li> <li><a href="">CSS</a></li> <li><a href="">Design</a></li> <li><a href="">Flash</a></li> <li><a href="">HTML・XHTML</a></li> </ul>うーん素敵過ぎます。現在test環境でリニューアル準備中なので、その際はがっつりと使用したいと思います。
- Comments: 0
- Trackbacks: 0
- 2011-04-11 (月)
- 学び
簡単なiPhoneアプリを作ってみました。
単純に入力した数字を選択した条件に対して出力するだけで、アプリ?と言えるものかわかりませんが、一度作業工程を知りたかったので作ってみました。
会社の同期に教えてもらった目指せ!iPhoneアプリ開発エキスパートをまるまる参考にさせていただきました。
詳しい手順は参考にさせていただいてサイトが非常にわかりやすいのでそちらを参考に。
- Comments: 0
- Trackbacks: 0
- 2011-04-05 (火)
- 学び
iPhoneアプリ制作
iPhoneを使用していていくつものアプリにお世話になり、そもそもこういうのってどういう風に作っているんだろうと疑問がでてきたのと、単純に何か作ってみたいと思ったのでとりあえずiPhone SDKをインストールしました!
一度簡単なものを作って一連の流れを体感してみようかと思います。
- Comments: 0
- Trackbacks: 0
「HYPE Frameworkで創造力を加速する」に参加してきました。
先月FITC 2010 Tokyoのワークショップである「HYPE Frameworkで創造力を加速する」参加してきました。
主に配布されたサンプルをもとに進んでいったので、メモはぶつ切りですが備忘録までに。
HYPE frameworkとは
HYPE Frameworkは、ActionScript 3を土台にして築かれた、創造的なコーディングフレームワークです。HYPEの主なゴールは、FlashとActionScriptの入門者が、プログラムの方法を学びながら、創造的に遊び、自らを表現できるようにすることです。
まあHYPE使うと、難しいことも簡単にできちゃうよということです。
サンプル
- ObjectPool
- 例えばステージの左から右に消えていくムービークリップをそのままにせずに、ステージから消えたらきちんと消す?みたいな。
概念は理解できていないですが、無限に増えていくオブジェクトをステージから消えても何も処理しないと徐々に動作がもっさりしてくるとか。
addClassの引数に数を指定することで、優先させることが可能だったり。
- GridLayout
- グリットに沿ってオブジェクトを配置する。
- ShapeLayout
- シェイプに沿ってオブジェクトを配置する。
円とか、文字とか。
- Colorに関して
- 写真の色が欲しい場合は、photoshopでgifで32bitディザリングなしで書き出し、flashの色見本でgif画像を読み込み色を増やす
- 色に関してはcoloPoolを使える
- bitmapデータをリンケージすることで、色を抽出する
- pixelColorListの引数は3つ(画像のインスタンス名、横位置、縦位置)
- swfをイラレに持っていく場合は、swfを右クリックでprint、そしてポストスクリプトとして保存をする ※macのみ
windowsではacrobatを使用して、pdf化→イラレ - HYPEの次期バージョンではalphaやグラデーションも付けて書き出せるようになるかも
- cs5からFXGに対応(イラレ⇆flashという作業がやりやすくなる)
- BitmapCanvas
- ベクターをビットマップへ。
ベクターデータよりもビットマップデータを動かす方が1.5~1.75倍早いらしい。
あと、Progressionが早いのはピクセル表現されていてflashはベクターなので、ということらしいです。
- SoundAnalyzer
- 読み込ませている音に反応してオブジェクトを動かしたり。
個人的に一番おっと思ったモノで、方法もHYPEなら簡単でした。
その他に、
- flashは3600×3600までのステージサイズが限界だが、hypeは越えた場合は分割してくれる
→ピクセル近似がハイクオリティなので劣化
→ベクターをピクセルに保管しているので、拡大しても汚くならない?
→pngのmaxが12万ピクセルなので、それ以上の数値でする場合にはクラッシュする - 次期バージョンではシステムズという概念と、マイクからの入力に対応するsoundanalyzerが追加されるとか
本当に全くActionScriptかじりたてなので、付いていけなかった場面もありましたが、ますますFlashでモノ作りしたいという思いが強まったので参加して良かったです。
- Comments: 0
- Trackbacks: 0

