Windowsでiphoneのwebアプリを作るツール

Windowsでもwebアプリなら、iPhoneアプリを作ることができます。

こちらのオライリー本がかなり詳しく解説してるのでオススメ。

iPhoneアプリケーション開発ガイド ―HTML+CSS+JavaScript による開発手法

またwebアプリ制作の補助としてMobiOneという開発ツールがありまして。
こちらもかなり使えそう。リンクが張れるのでアプリのプロトタイプの作成にも使えそうな感じです。

ダウンロードは→403 Forbidden
無料です。

最近聴いているvocaloid曲を10曲チョイス

なんか、ふとブログを見返してみていたらこんなエントリーが
今年のベストソング - さくっとモバイル

今聴いている曲となんら差がないじゃん…FACTとMoonbugがないくらいか？
ということに驚愕。
自分の中での音楽観は2007年で固まってしまったのかなあと、ちょっと呆然としてしまいました。

それにしても最近聞いているのはvocaloidばかりなんですよね。vocaloidは完全にマーケティングから離れたところの創作活動なので、買わせよう的な作為も感じないから気ままに楽しめるので聴き続けているのかな、と思いつつ。
やはり当初から感じてましたけど、売れ線狙いじゃないので濃いんですよね。その濃さがたまらない。
くどいくらいサビを重ねた曲とか、ジャーマントランスにとがった曲とか。

id:kawangoさんが熱く語るように、最近はオリコンチャートにも顔を出し始めてるくらいなんですよね。

商業音楽がボカロ音楽に勝てない理由 - はてなポイント３万を使い切るまで死なない日記

やっぱ濃さ＝芸術性の高さに直結してるんだろうなと思う次第です。

最近のボカロは般若心経旋風が巻き起こってますが。そのシュールさも全部込みで面白いなあと思っています。

以下、最近気に入ってるボカロ曲をちょっと紹介します。

• トリノコシティ

タケノコシティという替え歌も面白かったですが、そのオリジナル。自分の存在について真剣に考える10代の歌。テンポの良い曲がくせになる。

• マトリョシカ

去年からスマッシュヒットを飛ばし続けてるハチさんの最新作。スカコアのロシア風というおもしろい曲調です。ざくざくしたギターのリフが好きなんですよねー

• リフレクト

自分を信じられない、傷つきやすい10代の歌って感じがとても良いんですよね。おいらもこんなときが会ったなあと。

• ナキムシピッポ

8bitピコピコテクノ。ざくざくいうリズムの音はちょっと電気グルーヴっぽい。

• ハロ/ハワユ

radwinpsのようなリズム感のある曲。キャラのイラストがハチクロっぽくて、歌も良いです。かなり最近聴いたなあこれは。

• モザイクロール

ざくざくしたロックチューン。アニメーションがシャフト風味で相当レベル高い。これも自己破壊的な歌だなあ。

• 空中アクアリウム

トリノコシティの40㍍Pの曲。アジカンみたいな疾走間を持ったロックナンバー。青空を見ながら聞くと気持ちいいです。

• The Endless Love

このジャーマントランスは本当に聞いていて気持ち良い。鼻そうめんPはアニメ制作のBONESの方です。さすがプロの仕事という感じ。

• 自白

coccoの新曲かと思うくらい似てるｗリンは歌い上げる曲にもってこいみたいですね。

• ローリンガール　KAITOver + ラップ

最後は、人の声との掛け合わせですが、この疾走感は朝、通勤急行をのってるときにぴったり合うので良くきいてます。

とりあえず10曲。もっとたくさん良い曲があるし、今この瞬間にもリリースされてそう。

全体傾向としては、閉塞感を持った10代の苦悩とか歌ってる曲が多いと思う。商業音楽ではあまりないとおもうので、vocaloidの曲で救われた10代は今は多いのかもなあ、とかとか。

3年目を迎えたvocaloid旋風はますます大きくなっていくでしょう。海外からも注目されているみたいだし、そのうちvocaloid曲がビルボードを駆け上がったりして。

KCP+はOOCSSに対応していた

auのBREW4.0端末、KCP+ともいいますが、今日いろいろ試していましたら、なんとOOCSS（オブジェクト指向CSS）の根幹でもある、classの複数指定に対応していました。

クラスの複数指定とは、class="CLASS1 CLASS2"のように、半角スペースで区切って複数のclassを反映させる仕組みのことです。

OOCSSについてはこちらをご覧ください→オブジェクト指向CSS（OOCSS）について - さくっとモバイル

クラスのカプセル化は担保されないんですけど、CSSのスパゲティーコード化はある程度防げます。

ただ、KCP機種は未対応でした…。指定した複数のクラスがすべて反映されません。ということで、実用性は今のところゼロ。ということでした。

未だにKCP端末リリースされてるからなあ…早く切り替えてほしいよ。

サイト設計時の思考の流れメモ

普段、サイトを設計する際に考えるアウトラインをぼーっと眺めていたら、思考の流れを記号化してみたくなってしまいました。

