Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

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

2,902 views

Published on

2009/12/12 スマートフォン勉強会 関東#4にて

Published in: Technology
  • Be the first to comment

  • Be the first to like this

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

  1. 1. スマートフォンで使うWebアプリ<br />2009年12月12日<br />高見知英<br />
  2. 2. 自己紹介<br />
  3. 3. 持ってる端末<br />Windows Mobile<br />使い続けてもう5年<br />Advanced/W-ZERO3[es]<br />Android<br />HT-03A(まじろん)<br />
  4. 4. スマートフォンで使うWebアプリ<br />
  5. 5. アプリ作りたい!<br />開発環境を整えるのは面倒?<br />Windows Mobile<br />VisualStudioは高いし…<br />Android<br />Eclipseは無駄なメニュー多いし<br />
  6. 6. Webアプリならどうか<br />テキストエディタでも作れる?<br />PC用にアプリを作らなくてよい<br />複数の端末から気軽に使える<br />
  7. 7. スマートフォンのブラウザPCのブラウザ<br />画面が小さい<br />入力機構が少ない<br />通信速度(など)が遅い<br />
  8. 8. アプリを作る上で気をつける要素<br />
  9. 9. ユーザーインターフェース<br />
  10. 10. 他のアプリから学ぶ<br />GoogleSpread Sheet<br />Twitter<br />(アプリじゃないけど)cnet-japan<br />
  11. 11. Windows<br />Android<br />GoogleSpread Sheetの場合<br />
  12. 12. GoogleSpread Sheetの場合<br />「リスト表示」のみが使用可能<br />利点<br />どこでもデータの追加編集が可能<br />欠点<br />キーボードなし端末では入力困難<br />
  13. 13. Twitter<br />Android<br />Windows<br />
  14. 14. Twitter<br />公式に提供された機能を使用可<br />利点<br />どこでもTwitter出来る!…?<br />まあ、今更ねえ…<br />欠点<br />ボタンが小さい!タッチできない!<br />
  15. 15. Windows<br />Android<br />CNET Japanの場合<br />
  16. 16. CNET Japanの場合<br />ニュース記事を辿ることが出来る<br />利点<br />モバイル向けに最適化されていて表示が速い<br />欠点<br />不意に画面を切り替えると戻れない<br />
  17. 17. ユーザーインターフェース<br />端末に表示する情報を少なく<br />使える機能を抑える<br />PCで仕込みスマートフォンで仕上げ<br />入力は少なめに、ボタンは大きく<br />戻る/進むをやりやすく<br />
  18. 18. 開発手法<br />
  19. 19. Google Web Toolkit<br />Googleが作ったWeb開発ツール<br />JAVA->JavaScriptのコンパイル<br />動的に変化するサイト作りがしやすい<br />Googleも使ってる…?<br />
  20. 20. Windows<br />Android<br />GWTで作ったWebアプリ<br />
  21. 21. Demo<br />
  22. 22. JAVAが使えるサーバ<br />Google App Engine<br />Googleのクラウドサービス<br />JAVA/Pythonが使用可能<br />GWTも使える<br />
  23. 23. 携帯独自の注意点<br />
  24. 24. ポイント<br />
  25. 25. 状態遷移に気をつける<br />再読込/戻る/進む<br />タスク管理上の問題も<br />ex). HT-03Aのブラウザはアクティブ時に再読込を行う …とか<br />いつ落ちるかわからない<br />マルチタスク端末は注意<br />
  26. 26. 回線/処理速度に気を使う<br />回線速度とも、処理速度とも<br />どうしてもPCよりは遅い<br />なるべくシンプル・少ないデータで<br />ユーザーをいらいらさせない作り<br />
  27. 27. まとめ<br />
  28. 28. Webアプリを作るならモバイルも気にしよう<br />コンパクト版でも、同じものでも<br />ユーザビリティを気にする必要<br />画像はなるべく軽く<br />読めなくても支障がない作りに<br />横幅が小さくても崩れないページ<br />
  29. 29. おわり<br />ご静聴ありがとうございました<br />

×