1 The User-Centered Design of York University’s Mobile Web Presence Peter Rowley, UIT, CANHEIT 2012 Presented on Tuesday, June 12 2012 – comments from audience added
1
The User-Centered Design of York University’s Mobile Web Presence Peter Rowley, UIT, CANHEIT 2012
Presented on Tuesday, June 12 2012 – comments from audience added
2
The User-Centered Design of York University’s Mobile Web Presence Experience Peter Rowley, UIT, CANHEIT 2012
Tuesday June 12, 2012 – includes comments from CANHEIT audience
3
Agenda • Introduction
• Needs Assessment (2010-11)
• Implementation (summer 2011)
• Overview of Service
• Usage
• Future
• Lessons Learned
4
Introduction
• Why did or would you “do mobile”?
Answers from audience:
- Keep up with trend / growing demand
- Reputational
- Emergency communications
5
Needs Assessment • Based on the anticipated rapid growth of smartphone
use, UIT’s 2010-11 plan included a mobile version of the student portal and work started in fall 2010
• Building on the tradition of user-centered design of the desktop student portal, we set out to assess mobile needs, first for students
• and later for staff
6
Needs Assessment - Devices • Which devices do/would you want to support on your
campus?
• Blackberry
• iPhone
• Android
• Others?
Answers from audience: all of first three, no others
7
Needs Assessment - Devices • Survey of students ran from Nov 2010 – Jan 2011
• A total of 1000 responses • Reasonably representative with respect to year and
whether or not in residence
• The impending rapid growth of smartphones was confirmed, with 40% intending to buy a new device in 2011: • Blackberry 44% • iPhone 29% • Android 16% • Windows 7 4% • Regular phone 5%
8
Needs Assessment – Devices 75% visit websites on their device
78% download apps to their device
How many apps do they regularly use?
3 or fewer 24%
4 – 10 52% 10 – 20 14% More than 20 10%
9
Needs Assessment – iPhone 98% visit websites on their device
99% download apps to their device
How many apps do they regularly use?
3 or fewer 9%
4 – 10 53% 10 – 20 21% More than 20 17%
Android results are similar
10
Needs Assessment - Devices • Based on usage patterns, either web sites or
applications could be used to deliver required content and tools
• Whatever is created will require marketing to be adopted
• As fewer apps are used, it may be harder for an app to be adopted than a web site
• It is also harder to develop apps (new technologies, device-specific) and harder to distribute (app stores)
11
Needs Assessment - Services • Which mobile services are or would be most important
for your students?
Answers from audience:
- transit, course schedule, grades, site-wide search
- student’s social calendar
12
Needs Assessment - Services My class schedule 82% Exam schedule 71% Moodle for my courses 67% Student account balance 55% Student portal 51% Campus maps 46% Book a library study room 46% YU card account balance 46% Library catalogue search 41% Security alerts 40%
Find a free computer in lab 38% Library account balance, holds, checkouts
38%
Instructor office hours 37% Hours for York retailers and restaurants
33%
Events on campus 27% My to-do list 23% Staff/faculty directory 21% University news 19% Sport York news and events 12%
Ratings are percentages of respondents who ranked the service important or very important
13
Needs Assessment - Services • Most popular services requested in free-form comments
• Enroll in courses • Drop courses • Course timetables • Course websites • Grades • Important dates • Course book lists • Exam schedule changes
14
Needs Assessment - Services • Other requests from free-form comments
• Central e-mail • Google maps with building details and directions • Library hours • Pay fees and fines • Contact Go Safe (campus escort) • Gym hours • Live chat with student services rep • Find a computer lab • Check room codes for graduate reading room • Bookstore search
15
Needs Assessment - Services • Mobile is not just web, SMS is important too
• Which events should generate an SMS for your students?
Answers from audience:
- Class cancellation, security incident
- space open in a class, communications from other students
16
Needs Assessment - Services
Class cancellations 80%
Weather alerts (campus closing) 69%
Release of grades 67%
Release of exam schedule 64%
Security alerts 46%
Library book on hold now available 38%
Overdue tuition fees 36%
YU Card balance below $5 23%
Don’t send me anything ever 8%
Some students noted a desire to indicate which events to receive by text message and which by e-mail
Events which should generate an SMS message
17
Needs Assessment - Devices • Similar survey carried out for staff
• 266 responses
• Some evidence that students participated in the staff survey
• Device preference is similar except: • iPhone 32% for staff, 27% for students • iPad 3% for staff, 0.4% for students
• 38% planned to buy a new device in 2011, with their preferences reflecting more interest in iPhone and iPad than students, as above
18
Needs Assessment - Services York e-mail 73% Directory 64% Campus maps 58% Security alerts 57% Transit info (bus, etc.) 48% Important Dates 46% Campus events 43% YU Card balance 35% University news 35%
Library catalogue 35% Your To Do list 34% Library account balance, holds, etc
33%
Hours for York retail outlets and restaurants
29%
Learning and development opportunities
16%
Classroom equipment ordering
12%
Sport York news & events 12%
19
Needs Assessment - Services • Most popular suggestions from free-form text comments
• Weather emergency • Class lists • Moodle access • Calendaring (Lotus Notes integration) • Important dates • Transit info, particularly re subway construction • Detailed campus map with room info
20
Needs Assessment - Services
Message Staff requesting Students requesting Weather alerts 80% 69% Security alerts 60% 46% Library book on hold now available
31% 38%
YU Card balance below $5 15% 23% Don’t send me anything ever
17% 8%
Events that should result in an SMS message being sent
21
The story continues… • We were “just slightly ahead of our time” when a request
from the Board of Governors arrived – establish a mobile web presence
• The effort to add mobile access to the student portal was expanded to include mobile-friendly versions of: • The home page of the main web site, www.yorku.ca • The captive portal login to campus WiFi • The login to campus single sign-on (Passport York) • Campus maps, directory, and events
• Scope became the mobile experience, not just the mobile web
• Fully addressing the mobile experience awaits full deployment of 802.1x access to WiFi
22
Launch – Summer 2011 • www.yorku.ca
• Central development • HTML5/CSS3 with jQuery Mobile (we used beta; now at
version 1.0.1) – no native apps • Liferay 5.2.8 portal
• Navigation to existing mobile-friendly sites • Future students (Drupal-based) • Library (did new development) • Development and sharing of mobile style guide to
coordinate cross-campus mobile web look and feel
23
Overview
24
Overview
25
Overview
26
Overview
27
Usage – Visits
Average visits per day to home page October 2011 1,100 January 2012 2,400 All of Jan 2012 75,000 82% are return visitors
28
Usage – Relative to desktop • The proportion of usage that is mobile is growing slowly
• For example, for the Student Portal • October 2011
• 8,905 out of 92,705 = 9.6% • January 2012
• 18,400 out of 182,800 = 9.9%
29
Usage – Devices (January 2012)
Which device would you expect to be first? Answers from audience: - Slight edge for Android as first - iPhone a close second - Blackberry third
30
Usage – Devices (January 2012) iPhone OS 62.8% Blackberry OS 18.1% Android 17.4%
iPhone breakdown: 50% iPhone 4 6.4% iPod touch 6.3% iPhone 3GS
Similar results for March 2012, with 19% Android 77% version 2.3.3 8% ver 3.1, 8% ver 4.03, 3% ver 2.1
Blackberry usage rose in fall, slow decline now
31
Usage – Browsers (January 2012)
Safari 77.7% Android 16.3% Blackberry 9xxx 2.6%
A reasonable strategy is to develop for Safari and if the service takes off, test on Android also
32
Usage - Services • Due to implementation architecture, analytics services
are not counting service requests accurately • Multiple pages are loaded all at once
• Results in artificially high bounce rates since needs can be satisfied completely within the first page load
33
Coordinating Across Campus • The initiative was an opportunity to create and sustain a
coordinated cross-campus mobile web presence
• Basic steps toward that goal were achieved
• A framework for future coordination was established • Mobile web working group
• Cross-campus committee open to all Faculties, administrative units, interested parties
• Led by Marking & Communication and IT • Eleven areas for potential collaboration / standards
34
Eleven Possible Areas of Collaboration
• Device support
• Implementation technologies
• Content management
• Appearance
• Navigation
• Search
• Authentication
• Personalization
35
Eleven Possible Areas of Collaboration
• Distribution
• Analytics
• Accessibility
Of all these, content management, appearance/navigation, and analytics have, to date, generated the most interest across campus.
36
Areas of Collaboration • Appearance and Navigation
• UIT and Marketing and Communication created a mobile look and feel, initially for the student portal
• Adapted for other central sites (main site, directory, events, etc.)
• Borrowed and adapted for library sites
• Content management • Sharing of templates for Drupal, Wordpress, and jQuery
Mobile • Distribution of mobile style guide and supporting CSS file
37
Areas of Collaboration • Analytics
• Everyone initially used Google Analytics yet found it wanting
• York “best practice” became the use of both Google Analytics and Percent Mobile
• GA may have caught up
38
Future Areas • Some areas have not been pursued yet, awaiting
resources • Search: allow mobile users to find web sites and apps by
keyword and other search (e.g. location) • Personalization: allow cross-site personalization, e.g. by
audience (student, staff, alumni, public), location, etc. • Distribution: organize the distribution of access to web
sites, particularly mobile applications
39
Lessons Learned • There won't be a lot of traffic, at least not to start, so
discover user needs to drive impactful functionality • Those needs will reflect their unique situations
• Mobile user needs are not the same as for desktop
• Mobile web sites can be good solutions to mobile needs
• Typical mobile architectures can complicate gathering usage statistics
• If you are ahead of your campus, particularly on look and feel, you have a better chance for a cross-campus integrated experience
40
© 2011 York University | York University Mobile Web Site Style Guide August 2011 Ver 1.0 | Questions? [email protected]
41
© 2011 York University | York University Mobile Web Site Style Guide August 2011 Ver 1.0 | Questions? [email protected]
CSS
Colours
Fonts
Buttons
Page Structure Essentials
Content Modules
Navigation
This document outlines the graphic standards for the mobile view of my.yorku.ca. It is intended to be used as a guide for all York University mobile sites.
42
43
Thanks! • Contact me [email protected]
• Mobile Style Guide www.yorku.ca/prowley/MSG.pdf
Questions?