iPhoneのWebアプリを作ってみようと27日の夜中に思い立ち、2日程度でやってみました。
気になったのはAppStoreのランキング10位にあるスタバメモ[無料]と言うアプリ。(29日現在36位)

こんな感じの大学1年生の時に企画してボツにされたよなー。
とか思いながら、個人用にjQuery Mobileを使って作ってみようと思いました。

URL:スタメモβ

Webアプリと言うことでCodaでマークアップ。
スクリーンショット
Codaの良いところは左にフォルダ、真ん中html、左側プレビュー又はcss表示しながらできる事。

iPhone画面1簡単に書いてこの状態。
ここからホームに置いた時の処理をしていきます。

<link rel="apple-touch-icon" href="icon.png">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!-- default black black-translucent -->

ホーム画面に置いた時のアイコンの処理を
スケールのサイズを設定し、ツールバーを消してフルスクリーンの設定、ステータスバーの設定をし、ホーム画面に置く準備が完了。

iPhone_ホームホーム画面。今回はアイコンに光沢ありを選択。

iPhoneホームに追加したときのスクショ
トップページ。
上下のステータスバーを無くしてフルスクリーンに設定したため、見やすく。

iPhone_子ページ
子ページ。
説明文と料金の間隔が微妙。

β1と言う事で2日間、約6時間程度で作ってみました。
次回のβ2で画像周りと独自cssでのレイアウト、トップ画面のメニュー表示をカテゴリ別に分けてスッキリとさせたい。

その次の更新くらいで子ページからカスタム画面をポップアップで表示してカスタマイズ
→ okでカップの側面に描かれる暗号を画像で表示してSNSに流せるようにしたいな。