The web will never be the same! Each year the web feels like it hits critical mass and then it does it all over again. This session will dig into how to best engage with an ever changing web and how to connect with the new web. From responsive web design to changing our process.

5. This is how I see myself.

6. This is how the world sees me. At least the people who really know me. ;)

7. Zombie Apocalypse movie clip. This is just like all the devices that are out there.

8. Android Apocalypse movie clip. Soooo many different devices with no real solid direction. Just
seems like they wanted to saturate the market. http://en.wikipedia.org/wiki/
Comparison_of_Android_devices#Smartphones

11. ummmmm...

12. Simon Sinek and the golden circle.
http://www.ted.com/talks/simon_sinek_how_great_leaders_inspire_action.html

13. 100% of us know the what. At least right now.

14. Maybe 60 - 70% of us know that how of what we do.

15. But the why is fuzzy. Hardly any of us know the why.

16. If we can bring the why into clarity it can change the world. Think about Apple. They didn’t
just make computers, they wanted to change the world. Even if they didn’t with the mouse,
macintosh, iMac, iPod, iTunes... they certainly did with the iPhone.

18. www.responsiveprocess.com

19. Ah 1994. The year I went online. Not the year I started using computers though. My first
computer was a TI994a that recorded programs on audio tape and hooked up to my 13” TV. I
bought it at Canadian Tire. In 1994 I had a pentium 90.

20. http://bit.ly/3R5kW8
Arpanet was the first real network to run on packet switching technology (new at the time). On the October 29, 1969, computers at Stanford
and UCLA connected for the first time. In effect, they were the first hosts on what would one day become the Internet.

21. g
The first message sent across the network was supposed to be "Login", but reportedly, the link between the two colleges crashed on the letter
"g".

22. http://bit.ly/3R5kW8
1969
Another major milestone during the 60′s was the inception of Unix: the operating system whose design heavily influenced that of Linux and FreeBSD
(the operating systems most popular in today’s web servers/web hosting services).

23. @
Email was first developed in 1971 by Ray Tomlinson, who also made the decision to use the "@" symbol to separate the user name from the computer
name (which later on became the domain name).

24. http://bit.ly/3R5kW8
One of the most impressive developments of 1971 was the start of Project Gutenberg. Project Gutenberg, for those unfamiliar with the site, is a
global effort to make books and documents in the public domain available electronically–for free–in a variety of eBook and electronic formats. In
effect, this was the birth of the eBook.

25. Arpanet made its first trans-Atlantic connection in 1973, with the University College of London. During the same year, email accounted for 75% of
all Arpanet network activity.

26. http://bit.ly/3R5kW8
1974 was a breakthrough year. A proposal was published to link Arpa-like networks together into a so-called "inter-network", which would have no
central control and would work around a transmission control protocol (which eventually becameTCP/IP).

27. http://bit.ly/3R5kW8
1977 was a big year for the development of the Internet as we know it today. It’s the year the first PC modem, developed by Dennis Hayes and Dale
Heatherington, was introduced and initially sold to computer hobbyists.

28. 1978: Spam is born
1978 is also the year that brought the first unsolicited commercial email message(later known as spam), sent out to 600 California Arpanet
users by Gary Thuerk.

29. http://bit.ly/3R5kW8
The precursor to World of Warcraft and Second Life was developed in 1979, and was called MUD (short for MultiUser Dungeon). MUDs were entirely
text-based virtual worlds, combining elements of role-playing games, interactive, fiction, and online chat.

30. :-)
Scott Fahlman in 1982 who proposed using :-) after a joke, rather than the original -) proposed by MacKenzie. The modern emoticon was born.

31. http://bit.ly/3R5kW8
The domain name system was created in 1984 along with the first Domain Name Servers (DNS). The domain name system was important in that it
made addresses on the Internet more human-friendly compared to its numerical IP address counterparts. DNS servers allowed Internet users to
type in an easy-to-remember domain name and then converted it to the IP address automatically.

32. http://bit.ly/3R5kW8
Also in 1988, Internet Relay Chat (IRC) was first deployed, paving the way for real-time chat and the instant messaging programs we use today.

33. http://bit.ly/3R5kW8
When Apple pulled out of the AppleLink program in 1989, the project was renamed and America Online was born. AOL, still in existence today, later on
made the Internet popular amongst the average internet users.

34. http://bit.ly/3R5kW8
1989 also brought about the proposal for the World Wide Web, written by Tim Berners-Lee. It was originally published in the March issue of MacWorld,
and then redistributed in May 1990. It was written to persuade CERN that a global hypertext system was in CERN’s best interest. It was originally
called "Mesh"; the term "World Wide Web" was coined while Berners-Lee was writing the code in 1990.

35. http://bit.ly/3R5kW8
1991 brought some major innovations to the world of the Internet. The first web pagewas created and, much like the first email explained what email
was, its purpose was to explain what the World Wide Web was.

