Upgrade to Pro — share decks privately, control downloads, hide ads and more …

スマートフォンで使うWebアプリ

 スマートフォンで使うWebアプリ

2009-12-12 スマートフォン勉強会 関東 No. 4で発表した資料です

高見知英
PRO

December 12, 2009
Tweet

More Decks by 高見知英

Other Decks in Technology

Transcript

  1. 2009年12月12日 高見知英

  2. 自 己 紹 介 • JavaScript • UWSC(の内蔵スクリプ ト) •

    JAVAなど • 磯子クリエイティブチー ム • 横浜のコミュニティを盛 り上げる会 • Program Workshop for Juniorsスタッフ
  3. 持ってる端末 ◼ Windows Mobile ◼ 使い続けてもう5年 ◼ Advanced/W-ZERO3[es] ◼ Android

    ◼ HT-03A(まじろん)
  4. None
  5. アプリ作りたい! ◼ 開発環境を整えるのは面倒? ◼ Windows Mobile ◼ VisualStudioは高いし… ◼ Android

    ◼ Eclipseは無駄なメニュー多いし
  6. Webアプリならどうか ◼ テキストエディタでも作れる? ◼ PC用にアプリを作らなくてよい ◼ 複数の端末から気軽に使える

  7. スマートフォンのブラウザ PCのブラウザ ◼ 画面が小さい ◼ 入力機構が少ない ◼ 通信速度(など)が遅い

  8. アプリを作る上で 気をつける要素 ユーザーイン ターフェース 開発手法 携帯独自の注 意点

  9. ユーザーインターフェース

  10. 他のアプリから学ぶ ◼ Google Spread Sheet ◼ Twitter ◼ (アプリじゃないけど)cnet-japan

  11. Windows Android Google Spread Sheet の場合

  12. Google Spread Sheet の場合 ◼ 「リスト表示」のみが使用可能 ◼ 利点 ◼ どこでもデータの追加編集が可能

    ◼ 欠点 ◼ キーボードなし端末では入力困難
  13. Twitter Windows Android

  14. Twitter ◼ 公式に提供された機能を使用可 ◼ 利点 ◼ どこでもTwitter出来る!…? ◼ まあ、今更ねえ… ◼

    欠点 ◼ ボタンが小さい!タッチできない!
  15. Windows Android CNET Japanの場合

  16. CNET Japanの場合 ◼ ニュース記事を辿ることが出来る ◼ 利点 ◼ モバイル向けに最適化されていて 表示が速い ◼

    欠点 ◼ 不意に画面を切り替えると戻れない
  17. ユーザーインターフェース ◼ 端末に表示する情報を少なく ◼ 使える機能を抑える ◼ PCで仕込みスマートフォンで仕上げ ◼ 入力は少なめに、ボタンは大きく ◼

    戻る/進むをやりやすく
  18. 開発手法

  19. Google Web Toolkit ◼ Googleが作ったWeb開発ツール ◼ JAVA→JavaScriptのコンパイル ◼ 動的に変化するサイト作りがしやす い

    ◼ Googleも使ってる…?
  20. Windows Android GWTで作ったWebアプリ

  21. DEMO

  22. JAVAが使える サーバ ◼ Google App Engine ◼ Googleのクラウドサービス ◼ JAVA/Pythonが使用可能

    ◼ GWTも使える
  23. 携帯独自の注意点

  24. ポイント 状態遷移に気をつける 回線/処理速度に気を使う

  25. 状態遷移に気をつける ◼ 再読込/戻る/進む ◼ タスク管理上の問題も ◼ ex). HT-03Aのブラウザはアクティブ 時に再読込を行う …とか

    ◼ いつ落ちるかわからない ◼ マルチタスク端末は注意
  26. 回線/処理速度に気を使う ◼ 回線速度とも、処理速度とも ◼ どうしてもPCよりは遅い ◼ なるべくシンプル・少ないデータで ◼ ユーザーをいらいらさせない作り

  27. まとめ

  28. Webアプリを作るなら モバイルも気にしよう ◼ コンパクト版でも、同じものでも ◼ ユーザビリティを気にする必要 ◼ 画像はなるべく軽く ◼ 読めなくても支障がない作りに

    ◼ 横幅が小さくても崩れないページ
  29. おわり ご静聴ありがとうございました