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.

Shinjuku.html5.lunch #11

1,551 views

Published on

Shinjuku.html5.lunch
夜の特別編

http://connpass.com/event/857/

Published in: Technology
  • ..............ACCESS that WEBSITE Over for All Ebooks ................ ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { https://urlzs.com/UABbn } ......................................................................................................................... Download Full EPUB Ebook here { https://urlzs.com/UABbn } .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Download or read that Ebooks here ... ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... Download Doc Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • -- DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT -- ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... (Unlimited)
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THI5 BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... Download EPUB Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... Download doc Ebook here { http://bit.ly/2m77EgH } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (Unlimited) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download Full EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ACCESS WEBSITE for All Ebooks ......................................................................................................................... Download Full PDF EBOOK here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download EPUB Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... Download doc Ebook here { https://tinyurl.com/y6a5rkg5 } ......................................................................................................................... ......................................................................................................................... ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Shinjuku.html5.lunch #11

  1. 1. Shinjuku.html5.lunch 夜の特別編 2012.08.07 kchinda (at) aiming-inc.com (a.k.a. @ckazu)
  2. 2. about me• @ckazu• • 東京開発G • Rails によるサイト開発 • Rails + JS による ブラウザゲーム開発 •
  3. 3. http://connpass.com/series/72/
  4. 4. http://www.slideshare.net/ckazu/ux-10671865
  5. 5. http://developer.aiming-inc.com/study/guide-to-ux-for-software-engineer/
  6. 6. 今日のテーマ• web の UX について
  7. 7. 今日のテーマ• メンタルモデルとデバイスとの関わり
  8. 8. 今日の目的• 開発者嗜好のモノ • デザイナ嗜好のモノ http://www.seiko-watch.co.jp/p_search/detail/do.php?no=SBPG003 http://store.apple.com/us/product/MB829LL/A
  9. 9. 今日の目的• ユーザにとって使いやすさとは何かを,根拠を持って考えられるようになる
  10. 10. UX User Experience
  11. 11. The User Experience Honeycomb http://semanticstudios.com/publications/semantics/000029.php
  12. 12. UX/UI/IA ...何故か最近よく聞く単語• UI (User Interface)• UX (User eXperience)• IA (Information Architecture)• affordance theory (Perceived Affordance)• etc.
  13. 13. UX 認知科学情報科学 デザイン
  14. 14. UX affordance UX ? (User Experience) IA UI(Information (User Interface)Architecture)
  15. 15. UX/UI/IA ...• UI / IA / affordance • これらを学べば, より良いユーザ体験を与えられる ものを作れるのか
  16. 16. メ ルモデル ンタ Mental Model
  17. 17. キャンセルできますか?
  18. 18. BAD UI http://www.google.com/search?q=bad+ui&hl=ja&prmd=imvnsa&tbm=isch&tbo=u&source=univ&sa=X&ei=X9AgUMWuIKqImQX Xz4D4Bg&ved=0CF0QsAQ&biw=1366&bih=768#hl=ja&tbm=isch&sa=1&q=%22bad+ui %22+browser&oq=%22bad+ui%22+browser&gs_l=img.3...7024.9528.2.9693.4.4.0.0.0.0.57.207.4.4.0...0.0...1c.l41lTJlFcT8&pbx=1&fp=1&biw=1366&bih =768&bav=on.2,or.r_gc.r_pw.r_qf.&cad=b&sei=v9AgUK-HMM30mAXr5YHICA
  19. 19. ボタンが4つhttp://www.seiko-watch.co.jp/p_search/detail/do.php?no=SBPG003
  20. 20. クリック?http://store.apple.com/us/product/MB829LL/A
  21. 21. 凹んだボタン
  22. 22.
  23. 23. (補足)色と文化 http://www.informationisbeautiful.net/visualizations/colours-in-cultures/
  24. 24. メンタルモデル• 「なんだ朝日新聞は読めないのか」――高齢者がiPadを使ったら?• http://plusd.itmedia.co.jp/pcuser/articles/1004/23/ news028.html
  25. 25. メンタルモデル
  26. 26. メンタルモデル
  27. 27. メンタルモデル•ヒトは自分が観察したことを説明するメンタルモデルを構築する•開発者のメンタルモデルと,ユーザのメンタルモデルとの乖離
  28. 28. メンタルモデル•ヒトは自分が観察したことを説明するメンタルモデルを構築する•自分の観測範囲で構築するので •iPad でテレビ見れないけど故障? •ガチャは確率操作されている!? •etc.
  29. 29. メンタルモデル•ヒトは自分が観察したことを説明するメンタルモデルを構築する•「開発者の常識 ≠ ユーザの常識」と考えるべき
  30. 30. 学習 Lerning
  31. 31. 学習•壁画•パピルスの発明 •紙•グーテンベルク以降 それぞれのデバイスに •活版印刷 慣れるための •書籍 学習コストは?•電子デバイスの発達 •PC •タブレット端末
  32. 32. 学習•木の枝•万年筆•鉛筆 それぞれのデバイスに 慣れるための•ボールペン 学習コストは?•シャープペンシル
  33. 33. 学習•キーボード•マウス•ペンタブレット それぞれのデバイスに 慣れるための•トラックボール 学習コストは?•タッチパネル
  34. 34. 学習•静的HTML•動的HTML•Javascript で動きのあるページ•Flash •ajax •HTML5  それぞれに•CSS3 の装飾 慣れるための• WebGL  学習コストは?•etc. 
  35. 35. 学習コストを下げる•Web 世界の標準 •実世界のメタファ •画面の構成 •ボタン •リンク色 •アイコン •ex) bing  •ジオン •下線 • ex) http://www.nintendo.co.jp/3ds/abej •ボタン •ユニバーサルデザイン •input 要素 •etc.
  36. 36. 対応付け Mapping
  37. 37. 対応付けが上手くいっていない例
  38. 38. 対応付け
  39. 39. http://www.google.co.jp/search?q=ガスコンロ 対応付け&hl=ja&prmd=imvns&source=lnms&tbm=isch&ei=cT3mTvnjL67BiQf0lKi2BQ&sa=X&oi=mode_link&ct=mode&cd=2&ved=0CEUQ_AUoAQ&biw=1366&bih=768 間違えやすいデザインなのに 各社共通の配置 なぜ長年変更されないのか •グリルの点火スイッチ デファクト・スタンダードは •形状 踏襲すべきなのか? •配置場所
  40. 40. 参考サイト
  41. 41. まとめ•より良いユーザ体験が得られるコンテンツを作るには•メンタルモデルを意識する•開発者としての常識は一旦捨てる•常識 か 革新か •常識: レールを外れない •革新: メタファをうまく取り入れる etc.
  42. 42.

×