mobile first

2,529 views

Published on

Published in: Design
1 Comment
6 Likes
Statistics
Notes
No Downloads
Views
Total views
2,529
On SlideShare
0
From Embeds
0
Number of Embeds
253
Actions
Shares
0
Downloads
0
Comments
1
Likes
6
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • ADOBE GOOGLE FACEBOOK\n制約があるからこそコンテンツ自体に眼を向けることができ\n結果、デスクトップサイトの質も上がる\n
  • \n
  • \n
  • 総出荷台数は前年比9.3%増の3,764万台となった。\n2010年度通期のスマートフォン出荷台数は855万台で前年比約3.7倍に拡大し、総出荷台数の22.7%を占める結果となった。\n
  • \n
  • 1.3 -> 6.3\n38man -> 320man\n\n5000万セッション \n
  • \n
  • \n
  • \n
  • \n
  • 文脈を理解したデザインが求められている\n
  • \n
  • \n
  • 1.3 -> 6.3\n38man -> 320man\n\n5000万セッション \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • mobile first

    1. 1. mobile first Web Koji Ishimoto 2011.06.042011 UPGRADE JAPAN!!
    2. 2. Web Designer
    3. 3. Web Designert32k.me/mol
    4. 4. Web Designert32k.me/mol @t32k
    5. 5. Web Designert32k.me/mol @t32kkanazawa.js
    6. 6. NyarsiPhone App
    7. 7. shift
    8. 8. shiftgrowth
    9. 9. shiftgrowthconstraints
    10. 10. shiftgrowthconstraintscapabilities
    11. 11. shift growth constraints capabilities日 conclusion
    12. 12. What is mobile first?
    13. 13. Luke Wroblewski
    14. 14. “ 方”
    15. 15. desktop
    16. 16. desktop
    17. 17. desktop mobile
    18. 18. mobile desktop
    19. 19. State of the mobile world
    20. 20. 5.3 Billion The World in 2010: ICT Facts and Figures
    21. 21. 25% of US is Mobile-Only5.3 Billion The World in 2010: ICT Facts and Figures
    22. 22. 22.7%8,550,000Smartphone in Japan 37,640,000      
    23. 23. BlackBerry Windows PhoneiOS37 % .8 Android 57 % .4      
    24. 24. 476 % increase7% 4,000,0005% 3,000,0004% 2,000,0002% 1,000,0000% 0 2010/5 6 7 8 9 10 11 12 2011/1 2 3 4 2010/05-2011/04 DMM.com Smartphone(iPhone/Android/BlackBerry) Sessions
    25. 25. Designing for a mobile world
    26. 26. Screen Size
    27. 27. Speed
    28. 28. Touch
    29. 29. context 音     音   ά ˈɔ  文 文   
    30. 30. site goal recruitment   人 用 行        
    31. 31. 4,0003,0002,0001,000 0 2010/1 2 3 4 5 6 7 8 9 10 11 12 2010/01-2010/12 DMM.com Labo Sessions
    32. 32. context New Graduates
    33. 33. Search Sign In Search Sign InSearch Sign In Search Sign In Search Sign In 用
    34. 34. Search Sign In Search Sign In Search Sign In modify delete 革 Search Sign In Search Sign In 用
    35. 35. *mock-up
    36. 36. *mock-up
    37. 37. *mock-up
    38. 38. Coding for a mobile world
    39. 39. minimum responsive用 framework
    40. 40. various platforms Flow
    41. 41. mobile sites: framework
    42. 42. mobile apps: framework titanium mobile
    43. 43. Conclusion
    44. 44. 方 shift thinking
    45. 45. 方 shift thinking think context
    46. 46. 方 shift thinking think context use framework
    47. 47. Thank you!
    48. 48. information
    49. 49. 2011.06.18
    50. 50. kanazawa.js v1.52011.07.23
    51. 51. see also • Web | | • allWeb : • Web : could • : could • Web 1 | • LukeW | Mobile First • The State of (Mobile) Web Development 2011 | Web Directions
    52. 52. photo credit http://www.flickr.com/photos/desiitaly/2286214012/ http://www.flickr.com/photos/pete-karl/4637024524/ http://www.flickr.com/photos/philscoville/400702638/ http://www.flickr.com/photos/jking89/3291408977/ http://www.flickr.com/photos/jorgecorrea/4359779134/ http://www.flickr.com/photos/quacktaculous/2880445737/ http://www.flickr.com/photos/nikio/3899114449/ http://www.flickr.com/photos/freewine/3484000491/ http://www.flickr.com/photos/tkgib58/4852316183/ http://www.flickr.com/photos/tinkerszone/4233987708/ http://www.flickr.com/photos/jennycu/5666833642/ http://www.flickr.com/photos/andrec/4045953008/ http://www.flickr.com/photos/55873579@N00/5398230281/ http://www.flickr.com/photos/eyeliam/2255467740/

    ×