by
Postdesktop   Doug Gapinski
Please share.

#psuweb12 #postdesktop @thedougco


   clients.mstoner.com/postdesktop
Doug Gapinski
mStoner.com
@thedougco
Postdesktop:
A look at how ubiquitous computing
is changing the world and education
Purpose:
To view responsive design and mobile techology in a
larger context of computing, the web, and the world.
70s   80s




90s   00s
I. Three point four mainframes to every newborn
                 II. Device-iveness
         III. Postclassroom, postcampus
                IV. Steal these ideas
Part 1
   3.4 mainframeshere should be shared.
    Everything in to every newborn:
an introduction to pervasive computing
Pervasive computing is the
idea of seamless human-
computer interaction,
where information
processing is thoroughly
integrated into human life.
nd.edu   Source: @erunyon
Google glass source: Google
Tesco virtual supermarket source: designboom
frvnt.com
aws.amazon.com/mturk
Wayne State mobile vs. desktop traffic trajectory




               Source: @nickdenardis
Properties                        Related topics
    • small, inexpensive, interconnected      • the Internet of Things
                   devices                   • context-aware systems
  • interaction with computer is intuitive       • augmented reality
• computer provides human with enhanced           • mobile learning
                  capability
How did we get here?
1954
IBM 6150 Mainframe
$200,000 to $400,000
1975
IBM 5100 “Portable Computer”
          ~$17,000
1981
IBM 5150 Personal Computer
          $1,595
1981
Dulmont Magnum
    $8,150
1983
HP 150
$2795
1981
TCP / IP introduced



     1993
      Mosaic
 First official GUI
     Browser
Tablets
         1968                               1989
Alan Kay’s Dynabook Concept             Samsung’s GridPad
1993
IBM Simon
  $899
1996
Nokia 9000
  $899
Touchscreens, mobile, GUI, wireless...
       in less than 60 years.
                 —and—


   These ideas are old. It just took
   a while to hit the mainstream.
2007
first iPhone
Human needs have driven this change in five ways:

                  Portability
                 Connectivity
                   Interface
                     Cost
                  Capability
Forces of change in computing
                       1954                       2012
 Portability    mainframe; not portable    smartphones and tablets


                limited packet switching
Connectivity     between two computers
                                               wireless access


  Interface           punchcards                touchscreen


    Cost         $200,000 to $400,000               $200
The most powerful force of change is capability.




                                    source: istockphoto.com
Forces of change in computing
                    1954             2012
  Capability        math           entertainment
                                       education
                                        shopping
                                           prayer
                                  communication
                                     information
                                      wayfinding
                                          sharing
                                    investigation
                                           travel
                                        recording
                                        observing
                                financial management
                                      ... and math
Mobile and tablet traffic will outpace desktop traffic.
                    by 2015 or sooner




                      Source: IDC
Access in developing nations:
half of India’s homes have cellphones but not toilets.
                    as of March 14, 2012




                   Source: thehindu.com
Access in developing nations:
38% of China’s internet population is mobile only.
                    as of January 2012




                 Source: thenextweb.com
In .edu:

   Community colleges (Waubonsee)
     and commuter colleges (NSC)
report growth of mobile-only contingents.



            Source: anecdotal from clients
29% of households in the U.S. own a tablet or e-reader.
               30 days before and after Christmas 2011




                 Source: MSNBC and Pew Internet
+440% increase in traffic to Google ads from tablets.
              from November 2010 to December 2011




                   Source: Google mobile ads
Pervasive computing isn’t as simple as
mobile or tablets replacing the desktop.
Audi in-car mobile computer source: readwriteweb
Xfinity home security tablet source: comcast
NEST learning thermometer source: NEST
We’re headed toward a future where the web is
     connected seamlessly in affordable,
              ordinary devices.
562,000 iOs are sold every day,
 and 700,000 android devices.
           as of January 2012




Source: @lukew and thenextweb.com
(562,000 iOs devices + 700,000
android devices) sold per day
/ 371,000 newborns born per day

3.4 mainframes to every newborn



Source: @lukew and thenextweb.com
Would they have believed it?
With this much change in less than 60 years,
   what does the future look like for us?
Three sites for everyone




