1. The Future
Friendly Campus
Dave Olsen, @dmolsen
West Virginia University

2. introduction about me

3. From 30,000 ft.
30,000 ft

4. The WhyWhy
of Future Friendly

5. The What
What
of Future Friendly

6. How
The How
How
of Future Friendly

7. The WhyWhy
of Future Friendly

8. A History Lesson
History Lesson

9. The Future
FriendlyWhy Campus
In the beginning...

10. We Had Print

11. We Had Print
Strong Layout Constraints
defined container

12. We Had Print
Strong Layout Constraints
Content & Layout Are
defined Tightly Coupled
container

13. We Had Print
Strong Layout Constraints
Content & Layout Are
defined Tightly Coupled
container
Primarily “Talk At”

14. The Future
FriendlyWhy times...
Campus
In more recent

15. Computers

16. Internet

17. Internet
Flexible Layouts

18. Internet
Flexible Layouts
Content & Layout Can Start
To Be Decoupled

19. Internet
Flexible Layouts
Content & Layout Can Start
To Be Decoupled
Has Turned Into “Talk With”

20. Which lead too a...
False Sense of Security
Why

21. Fixed Access
24-7 access, two way

22. Limited Resolutions
24-7 access, two way

23. Content Silos
24-7 access, two way

24. The Future
FriendlyWhy day...
Campus
The present

25. Mobile
24-7 access, two way

26. Mobile
Highly Constrained Layouts

27. Mobile
Highly Constrained Layouts
Rapidly Evolving Ecosystem

28. Mobile
Highly Constrained Layouts
Rapidly Evolving Ecosystem
Allows True “Anywhere,
Anytime” Access

29. Yes, Anywhere
75% of men admit to using their
mobile on the toilet.
Source: http://www.11mark.com/IT-in-the-Toilet

30. And Anytime
83% of young people sleep next
to their phones.
Source:http://www.prdaily.com/Main/Articles/Infographic_83_percent_of_young_people_sleep_next_9391.aspx

31. The Wave is Coming
34% of high school students
report owning an iPhone.
http://www.macrumors.com/2012/04/03/one-third-of-u-s-high-school-students-now-own-an-iphone/

32. We’re entering...
The Hyper-Connected
Society
So what does it mean?

33. Building New Content Silos?
24-7 access, two way

34. Learning New Skills?
24-7 access, two way

35. Trying to Keep Up?

36. The Future
And then there’s...
FriendlyWhyCampus
The near future...

37. A Small Taste

38. WVU’s Solutions
standalone responsive designs
mobile sites
native apps mobile templates
APIs

39. Our Future?

40. It’s Scary!
Scary

41. It’s Overwhelming!

42. You’ll Want To Hide

43. A Ray of Hope

45. The What
What
of Future Friendly

46. who founded it

47. Twitter Handles
@brad_frost @scottjenson
@adactio @scottjehl
@grigs @lukew
@bryanrieger @lyzadanger
@stephanierieger @globalmoxie

48. futurefriend.ly

49. What
The Truths
What
aka “Our Reality”

50. The Truths
Disruption will only
Text
accelerate.

51. The Truths
Our existing standards,
Text
workflows, & infrastructure
won’t hold up.

52. The Truths
ProprietaryText
solutions will
dominate at first.

53. The Truths
The standards process will be
Text
painfully slow.

54. What Hope
There is
What
Rejoice!

55. A New Hope
Acknowledge & embrace
Text
unpredictability.

56. A New Hope
Think & behave in a
Text
future-friendly way.

57. A New Hope
Text
Help others do the same.

58. Summing It Up
“
Future Friendly is more the
outcome of a Constitutional
Convention than it is a practical
set of laws. A “when you do
stuff, do it with this in mind”
mode of thinking.
- Dave Mulder
@muldster

59. How
The How
How
of Future Friendly

60. How Do We Get There?
There
Here

61. Future Friendly Tenet
Acknowledge & embrace
Text
#1
unpredictability.

62. Don’t Overreact

63. The Shiny

64. Tech Isn’t Always Best
technology doesn’t solve all ills (pencil photo)

65. Be Friendly!

66. Why not?
70% of prospective students
are happy to browse your
Text
current websites on their
mobile device.
Source: https://www.noellevitz.com/papers-research-higher-education/2012/2012-mobile-expectations-report

67. So Breathe & Relax... A Little

68. Future Friendly Tenet
Think &Text
behave in a
#2
future-friendly way.

69. Next Steps
Don’t worry about being known,
Text
worry about being useful.

70. Boo, Politics!

71. The University Home Page
Content Delivery vs. Tangible Utility

72. Mobile First
mobile first
“
Mobile devices require software development
teams to focus on only the most important
data and actions in an application.
- Luke Wroblewski
@lukew

73. The Age of the Sensor

74. Next Steps
Data & content should be
Text
set free.

75. APIs: The Plumbing
API First
APIs are the infrastructure for your
Future Friendly initiatives...
Create Once, Publish Everywhere

76. PRT API Example
Update once. Publishes to:
iOS App,
Mobile Website,
Student Portal,
Transportation Website, &
Twitter

77. Recombinable Content
API highway slide

78. Afternoon Talk
Creating APIs for Mobile
Text
- Nick DeNardis
@nickdenardis

79. Next Steps
Structure & store data with the
Text
future in mind.

80. Structured & Self-Aware Content
structured & self-aware content

81. Next Steps
Give your existing content a
Text
chance to adapt to the future.

82. responsive web design...

83. Discovery
discovery + communication plan

85. Discovery
“
Not every mobile device will have
your app on it but every mobile
stat about browser usage
device will have a browser.
- Jason Grigsby
@grigs

86. 77% of smartphone users use search.
Most visited type of website.
from Google’s “The Mobile Movement” report, April 2011

87. Existing Indexed Content

88. Discovery
“
Links don’t open apps.
- Jason Grigsby
stat about@grigs
browser usage

89. 55% of users with an internet-enabled
phone use it to check personal email.
from Merkle’s “View from the Digital Inbox” report, January 2011

90. Social Media
Getting
social?

91. Print Pieces

92. Got the Skills to Pay the Bills

93. Summing It Up
links
+ skills
+ search
responsive web
design first

94. Evolution of RWD
RESS
Responsive Web Design + Server Side Components

95. ress.dmolsen.com

96. Future Friendly Tenet
Text
#3 Help others do the same.

97. It’s a Starting Point

98. Resources
Resources

99. futurefriend.ly

100. mobilewebbestpractices.com
Twitter & Stuff

101. twitter.com/dmolsen/ffly

102. dmolsen.com

103. Many thanks to Mr. Robertson
for the snazzy device &
progressive strategy graphics.

104. Thanks,
Tattoo by tantek FF Group by lyzadanger
Communicate by pagedooley Hamster by zebrapares
Sensor by juanpg RWD by chasingdaisy
Pencil by ??? Dog by hippolytephotography
History Lesson by kalexanderson Road to Ribblesdale by Luc B
Computer by x-ray_delta_one Cat by pagedooley
Lego Discovery by dunechaser Toilet by beatkueng
Cyber Cafe by larskflem Highway Lights by Spreng Ben
Google by manfrys Ray by shutterrunner
Monitor by benadamson Bed by chaparral
Star Trek by jdhancock Clouds by Francisco Martins
Student Recording Video by U. of Denver Wave by mikebaird
Silo by dawn_perry Beach by nattu
Overwhelmed by pagedooley Jewels by pinksherbet
Flickr by dsevilla Overreach by kwl
Scary by jon_ovington Capitol by wbeem

105. The End