既に百式さんのところで紹介されていますが、開発合宿に参加してきました。しばらく参加していなかったので、本当に久しぶりですね。サイドフィードの赤松さんと、読書メーターの赤星さんとの合計4名での合宿でした。開発合宿だからといって食事費を削ってはいかんですね。たっぷり良いもの食べた方が開発にも力が入るなと実感しました。珍しく2日間かなり集中して取り組むことが出来たのもよかったです。

もう2,3年前になると思いますが、「egoport」というブックマーク数やブログからのリンクをチェックするための1ページサイトを作ったことがあります。当時としてはまずまずなのですが、今回は iPhone に特化した別バージョンを作ることを課題にしました。

とはいっても、前と一緒のようにフィードをとってくるだけでは今では意味がないですよね。ブックマークサービスでコメントを書いている方もいますし、Twitterのようなマイクロブログでの注目度もチェックしてみたいところ。前のバージョンでは映し出されているのが結局自分の記事という結果に陥ったことを反省し、今度はいかに人が記事に対して注目しているのかが分かるような UI にするよう心がけました。時間の都合上、プログラムは一切書けませんでしたが、モックアップは実際見て触ることが出来ます。

egoport (要iPhone/iPod touch) | スクリーンショット

egoport for iPhone preview

作ってみていろいろ気付いた点を以下にまとめてみました。

  • ネイティブアプリのように下部に固定メニューを設置しようとしましたが、Mobile Safari では、position:fixedが適応されない模様。ビューエリアを減らさないためなのかもしれませんが、ちょっと残念
  • 最初、データを SVG 形式のグラフに書き出そうとしましたが、結局 Google Chart API に落ち着きました。JavaScript を必要としないですし、見た目のカスタマイズもしやすいですね
  • チェックするブラウザがひとつだと、気楽にポジショニングを使って自由にデータのレイアウトが出来るのが楽しいです。「こう見せたいからこうやってマークアップしたほうが良いかも」と意識をしなくても CSS でどうにか出来るのは良いですな
  • メタタグか何かを使って Mobile Safari がローテーションしてもレイアウトは縦のままに固定にしたかったのですが、方法が分からず。
  • メタタグを使ってアドレスバーをはじめとした UI コンポーネントを排除し、フルスクリーンにして見せることは可能ですが、ホームスクリーンに保存しただけのみに適応されます。また、別ページへ移動すると Safari が立ち上がってしまうので、Ajaxなどを使いすべて1ページで完結するように設計しないと恩恵は得られないかも
  • 試しに「Manifest File」というデータをローカルにキャッシュするためのファイルを作ってみました。3Gネットワークでも表示速度はまずまずなのですが、それがキャッシュしたからかどうかは不明。Web Inspector にでもチェックするための機能が実装されていると嬉しいですね

幾つかのフィードをひとつに合わせたり、毎日の注目度の差分を出したりなど、果たして出来るのか不安な課題がありますが、もうしばらく開発を進めてみようと思います。サービス化するほどの価値はないですが、せめてサーバーインストール型として配布出来たら良いのですが、そうなるとあまり設定が面倒にならないような工夫も必要ですね。気が遠くなってきますが、勉強ついでに少しずつやるしかないかな。