36. The first widely downloaded Internet browser, Mosaic, was released in 1993. While Mosaic wasn’t the first web browser, it is considered the first
browser to make the Internet easily accessible to non-techies.

37. http://bit.ly/3R5kW8
Mosaic’s first big competitor, Netscape Navigator, was released the year following (1994).

38. http://bit.ly/3R5kW8
1995
In response to the growing public interest in the Internet,Microsoft develops an add-on to the operating system called a web browser. When Windows 95
with Internet Explorer debuts, the Internet becomes accessible for many people. Additionally, Internet Explorer replaces the manual installation steps
that many of the existing shareware browsers require. In short, it gets easy to get online

39. http://bit.ly/3R5kW8
In 1996, HoTMaiL (the capitalized letters are an homage to HTML), the first webmail service, was launched.

40. http://bit.ly/3R5kW8
Google went live in 1998, revolutionizing the way in which people find information online.

41. http://bit.ly/3R5kW8
With the dotcom collapse still going strong, Wikipedia launched in 2001, one of the websites that paved the way for collective web content
generation/social media.

42. http://bit.ly/3R5kW8
Facebook launched in 2004, though at the time it was only open to college studentsand was called "The Facebook"; later on, "The" was dropped from
the name, though the URL http://www.thefacebook.com still works.

43. Twitter launched in 2006. It was originally going to be called twittr (inspired by Flickr); the first Twitter message was "just setting up my twttr".

44. The biggest innovation of 2007 was almost certainly the iPhone, which was almost wholly responsible for renewed interest in mobile web applications
and design.

45. The first "Internet election" took place in 2008 with the U.S. Presidential election. It was the first year that national candidates took full advantage of all
the Internet had to offer. Hillary Clinton jumped on board early with YouTube campaign videos. Virtually every candidate had a Facebook page or a
Twitter feed, or both.

46. We owe a lot to the web standards movement.

47. Right at my house the ratio of internet devices to people is 4:1.

48. “The control which designers know in the print medium,
and often desire in the web medium, is simply a function
of the limitation of the printed page. We should embrace
the fact that the web doesn’t have the same constraints,
and design for this flexibility. But first, we must “accept
the ebb and flow of things.”
John Allsopp, “A Dao of Web Design”

49. The seminal example of responsive web design.

50. Screencast of responsive websites. www.bostonglobe.com, http://simplebits.com/, http://
futureinsightslive.com/, http://teixido.co/, http://www.anderssonwise.com/, http://
hellofisher.com/, http://www.smashingmagazine.com/

51. Screencast of live, in-browser wireframes

52. You must design for and in the medium. http://foundation.zurb.com/

54. “We can't be all things on all devices. To manage in a world of ever-increasing device complexity, we need to focus on what
matters most to our customers and businesses. Not by building lowest common-denominator solutions but by creating meaningful
content and services. People are also increasingly tired of excessive noise and finding ways to simplify things for themselves.”
http://futurefriend.ly/thinking.html

55. “Focus your service before your customers and increasing diversity do it for you.” http://futurefriend.ly/thinking.html

56. Focus on what will drive everything else first. The why.
If you focus on the why, everything else will follow.

57. futurefriend.ly

58. “Well-structured content is now an essential part of art direction. Consider how it can flow into a variety of containers by being
mindful of their constraints and capabilities. Be bold and explore new possibilities but know the future is likely to head in many
directions.” http://futurefriend.ly/thinking.html

59. Think about chunking your content to make it flexible. Not just for responsive design, but for
the future. Who knows where we’ll be pushing our content out to in the next decade.

61. http://bit.ly/LUtkL

62. Connecting with others doing what you do will expand your possibilities, keep you dreaming
of the future, and hopefully keep you thinking future friendly.

64. If we can clear up the fuzzy why that is at our core the future will seem clear.

65. Like Tony said in the keynote this morning, you need to figure out the values that are
important to you.

66. Yellow Pencil.
We make the web work for everyone.
1.Design for a better world.
2.Make the complex simple.
3.Engage the whole person. It is a human interaction.
4.The goals and message drive the design solution.
5.Users first.
6.Progressive enhancement. Small screen, low bandwidth first.
7.Design for tomorrow.
8.Accessible to all.
Crafting your own...
1. Research available principles for competitors and related organizations.
2. Gather and list out the business goals, user needs, and brand attributes.
3. Brainstorm with key collaborators.
4. Narrow down to no more than 10.
5. Ensure they don’t conflict or overlap.
6. Ensure they are memorable.
When to use them...
1. Project kickoff.
2. Prioritizing features.
3. Brainstorming sessions.
4. Design critiques.
5. Presentations.
6. Resolving conflict.
7. Postmortems.

67. Go pick my brain on Delicious.