The web is changing!    Our work is changing!   Mobile is changing!
 thenextweb.com            alistapart.com          lukew.com
Part 2
        Everything in here should be shared.
Device-iveness: responding to a Device-ive future
Responsive design meets the reality of people
accessing the web from increasingly different devices.
UCSD.edu




                  A high-level definition

 Responsive design is an approach to design and
development that ensures a site displays optimally
     on a variety of devices, including mobile.
mStoner projects



     UC Hastings
  Webster University
   Miami University
   Whittier College
Spring Arbor University
How responsive is changing our work


                Client education
      Planning (wireframes / prototypes)
           Design (flexible elements)
 Development (conditionals / touch interface)
             Testing (more devices)
User testing (we haven’t figured this one out yet)

                  The whole team is involved
Hotgloo.com




1. Responsive prototyping for Miami University
2. Adding notes so that the wireframe is the beginning of functional specs
3. Our developers now edit the wireframes directly
Hotgloo allows for annotations that can be the
beginning of your functional specs document.
        i.e. how page elements will be set up in development
Responsive prototyping for Webster University
+
Pay attention to how the outliers organize


                             Utility: custom mobile tools


                            Investigative links point
                            to responsive pages




www.usc.edu/?view=m
Pay attention to how the outliers organize




bu.edu does not follow a        nd.edu offers a primary navigation
universal model as you dig in   that only has 4 categories
More free advice


For responsive, look outside of higher education.
Pay attention to e-commerce




amazon.com
Responsive examples and design resources




  mediaqueri.es         awwwards.com          dribbble.com
 straightforward       several different     search responsive
responsive gallery   responsive resources       or mobile
Part 3
Postclassroom, postcampus
What does pervasive computing
     mean to education?
The knowledge capital is becoming completely
    unhinged from the physical location.
Heralds of change



     • online delivery
   • satellite locations
• global research centers
    • open courseware
  • startup universities
luonline.com
riosalado.edu
phoenix.edu
Global research branches
Open courses
Itunes U



• Audio and video
• Presentations / lectures
• Documents
• PDFs
• iBooks textbooks for iPad
• ePub books
• iOS apps
• Web links
oyc.yale.edu
Source: the Chronicle
The startup university
• launches in 2014
• attempting to compete with Ivy
  Leagues
• only looks at academic qualifications
  of students, not extracurricular or
  legacies
• all online courses deployed online
  featuring top faculty
• 25 students per online course to create
  selectivity and reasonable class sizes
• tuition of less than $20,000
• urban housing in major cities, students
  encouraged to switch cities




                   source: CNN.com
Where might we be headed?
Is TED.com the
 new Harvard?

Anya Kamenetz
 @anya1anya




    source:
 fastcompany
• top prestige
education brand

• very best minds
from all disciplines

• specialized /
customized
experience

• tools for sharing
and dialogue

• premium events
for networking


      source:
   fastcompany
Part 4
              Steal these ideas:
postdesktop marketing and utility for education
Look for geolocation opportunities.
scvngr.com/university
Look for ways to enhance or evolve storytelling.
storify.com
Look for ways of letting your audiences tell the story.
mxschool.edu
Apps for learning: the IT department
  as a concept-to-market agency
itap.purdue.edu/studio
Remember

Every web trend that comes along is a chance
   to reinvent yourself as a professional.
Shameless plug


EDUniverse.org
Doug Gapinski
Questions?
                              @thedougco




     clients.mstoner.com/postdesktop
Epilogue


                                                     Many Grateful Dead songs
  The skull and roses image is
                                                     deal with topics of loss and
a momento mori (symbol of our
                                                     hard luck, but the music is
   impermanence) from the
                                                    stylized to convey happiness
  Rubiyaat of Omar Khayyam.
                                                       and lightness of heart.
 (1048–1131) translated by the
  poet Edward Fitzgerald and
                                                    The celebratory roses that
   later appropriated by the
                                                    frame the skeleton provide
         Grateful Dead.
                                                       a counterweight to the
                                                      reminder of death. In the
                                 ‫ر)"'#"ت '&% $#"م‬    face of radical change and
                                                        difficulty, we can still
                                                              feel good.

Postdesktop