Mobile Web
From Strategy to Prototyping and Launch
Kamalika Sandell
Associate CIO
American University
Francesco de Leo
Director, Web & Emerging Technologies
American University
Agenda
 About American University (AU)
 AU’s Mobile Strategy
 Research & Analysis
 Governance
 Recommendations
 AU’s Mobile Approach
 Technology/Architecture Review
 Demo
 Future Considerations
About American University
 Enrollment: +12,700 Students


+7,200 Undergraduate (61 Bachelor’s programs)
+5,500 Graduate (54 Master & 11 Doctoral programs)
 7 Schools/Colleges







College of Arts and Sciences
Kogod School of Business
School of Communication
School of International Service
School of Professional & Extended Studies
School of Public Affairs
Washington College of Law
AU & Technology
 One of the first universities in the nation to
adopt wireless technology across all
campus buildings in 2001
 In 2009, American University identified
"employing technology to empower
excellence" as an enabling goal of the
University's Strategic Plan.
 Additional Recognitions
AU’s Mobile Strategy
AU Mobile Traffic
AU Mobile Traffic
August 2011
Freshman class arrives
Mobile average visits double
AU Mobile Traffic
Timeline
September 2011
A Mobile Strategy Working Group
is formed to help formulate a
Mobile Strategy for the University
AU Mobile Timeline
November 2011
First functional Prototype of
AU’s mobile site is developed
AU Mobile Timeline
February 2012
Mobile Strategy document
completed
AU Mobile Timeline
April 2012
AU’s Mobile Site (beta)
goes live
AU Mobile Timeline
June 2012
AU’s Mobile Site Phase 1
Completed!
AU Mobile Timeline
Today
Since phase 1 completion
Mobile average visits doubled
AU Mobile Traffic % of Total
If this rate of growth continues, mobile could
exceed 25% of all traffic by 2014
Q3 2012
Q2 2012
Q1 2012
Q3 2011
8.81%
Q2 2011
7.41%
Q1 2011
Q1 2010
1.31%
Q2 2010
1.59%
Q3 2010
2.10%
5.35%
Q4 2010
2.20%
3.10%
3.76%
11.01
%
Q4 2011
5.36%
Approach to Developing Strategy
 Cross functional working group representing
key stakeholders and constituencies
 Clear goals for working group




Prioritize objectives
Assess infrastructure needs
Assess higher education market
Develop high level roadmap
Working Group Activities




Review mobile sites by other institutions
Qualitative research (Educause, Gartner, etc)
Interviews with campus stakeholders
Facilitate needs assessment analysis
 Focus groups
 Card sort exercise
 Infrastructure review
 Develop a proof of concept mobile site
Analysis: Mobile @ Other Universities
Schools surveyed
Type of App
# Deployed
Auburn
Michigan
Texas Tech.
Directory
16
Bucknell
MIT
U.T.
Library
15
Duke
Northwestern
UC Berkley
Maps
15
Flordia State
Oxford
UCSD
News
15
G.W.
Roanoke
Univ. Wash.
Athletics
13
Harvard
Seton Hall
W.V.U
Events
11
Shuttles (bus)
11
Courses
10
Loyola Chicago Stanford
Card Sort: Pick 5
Card Sort: Students (62)
Card Sort: Staff (76)
Library
9
Card Sort: Faculty (24)
Library
17
News
4
Card Sort: Alumni (14)
RSVP for Events
10
Library
2
Card Sort: Aggregate Results
ALUMNI: 14
FACULTY: 24
STUDENTS: 62
STAFF: 76
Academic Calendar
Alumni Info
Dining Menus
Directories
Emergency Alerts
Events
Hours of Operation
Library
News
Schedule of Classes
Shuttle Tracker
EagleBucks/Dining
Library Account
Make A Gift
My Class Schedule
My Grades
3
10
0
9
1
11
0
2
10
0
3
3
2
9
3
6
Academic Calendar
Alumni Info
Dining Menus
Directories
Emergency Alerts
Events
Hours of Operation
Library
News
Schedule of Classes
Shuttle Tracker
EagleBucks/Dining
Library Account
Make A Gift
My Class Schedule
My Grades
9
0
1
17
17
8
5
17
4
5
6
6
13
4
8
3
Academic Calendar
Alumni Info
Dining Menus
Directories
Emergency Alerts
Events
Hours of Operation
Library
News
Schedule of Classes
Shuttle Tracker
EagleBucks/Dining
Library Account
Make A Gift
My Class Schedule
My Grades
32
1
34
16
23
34
41
19
15
33
52
55
27
2
54
60
Academic Calendar
Alumni Info
Dining Menus
Directories
Emergency Alerts
Events
Hours of Operation
Library
News
Schedule of Classes
Shuttle Tracker
EagleBucks/Dining
Library Account
Make A Gift
My Class Schedule
My Grades
29
9
8
60
35
32
18
9
33
14
42
46
27
24
21
17
My Teaching Schedule
Request Info on AU
RSVP for Events
Sign Time Sheet
View AU Finances
1
8
10
2
5
My Teaching Schedule
Request Info on AU
RSVP for Events
Sign Time Sheet
View AU Finances
10
3
15
6
0
My Teaching Schedule
Request Info on AU
RSVP for Events
Sign Time Sheet
View AU Finances
11
9
19
37
37
My Teaching Schedule
Request Info on AU
RSVP for Events
Sign Time Sheet
View AU Finances
22
33
46
65
44
1 group > 50%
More than 1 group > 50%
Sample Demand vs Effort Matrix
Strategy Findings/ Recommendations