ロジカルシンキングといえるかどうか微妙なところもありますが、そこは経験則でカバーといったところでしょうか。

あと、記号化といっても超適当ｗ
いずれちゃんと意味の通るものに書き換えてみようかな。

サイト設計シンキング

■要件整理
　A、既存サイトの解決すべき課題一覧
　B、プロジェクトの目的
　※B←Aのサマリ
　Aは対象サイトが抱えている課題、BはAを整理したもの。

■ターゲットユーザーの整理
　C１、トリガー、動機
　C２、ユーザーゴール、
　C３、必要なコンテンツ、
　C４、対応施策
　※C1→C2→C3→C4
　Cは仮説。イメージしやすいようにストーリーにする。演繹法で納得を得る。

■コンセプト
　D、方向性まとめ（コンセプト）
　※D←BとC4
　E、具体化するための施策
　※ユーザー×E→D
　　から
　　E←D/ユーザー

■サイト設計
　F、ターゲットごとに具体化した施策の体験フロー
　※F←E×C
　G、サイトストラクチャー
　※G←Fのサマリ

■画面設計
　H、ワイヤーフレーム
　※H←G＋E×C
　I、ビジュアルデザイン
　※I←H＋B

んー、超適当。誰にもつたわらなそう。自分にインフォグラフィック的なスキルがあれば図式化できるのだけど。

モバイルwebブラウザの変遷まとめ

i-modeの場合

i-modeはNetFrontという日本純正のモバイルブラウザを改造してできたものです。少ない1ページあたりの容量で表現を高めるために、絵文字を外字として割り当てている点が特徴的です。
言語はCompactHTML(chtml)という、HTMLのサブセットのような言語を独自に拡張したもので記述します。chtmlベースのi-modeはMOVA端末に搭載されていきました。

この当時の話が語られてる以下の記事が興味深いです。CompactHTMLは日本初でW3Cの仕様となった規格になります。

参考：５年先を見据えた携帯ブラウザー　ＡＣＣＥＳＳ鎌田社長　ｉモード10歳の肖像（３）　：日本経済新聞

やがてFOMAというシリーズがリリースされます。それまでのPDC端末ではなく、GSM互換の高速規格W-CDMAに対応したシリーズです。これらの端末には進化したNetFrontをベースとしたi-modeブラウザが搭載され、従来のchtmlの他、i-mode xhtmlに対応しました。

当初のi-mode xhtmlはMOVA全盛であまり利用されなかったですが、3キャリア1ソースというコーディング方法が注目され現在に至ります。
また、最近になってi-modeブラウザがv2.0にアップしました。クッキーやJavaScriptなどに対応し、ますます表現力が豊かになってきています。

EZwebの場合

EZwebは、当初海外での統一規格WAPをベースにしたモバイルweb言語HDML(wap1.1)をサポートしていましたが、従来のHTMLとは異なるマークアップ言語で敷居が高かった事は否めません。

ブラウザはOpenwaveというものを使用していました。Openwaveのブラウザ部門は2008年にPurple Labs（現Myriad）に売却され名前が変わっちゃいましたが、中身は変わっていません　
auやTu-KaのcdmaOne端末はOpenwave3.0だったため、HDML(wap1.1)で制作しなくてはならなかったですが、比較的早く3G規格であるCDMA1Xが導入されたため、環境が一変します。
CDMA1XのOpenwave v6.0はWAP1.3にXHTML Mobile Profileの規格を融合させたWAP2.0に対応していたからです。

CDMA1X以降、一貫してau端末はWAP2.0に対応していて、進化をつづけています。
ただ、3.5Gといわれる高速通信規格CDMA 1X WIN対応機種がリリースされた時はブラウザ自体をリプレースすることはありませんでした。
大きく変わったのは、BREW4.0を搭載したKCP+端末からです。そのタイミングで、v7.2と呼ばれるバージョンになり、タグの解釈が大きく変わりました。

参考：auのezwebブラウザver7.2対応のイロハ | 株式会社シンメトリック公式ブログ - 携帯開発から生まれる技術情報

ただ、Myriadブラウザv7の仕様と比較すると、相当機能を削って実装しているようです。

参考：
Untitled Page

Yahoo!ケータイの場合

おそらく、一番変化してしまったのは昔はJSkyと呼ばれた、今でいうYahoo!ケータイでしょう。
当初は１ページ辺りの容量を減らすために、MMLというJSkyHTMLを短縮形で記述する言語を用いてましたが、JSkyHTMLと完全互換があるため、機種の容量が増えるに連れ使われなくなりました。
J-Phoneもdocomoと同様PDC端末で、日本独自規格。ブラウザも独自のブラウザで癖があるものでした。（例えば、画像とテキストをaタグで囲むとバラバラにフォーカスがあたるとか…）

その後、J-phoneがvodafoneになると、JSkyはVodafoneLiveと名前を変えましたが、変わった当初はj-Phoneのリソースを引き継いでました。
ですが、W-CDMAに対応したVodafone Global Standardという中途半端な海外端末を経て、Vodafone3Gがリリースされます。

