Портал Как сделать презентацию http://presportal.ru/, Международная высшая школа презентаций и коммуникаций http://presuniversity.com/

1. DESIGNING
BIG PICTURE
for the (multi)

2. Hi.I’m Jon

5. pixel fonts!

7. <wml>
<card id="content" title="Title Card">
<p>My spiffy WML page.</p>
</card>
</wml>

9. WHY
SO TELL ME
I SHOULD CARE?

10. 2013
2005
Source: NBC News

11. Source: Cisco Visual Networking Index
IN 2012
GREW
GLOBAL MOBILE DATA TRAFFIC
70%

12. Look & Feel01
Experience02
Content03
Technology04

13. 01
THE LOOK & FEEL
lookin’ good

14. ONE WEB
IT’S NO LONGER

16. 01
02
03
Desktop First

20. Mobile First
01
02
03

22. 02
THE EXPERIENCE
feelin’ good

23. Pinch & Zoom

28. Drag

31. 03
THE CONTENT
makin’ sense

35. 04
THE TECHNOLOGY
what makes it tick?

36. Responsive

37. .container { width: 960px; margin:0 auto; }
@media screen and (max-width: 768px) {
! .container { width: 728px; }
}
@media screen and (max-width: 320px) {
! .container { width: 100%; }
}

38. Single codebase;
Less expensive and more
efficient to maintain
More code to render;
image resizing may be
inadequate
some pros: some cons:
Responsive

39. Dedicated

40. Content specificity
More optimized
experience;
Separate codebase;
Requires Server
Configuration
some pros: some cons:
Dedicated

41. DEDICATED
RESPONSIVE
VERSUS or

42. 05
THE CASE STUDIES
putting it all together

43. BU HOMEPAGE
bu.edu

48. THE BUS
bu.edu/bus

58. BOSTONIA
bu.edu/bostonia

64. THANK YOU