Students first, but “audience-inclusive”
Leverage currently owned technologies, open-source
frameworks, and in-house development to develop a mobile
web presence
Modernize enterprise systems to ensure the optimal
delivery
Upgrade the University’s cellular communication networks
Implement appropriate security policies to protect endpoints
Phase deployments, focusing initially on available
structured data and the integration of existing mobile web
resources.
Invest in continuous innovation with managed governance
to promote AU’s Mobile Platform
AU’s Mobile Approach
AU’s Web Technology Overview

Content Management System (CMS)

CommonSpot by PaperThin
 Microsoft SQL Server
 Adobe ColdFusion
 Developer Framework (APIs)

University Portal

Microsoft SharePoint
 ERP Vendor Self-Service Integrations


Colleague by Ellucian (formerly Datatel)
Legacy ColdFusion Portal
 Custom Code



Adobe ColdFusion
Unidata/Envision
Data Warehouse

Provides ad-hoc feeds to CMS and Portal
AU’s Web Architecture Overview [SIMPLIFIED]
RSS/XML
CMS
Portal
SSO
Load Balancer
ColdFusion
Server
Oracle
Oracle
File Server
MSQL
File System/Database Backups
Network, System and Application Vulnerability Scanning
MSQL
ROPS 3
ROPS 2
SharePoint
Data Warehouse
SharePoint
SharePoint
Legacy Portal
ROPS 1
CommonSpot CMS
ColdFusion Servers
TMG
Authoring
ODBC
Mobile Worthy Content
 Created an inventory of existing resources
and applications based on the needs
assessment exercise
 Mapped the ease of conversion of these
 Structured versus un-structured data
 Read .vs write considerations
Mobile Sites vs. Mobile Apps









Immediacy – instantly available
Compatibility – compatible across devices
Upgradability – can be updated instantly
Findability – can be found easily
Shareability – can be shared easily
Reach – have broader reach
Time and Cost - easier and less expensive
Support – easy to upgrade
Lifecycle – unlike apps, can’t be deleted
HTML5 for Mobile Sites
 ~95% of AU’s mobile traffic coming from
devices that support most of the HTML5
features
 In combination with JavaSCript and CSS3,
allows for an “app-like” experience; rich
Internet application (RIA)-like capabilities
 Does not rely on "native" applications and
proprietary app stores
HTML5 Opinions Range
"HTML5 will make
everything else
irrelevant."
"It will take over a
decade for HTML5 to
be ratified, so we
don't need to pay
attention to it until
then."
HTML5 Status
 Still under development
 W3C to release a stable HTML5
Recommendation by the end of 2014 and an
HTML 5.1 specification Recommendation by
the end of 2016
 Widely used among progressive Web
designers and among mobile application
developers.
HTML5 Mobile Related Features











Application Cache - a set of cached resources
Web Storage - persistent and session storage.
Geolocation - Tracking using GPS, cells or Wi-Fi.
Multimedia - Video & Audio Players
Server-Sent Events - Maintain the connection to the server
open
Web Sockets – Bi-directional protocol over HTTP
Motion Sensors - Accelerometer, Gyroscope, Magnetometer
Media Capture - Taking pictures, record video and audio from
an input file type
Form Virtual Keyboards - Inputs with different keyboards
Touch Events - touchstart, touchend, touchmove, touchcancel
File API - Opening local files through input type
See MobileHTML5.org
Selecting a Mobile Framework
 Reviewed commercial and open
frameworks and developed a prototype
using the jQuery Mobile framework
 HTML5-based user interface system for all
popular mobile device platforms
 Built on jQuery and jQuery UI foundation
(already in use within AU’s web resources)
See jQueryMobile.com
Development: 15 Days Start to Finish
 Resources
 1 Project Manager (@25%)
 4 Developers (@75%)
 3 Cold Fusion Developers
 1 SharePoint Developer





Understand and adapt framework
Standards for content templates
Minimum of 5 mobile site applications
Testing (UAT, performance, security, etc)
Go Live April 30, 2012
27 Mobile Site Features
PHASE 1
AND MORE…
• Mobile Framework
• Faculty/Staff Directory
• News
• Events Calendar
• Library
• Class Schedule
• Schools
• Social Media
• Academic Calendar
• Emergency Alerts
• IT System Status
• Campus Map
• Shuttle Tracker
• myAU Portal
• Schools (News, Events, Faculty)
• Athletics
• Dining
• Class Descriptions
• Student GMail
• Today@AU
• Campus Store
• Customize Home
• About AU and AU Mobile
• Contact Us
• Search
AU’s Mobile DEMO
Final Thoughts
Next Steps






Upgrade plan for campus cellular network
Outsourcing mobile device support
BYOD policy and considerations
Pedagogy
Augmented reality/virtual tours
Include mobile considerations for all future web
initiatives
 HTML5 for desktop version of site responsive
site layouts
 AU mobile app registry
 Hybrid mobile app with mobile site?
In Summary…
 Develop a mobile strategy first
 Create an inventory of existing structured
data from which to develop mobile
renderings
 Create an impact vs effort prioritization
method to assess scope and phase
 Relate the above activities in the context of
future opportunities and mobile trends..
Thanks!