1. mobile first Web
Koji Ishimoto 2011.06.04
2011 UPGRADE JAPAN!!

3. Web Designer

4. Web Designer
t32k.me/mol

5. Web Designer
t32k.me/mol
@t32k

6. Web Designer
t32k.me/mol
@t32k
kanazawa.js

7. Nyars
iPhone App

8. shift

9. shift
growth

10. shift
growth
constraints

11. shift
growth
constraints
capabilities

12. shift
growth
constraints
capabilities
日 conclusion

13. What is mobile first?

14. Luke Wroblewski

15. “
方”

16. desktop

17. desktop

18. desktop mobile

19. mobile desktop

20. State of the mobile world

21. 5.3 Billion
The World in 2010: ICT Facts and Figures

22. 25% of US is Mobile-Only
5.3 Billion
The World in 2010: ICT Facts and Figures

23. 22.7%
8,550,000
Smartphone in Japan
37,640,000

24. BlackBerry
Windows Phone
iOS
37 %
.8
Android
57 %
.4

25. 476 % increase
7% 4,000,000
5% 3,000,000
4% 2,000,000
2% 1,000,000
0% 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

26. Designing for a mobile world

27. Screen Size

28. Speed

29. Touch

30. context
音 音 ά ˈɔ
文 文

32. site goal
recruitment
人 用 行

33. 4,000
3,000
2,000
1,000
0
2010/1 2 3 4 5 6 7 8 9 10 11 12
2010/01-2010/12 DMM.com Labo Sessions

34. context
New Graduates

35. Search Sign In Search Sign In
Search Sign In Search Sign In Search Sign In
用

36. Search Sign In Search Sign In Search Sign In
modify delete
革 Search Sign In Search Sign In
用

37. *mock-up

38. *mock-up

39. *mock-up

41. Coding for a mobile world

42. minimum
responsive
用 framework

43. various platforms
Flow

44. mobile sites: framework

45. mobile apps: framework
titanium mobile

46. Conclusion

48. 方 shift thinking

49. 方 shift thinking
think context

50. 方 shift thinking
think context
use
framework

51. Thank you!

52. information

53. 2011.06.18

54. kanazawa.js v1.5
2011.07.23

55. see also
• Web | |
• allWeb :
• Web : could
• : could
• Web 1 |
• LukeW | Mobile First
• The State of (Mobile) Web Development 2011 | Web Directions

56. 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/