Vodafone3Gになると、ブラウザはopenwaveベースのものに代わり、xhtmlにも対応するようになりました。ただ、Vodafoneのxhtmlはxhtml basicと呼ばれる基本的なタグのサポートにとどまったもので、ブラウザは同じでもauのxhtmlとは異なるものです。

さらに、ボーダフォンが変に海外戦略をとったため、モトローラの独自ブラウザとか、ノキアのシンビアンベースのnetfrontとか、Obigo Browserとか、機種によってモバイルブラウザが異なるという自体になりました。
そのような中、日本の端末はNetfrontに移行するようになり、その後、VodafoneがSoftbankに買収され、Yahoo!ケータイになると3GC2という世代になり、docomoと同じくNetFrontベースのブラウザが採用されるようになりました。

最近では、945SHと944SHにSoftbankブラウザ2.0を搭載していて、iモードブラウザ2.0のようにJavaScriptが使えるようになっています。

参考：945SHはSoftBank2.0 - Kimura.Memo
仕様はMobileCreationで：ページが見つかりません

※おまけ
じつはソフトバンクケータイは3GC2の頃からJavaScriptが使えるらしいです。スクリプト不具合があったときのお知らせページに、リストが出ています。

参考：ブラウザのセキュリティ設定に関する重要なお知らせ（7月2日更新） | SoftBank

まとめ

■docomoのブラウザ

• iモードブラウザ（Compact NetFrontベース）:DoCoMo MOVA ※2012年3月31日に終了予定
• iモードブラウザ（NetFront 3ベース）:DoCoMo FOMA

※ノキアのみシンビアンベースのNetFront

• iモードブラウザ2.0（NetFront 3.5?ベース）:DoCoMo FOMA

※一部機能制限したiモードブラウザ2.0LEというものもある

■auのブラウザ

• Openwave　v3：au cdmaOne　※サービス終了
• Openwave　v6(6.0、6.2)：au CDMA1X/WIN(KCP)
• Myriad Browser(旧Openwave)　v7(7.2)：au CDMA 1X WIN(KCP+/BREW4.0)

■softbankのブラウザ

• JSky(J-Phone ｖ1〜3)：C型　※サービス終了
• JSky(J-Phone v4)：P型　※サービス終了
• JSky(J-Phone v5〜)：W型　※サービス終了
• Openwaveベース:Vodafone 3G(3GC)

※ObigoBrowser、その他海外のブラウザ搭載ケータイも当時リリースされた。独自タグ等の解釈は異なると思われる。

• NetFront3.4ベース：Softbank 3G(3GC2)

※3GCのNetfrontもある

• NetFront3.5ベース：Softbank 3G 2.0(3GC2 v2)

Packager for iPhone開発再開

Appleがデベロッパー規約を変更したことで、Adobeのflash→iphoneアプリ変換ソフトPackager for iPhoneで作成したiPhoneアプリがAppStoreに並び始めたそうです。
Flash開発者の方はほっとしたのではないでしょうか？

参考：Appleの方針変更により、Adobe Flash Professional CS5の「Packager for iPhone」で作成されたiPhoneアプリが復活 − MACお宝鑑定団 blog（羅針盤）

また、一旦開発を中止していたPackager for iPhoneの開発が再開するそうです。

参考：
Great News for Developers (Adobe Featured Blogs)

これで、Windowsでも書き出すところまではできるようになりますねー。

でもま、実機テストなどするのに結局Macが必要になるんですけども。

あと、気になるのはPackagerにはXCodeで作ったソースコードを読み込むでFlashに引き継ぐ機能ってあるのかな…ないかな。

スマートフォン画面解像度まとめ

2010/9/10現在に日本でリリースされたiPhoneとandroidの画面解像度とOS,ブラウザバージョンをまとめました。
※NexusOneも載せました。

viewportの話の際も触れましたが、Android用のサイトを作るとき、縦横切り替えすると画面ががたがたになるので、注意です。
特にXperiaはviewport設定を無視して320pxで表示しようとするので、さらに厄介でもあります。

スマートフォン画面解像度、OS、ブラウザまとめ

機種名	解像度（横×縦）	OS	ブラウザ
HT-03A	320×480px	Android 1.5→1.6	Chrome 3.1.2
Lynx (SH-10B)	960×480px	Android 1.6	Chrome 3.1.2
Xperia (SO-01B)	480×854px	Android 1.6	Chrome 3.1.2
IS01	960×480px	Android 1.6	Chrome 3.1.2
HTC Desire (X06HT)	480×800px	Android 2.1→2.2(予定)	Chrome 4.0
Nexus One	480×800px	Android 2.1→2.2	Chrome 4.0
iPhone 3G	320×480px	iPhone OS 2.0→iOS4.1	Safari 3.1.1
iPhone 3GS	320×480px	iPhone OS 3.0→iOS4.1	Safari 4
iPhone 4	640×960px	iOS4.1	Safari 4.0.5