SlideShare a Scribd company logo
1 of 77
Download to read offline
“We are so overwhelmed with things these days that our lives are
all, more or less, cluttered. Everyone is hurrying and usually just a
little late. Notice the faces of the people who rush past on the
streets. They nearly all have a strained, harassed look, and anyone
you meet will tell you there is no time for anything anymore.”	




Written in 1924 by Laura Ingalls Wilder—while living on a farm in rural
Missouri.

1
Pragmatic Principles of Mobile Design	

Download at: http://slidesha.re/PPMID

2
Brandon Carson	

Twitter: @brandonwcarson	

LinkedIn: brandoncarson	

E-mail: bcarson@entirenet.net	

!
!
!

Michelle Lentz	

Twitter: @michellelentz	

LinkedIn: michelleslentz	

E-mail: michelle.lentz@oracle.com
3
mobile behaviors and mindsets	

mobile design	

mobile case studies
5
There is no such thing as “mobile learning” anymore.

6
Your workforce is already mobile.
7
You need to think mobile first.

8
How does my design change when dealing with
different screen sizes and resolutions?

9
How do I take advantage of mobile device capabilities?
10
How will I support and maintain content

development for multiple devices?

11
Prepared to look closely at your content development workflow,
your process, and even your organizational structure?
12
Willing to look at different internal tools, different ways to communicate?

13
Willing to look at your staff capabilities, roles and job descriptions?	

… because …



© Flickr : hammershaug


14
Designing and delivering mobile-optimized learning experiences

means you may need to change

how you do what you do, and who you have doing it.
16
mobile behaviors and mindsets	

mobile design	

mobile case studies
Mobile is ubiquitous. Everyone is mobile, all the time.
People do read on a smartphone.
Knowing the type of device the user is holding doesn’t

tell us anything about their intent.
The device we choose to use at a particular time is driven by our context

21
The four key context drivers are:	

• Time	

• Goal	

• Location	

• Attitude
22
Smartphones are the backbone of our daily media use.	

They are the devices used most throughout the day and serve as the
most common starting point for activities across multiple screens.

23
“I consider my phone to be my personal device, my
go-to device. It’s always close to me if I need quick,
precise feedback.”
24
“When I want more in-depth information, I use
my tablet. I’m less distracted because I can’t get a
phone call, and I can ignore email on it.”
25
“My laptop is purely for business. That’s work,
where I feel like I need to be doing something
productive.”

26
Ethnography – go out there and understand
how people behave with mobile devices in the
real world and what they actually need.

27
From Yahoo, September 2011
From Yahoo, September 2011
People “pogo-stick”	

!

Context drives device choice. The four
context drivers are:	

Time	

Goal	

Location	

Attitude	

!

Smartphones are the backbone of our
daily device interactions.

Image from Life Magazine, 1955. Photographer George Skadding.
mobile behaviors and mindsets	

mobile design	

mobile case studies
app types: what are the differences?
discover  install  tap  run
native apps	

!

must be installed on the device	

written specifically for the OS
web apps	

!

reside on a server	

coded once for multiple OS’s
Characteristic

Native

Downloaded to the device

X

Coded in a language specific to the device OS	

(Objective C, Java)

Web

X

Runs in a browser

X

Coded in HTML, JavaScript, and CSS

X

Distributed via an app store

X

Full use of device hardware and APIs

X

Limited access to device hardware and data, as well as
user data

X
hybrid apps	

!

written in native languages	

downloaded to the device	

can access APIs	

content comes from the web
Why do you want the content to be available on
mobile devices?	

!

Is there a business need to support deployment
on mobile devices?	


always ask why
!

How are you choosing the specific

device(s) to support?	

!

Should there be a different experience on a
phone vs. a tablet?
know mobile constraints
small screens
unreliable networks
people in all kinds of situations
Don’t build or convert 150 courses all at once.
Conduct a pilot. Start with one course and create
it for every device you intend to support.	

!

Take into account any problems during
one step at a time
development, as well as deployment.	

!

Learn from your testers and apply those lessons
to the other courses before you start developing.
chunkify
Because They Pogo-Stick
what’s your orientation?
If your app requires substantial interaction, consider a native app over a
web app. Complex tasks can be difficult on a mobile browser.	

!

Consider tap symmetry -- give your users enough space to touch the
correct area. 	

!

Re-think radio buttons because they are often too close together, and
it's easy to touch the wrong one.	

!

Consider having a back button. It reduces navigation error.	

!

Make sure your touchable areas LOOK touchable.
Re-consider text input interactions. Users don't like to type on the
touchscreen more than they have to.	

!

People share tablets -- they don't share smartphones.
how clean are you?	

!

one action per screen	

only necessary elements	

adequate spacing
text, tilt and go
design face-off
A

B
A

B
A

B
A

B
mobile behaviors and mindsets	

mobile design	

mobile case studies
Articulate iPad App

Flash  Mobile conversion project
Articulate Storyline
Desktop
Conversion from Articulate Presenter
Purpose

Extend delivery option of existing Flash-based desktop course to tablets

Output

Web and native app to support Android, Windows and iOS devices

Tools Used

Articulate Presenter and Storyline

Key Team
Members

Me

Timeline

2 weeks to convert 7 modules (2 hrs. of seat time) from Articulate
Presenter to Storyline and output to both web and native versions
Conversion from Articulate Presenter
Bottom Line:	

• Storyline easily converts existing Presenter files	

• Watch those Engage interactions	

• If you have substantial interaction, consider the
iPad app over a web app (native). Complex
tasks can be difficult using a tablet browser	

• Know that when a user can’t activate
navigation, they consider the app to be broken
Mobile App for New Hires

Need to get
FULL
screenshot
of app s
Web Page
using
SnagIt?
Mobile App for New Hires: Mobile Only Game
Mobile App for New Hires
Purpose

Give new hires access to most requested information without the complication of a firewall
and from whatever device they choose to use. App includes Oracle news, welcome videos
from executives, a To Do list, the History of Oracle, and a game.

Output

Web-based mobile app that also works on a PC. By thinking mobile first, we were able to
create a responsive web app that supports both mobile and desktop.

Tools Used

App was created in Dreamweaver with extensive use of CSS to create the responsive design.

Key Team
Members

Web designer/programmer, graphic designer, instructional designers, HR SME.

Timeline

Ongoing. While move new hire information to mobile is important, we have an iterative
process with exhaustive reviews. We’re constantly refining and learning. Our goal is to get
this one right and then apply our lessons learned to future apps.
Mobile App for New Hires

Bottom Line:	

• We’re still in beta.	

• Too many cooks in the kitchen.	

• Lessons learned on an internal wiki.	

• IT/Security concerns
Mobile App for Performance Support
Mobile App for Performance Support
Purpose

Provide a support aid to reinforce information about a specific topic.

Output

Web-based mobile app optimized for iPhone.

Tools	
  Used

App was created in Adobe Muse using existing templates provided by
Muse.

Key	
  Team	
  
Members

I developer and 1 ID

Timeline

3 days

http://tincanapi.businesscatalyst.com/overview-of-tin-can.html
Mobile App for Performance Support

Bottom Line:	

• Muse is a WYSIWYG editor for
creating web apps	

• Comes loaded with templates and
widgets	

• Real easy to build rapid prototypes: you
can import PSD and Fireworks files
Focus on goals	

!

Launch and Iterate	

!

Take small steps
some resources:	

http://www.html5rocks.com	

http://www.w3.org/Mobile/	

http://www.caniuse.com	

http://www.worklearnmobile.org/
some research for this

presentation came from:	

!

Yahoo! Mobile Mindsets:


http://www.ipsos-mori.com/Assets/Docs/Publications/
IpsosMediaCT_Yahoo_Mobile_Modes_Sept2011.pdf	

!

Google:The New Multi-Screen World Study


http://www.google.com/think/research-studies/the-new-multi-screenworld-study.html	

!
Brandon Carson	

Twitter: @brandonwcarson	

LinkedIn: brandoncarson	

E-mail: bcarson@entirenet.net	

!
!
!

Michelle Lentz	

Twitter: @michellelentz	

LinkedIn: michelleslentz	

E-mail: michelle.lentz@oracle.com
77

More Related Content

What's hot

Mobile Means Business
Mobile Means BusinessMobile Means Business
Mobile Means BusinessTack Mobile
 
#MobileInAction - iRecruitExpo June 2013, Amsterdam
#MobileInAction - iRecruitExpo June 2013, Amsterdam#MobileInAction - iRecruitExpo June 2013, Amsterdam
#MobileInAction - iRecruitExpo June 2013, AmsterdamDave Martin
 
Communication Design for the Mobile Experience
Communication Design for the Mobile ExperienceCommunication Design for the Mobile Experience
Communication Design for the Mobile ExperienceDavid Drucker
 
Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...
Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...
Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...Lumen Consulting
 
Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)BraveNewCode Inc.
 
Enterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in Stockholm
Enterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in StockholmEnterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in Stockholm
Enterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in StockholmJoel Oleson
 
Pre-Conference Course: Wearables Workshop: UX Essentials - Phillip Likens
Pre-Conference Course: Wearables Workshop: UX Essentials - Phillip LikensPre-Conference Course: Wearables Workshop: UX Essentials - Phillip Likens
Pre-Conference Course: Wearables Workshop: UX Essentials - Phillip LikensUXPA International
 
Mobile Web (R)Evolution - Sept 2011
Mobile Web (R)Evolution - Sept 2011Mobile Web (R)Evolution - Sept 2011
Mobile Web (R)Evolution - Sept 2011arendsf
 
How Technology is Revolutionizing Property Assessments
How Technology is Revolutionizing Property AssessmentsHow Technology is Revolutionizing Property Assessments
How Technology is Revolutionizing Property AssessmentsEDR
 
QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10Almog Koren
 
Why Do Mobile Projects Fail?
Why Do Mobile Projects Fail?Why Do Mobile Projects Fail?
Why Do Mobile Projects Fail?Indiginox
 
R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...
R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...
R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...Wayne Chen
 
Apps For Actuaries Presentation
Apps For Actuaries PresentationApps For Actuaries Presentation
Apps For Actuaries PresentationRichard Junker
 
101 Conversational User Interfaces
101 Conversational User Interfaces 101 Conversational User Interfaces
101 Conversational User Interfaces Redweb Ltd
 
10 Mistakes In Mobile Marketing1 License To Steal
10  Mistakes In  Mobile  Marketing1  License To Steal10  Mistakes In  Mobile  Marketing1  License To Steal
10 Mistakes In Mobile Marketing1 License To StealCellular Sales
 

What's hot (20)

Mobile Means Business
Mobile Means BusinessMobile Means Business
Mobile Means Business
 
The Future of eLearning
The Future of eLearningThe Future of eLearning
The Future of eLearning
 
#MobileInAction - iRecruitExpo June 2013, Amsterdam
#MobileInAction - iRecruitExpo June 2013, Amsterdam#MobileInAction - iRecruitExpo June 2013, Amsterdam
#MobileInAction - iRecruitExpo June 2013, Amsterdam
 
Apps
AppsApps
Apps
 
The iPad Classroom
The iPad ClassroomThe iPad Classroom
The iPad Classroom
 
Communication Design for the Mobile Experience
Communication Design for the Mobile ExperienceCommunication Design for the Mobile Experience
Communication Design for the Mobile Experience
 
Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...
Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...
Exhibitor2011 Session: Social Media and Mobile Event Technology, Tools and Ap...
 
Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)Go Mobile With WordPress (2012)
Go Mobile With WordPress (2012)
 
Enterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in Stockholm
Enterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in StockholmEnterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in Stockholm
Enterprise Mobile Strategy for SharePoint Server 2013 at SEF2014 in Stockholm
 
Pre-Conference Course: Wearables Workshop: UX Essentials - Phillip Likens
Pre-Conference Course: Wearables Workshop: UX Essentials - Phillip LikensPre-Conference Course: Wearables Workshop: UX Essentials - Phillip Likens
Pre-Conference Course: Wearables Workshop: UX Essentials - Phillip Likens
 
Video Games “in” the Classroom
Video Games “in” the ClassroomVideo Games “in” the Classroom
Video Games “in” the Classroom
 
trends in online publishing
trends in online publishingtrends in online publishing
trends in online publishing
 
Mobile Web (R)Evolution - Sept 2011
Mobile Web (R)Evolution - Sept 2011Mobile Web (R)Evolution - Sept 2011
Mobile Web (R)Evolution - Sept 2011
 
How Technology is Revolutionizing Property Assessments
How Technology is Revolutionizing Property AssessmentsHow Technology is Revolutionizing Property Assessments
How Technology is Revolutionizing Property Assessments
 
QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10QuickSoft Mobile Tips & Tricks 11-03-10
QuickSoft Mobile Tips & Tricks 11-03-10
 
Why Do Mobile Projects Fail?
Why Do Mobile Projects Fail?Why Do Mobile Projects Fail?
Why Do Mobile Projects Fail?
 
R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...
R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...
R2i State of Mobile App and Web: Tips and Trends to Building a Solid Mobile P...
 
Apps For Actuaries Presentation
Apps For Actuaries PresentationApps For Actuaries Presentation
Apps For Actuaries Presentation
 
101 Conversational User Interfaces
101 Conversational User Interfaces 101 Conversational User Interfaces
101 Conversational User Interfaces
 
10 Mistakes In Mobile Marketing1 License To Steal
10  Mistakes In  Mobile  Marketing1  License To Steal10  Mistakes In  Mobile  Marketing1  License To Steal
10 Mistakes In Mobile Marketing1 License To Steal
 

Similar to Overwhelmed by the Pace of Modern Life

Tincan - Mobile Elephant
Tincan - Mobile ElephantTincan - Mobile Elephant
Tincan - Mobile ElephantBen Holliday
 
Content strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.comContent strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.comAn Le Truong
 
Overcoming design challenges in HAT-based multichannel publishing
Overcoming design challenges in HAT-based multichannel publishingOvercoming design challenges in HAT-based multichannel publishing
Overcoming design challenges in HAT-based multichannel publishingJack Molisani
 
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013Karen N. Johnson
 
Mobile Learning: the Who, the Why and the What Now
Mobile Learning: the Who, the Why and the What NowMobile Learning: the Who, the Why and the What Now
Mobile Learning: the Who, the Why and the What NowKineo
 
The mobile ecosystem & technological strategies
The mobile ecosystem & technological strategiesThe mobile ecosystem & technological strategies
The mobile ecosystem & technological strategiesIvano Malavolta
 
Going mobile edu web presentation - 2011
Going mobile   edu web presentation - 2011Going mobile   edu web presentation - 2011
Going mobile edu web presentation - 2011Nathan Gerber
 
Mobile app development company
Mobile app development companyMobile app development company
Mobile app development companyAleezzaa
 
10 stops towards a responsive web design mindset
10 stops towards a responsive web design mindset10 stops towards a responsive web design mindset
10 stops towards a responsive web design mindsetMiika Puputti
 
Putting Mobile First - July 2013
Putting Mobile First - July 2013Putting Mobile First - July 2013
Putting Mobile First - July 2013Precedent
 
Mobile Learning Guide App: Webinar for Training MagazineLearned
Mobile Learning Guide App: Webinar for Training MagazineLearnedMobile Learning Guide App: Webinar for Training MagazineLearned
Mobile Learning Guide App: Webinar for Training MagazineLearnedadlmobile
 
Optimising Mobile Seminar, Melbourne & Perth-June'13
Optimising Mobile Seminar, Melbourne & Perth-June'13Optimising Mobile Seminar, Melbourne & Perth-June'13
Optimising Mobile Seminar, Melbourne & Perth-June'13Precedent
 
Going mobile writing content for mobile
Going mobile  writing content for mobileGoing mobile  writing content for mobile
Going mobile writing content for mobileMaya Irving-Regev
 
How To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple DevicesHow To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple DevicesEntirenet
 
Mobile App vs Mobile Web Development
Mobile App vs Mobile Web DevelopmentMobile App vs Mobile Web Development
Mobile App vs Mobile Web DevelopmentTAG_education
 
Mobile first-edinburgh 030913
Mobile first-edinburgh 030913Mobile first-edinburgh 030913
Mobile first-edinburgh 030913Precedent
 
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...Jeremy Johnson
 
Responsive web design ms training audience
Responsive web design ms training audienceResponsive web design ms training audience
Responsive web design ms training audienceBill England
 

Similar to Overwhelmed by the Pace of Modern Life (20)

Tincan - Mobile Elephant
Tincan - Mobile ElephantTincan - Mobile Elephant
Tincan - Mobile Elephant
 
Content strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.comContent strategy for mobile by letruongan.com
Content strategy for mobile by letruongan.com
 
Overcoming design challenges in HAT-based multichannel publishing
Overcoming design challenges in HAT-based multichannel publishingOvercoming design challenges in HAT-based multichannel publishing
Overcoming design challenges in HAT-based multichannel publishing
 
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
 
Mobile Learning: the Who, the Why and the What Now
Mobile Learning: the Who, the Why and the What NowMobile Learning: the Who, the Why and the What Now
Mobile Learning: the Who, the Why and the What Now
 
The mobile ecosystem & technological strategies
The mobile ecosystem & technological strategiesThe mobile ecosystem & technological strategies
The mobile ecosystem & technological strategies
 
Going mobile edu web presentation - 2011
Going mobile   edu web presentation - 2011Going mobile   edu web presentation - 2011
Going mobile edu web presentation - 2011
 
Mobile app development company
Mobile app development companyMobile app development company
Mobile app development company
 
Designing for Context
Designing for ContextDesigning for Context
Designing for Context
 
10 stops towards a responsive web design mindset
10 stops towards a responsive web design mindset10 stops towards a responsive web design mindset
10 stops towards a responsive web design mindset
 
Putting Mobile First - July 2013
Putting Mobile First - July 2013Putting Mobile First - July 2013
Putting Mobile First - July 2013
 
Mobile Learning Guide App: Webinar for Training MagazineLearned
Mobile Learning Guide App: Webinar for Training MagazineLearnedMobile Learning Guide App: Webinar for Training MagazineLearned
Mobile Learning Guide App: Webinar for Training MagazineLearned
 
Optimising Mobile Seminar, Melbourne & Perth-June'13
Optimising Mobile Seminar, Melbourne & Perth-June'13Optimising Mobile Seminar, Melbourne & Perth-June'13
Optimising Mobile Seminar, Melbourne & Perth-June'13
 
Going mobile writing content for mobile
Going mobile  writing content for mobileGoing mobile  writing content for mobile
Going mobile writing content for mobile
 
How To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple DevicesHow To Design Mobile Content For Multiple Devices
How To Design Mobile Content For Multiple Devices
 
Mobile Learning Development: Get it Right
Mobile Learning Development: Get it RightMobile Learning Development: Get it Right
Mobile Learning Development: Get it Right
 
Mobile App vs Mobile Web Development
Mobile App vs Mobile Web DevelopmentMobile App vs Mobile Web Development
Mobile App vs Mobile Web Development
 
Mobile first-edinburgh 030913
Mobile first-edinburgh 030913Mobile first-edinburgh 030913
Mobile first-edinburgh 030913
 
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
 
Responsive web design ms training audience
Responsive web design ms training audienceResponsive web design ms training audience
Responsive web design ms training audience
 

Recently uploaded

Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...Neo4j
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountPuma Security, LLC
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityPrincipled Technologies
 
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...gurkirankumar98700
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Servicegiselly40
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge
 

Recently uploaded (20)

Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 

Overwhelmed by the Pace of Modern Life

  • 1. “We are so overwhelmed with things these days that our lives are all, more or less, cluttered. Everyone is hurrying and usually just a little late. Notice the faces of the people who rush past on the streets. They nearly all have a strained, harassed look, and anyone you meet will tell you there is no time for anything anymore.” 
 Written in 1924 by Laura Ingalls Wilder—while living on a farm in rural Missouri. 1
  • 2. Pragmatic Principles of Mobile Design Download at: http://slidesha.re/PPMID 2
  • 3. Brandon Carson Twitter: @brandonwcarson LinkedIn: brandoncarson E-mail: bcarson@entirenet.net ! ! ! Michelle Lentz Twitter: @michellelentz LinkedIn: michelleslentz E-mail: michelle.lentz@oracle.com 3
  • 4. mobile behaviors and mindsets mobile design mobile case studies
  • 5. 5
  • 6. There is no such thing as “mobile learning” anymore. 6
  • 7. Your workforce is already mobile. 7
  • 8. You need to think mobile first. 8
  • 9. How does my design change when dealing with different screen sizes and resolutions? 9
  • 10. How do I take advantage of mobile device capabilities? 10
  • 11. How will I support and maintain content
 development for multiple devices? 11
  • 12. Prepared to look closely at your content development workflow, your process, and even your organizational structure? 12
  • 13. Willing to look at different internal tools, different ways to communicate? 13
  • 14. Willing to look at your staff capabilities, roles and job descriptions? … because … 
 © Flickr : hammershaug
 14
  • 15. Designing and delivering mobile-optimized learning experiences
 means you may need to change
 how you do what you do, and who you have doing it.
  • 16. 16
  • 17. mobile behaviors and mindsets mobile design mobile case studies
  • 18. Mobile is ubiquitous. Everyone is mobile, all the time.
  • 19. People do read on a smartphone.
  • 20. Knowing the type of device the user is holding doesn’t
 tell us anything about their intent.
  • 21. The device we choose to use at a particular time is driven by our context 21
  • 22. The four key context drivers are: • Time • Goal • Location • Attitude 22
  • 23. Smartphones are the backbone of our daily media use. They are the devices used most throughout the day and serve as the most common starting point for activities across multiple screens. 23
  • 24. “I consider my phone to be my personal device, my go-to device. It’s always close to me if I need quick, precise feedback.” 24
  • 25. “When I want more in-depth information, I use my tablet. I’m less distracted because I can’t get a phone call, and I can ignore email on it.” 25
  • 26. “My laptop is purely for business. That’s work, where I feel like I need to be doing something productive.” 26
  • 27. Ethnography – go out there and understand how people behave with mobile devices in the real world and what they actually need. 27
  • 30.
  • 31. People “pogo-stick” ! Context drives device choice. The four context drivers are: Time Goal Location Attitude ! Smartphones are the backbone of our daily device interactions. Image from Life Magazine, 1955. Photographer George Skadding.
  • 32.
  • 33. mobile behaviors and mindsets mobile design mobile case studies
  • 34. app types: what are the differences?
  • 35. discover install tap run
  • 36. native apps ! must be installed on the device written specifically for the OS
  • 37. web apps ! reside on a server coded once for multiple OS’s
  • 38. Characteristic Native Downloaded to the device X Coded in a language specific to the device OS (Objective C, Java) Web X Runs in a browser X Coded in HTML, JavaScript, and CSS X Distributed via an app store X Full use of device hardware and APIs X Limited access to device hardware and data, as well as user data X
  • 39. hybrid apps ! written in native languages downloaded to the device can access APIs content comes from the web
  • 40. Why do you want the content to be available on mobile devices? ! Is there a business need to support deployment on mobile devices? always ask why ! How are you choosing the specific
 device(s) to support? ! Should there be a different experience on a phone vs. a tablet?
  • 41. know mobile constraints small screens unreliable networks people in all kinds of situations
  • 42. Don’t build or convert 150 courses all at once. Conduct a pilot. Start with one course and create it for every device you intend to support. ! Take into account any problems during one step at a time development, as well as deployment. ! Learn from your testers and apply those lessons to the other courses before you start developing.
  • 46. If your app requires substantial interaction, consider a native app over a web app. Complex tasks can be difficult on a mobile browser. ! Consider tap symmetry -- give your users enough space to touch the correct area. ! Re-think radio buttons because they are often too close together, and it's easy to touch the wrong one. ! Consider having a back button. It reduces navigation error. ! Make sure your touchable areas LOOK touchable.
  • 47. Re-consider text input interactions. Users don't like to type on the touchscreen more than they have to. ! People share tablets -- they don't share smartphones.
  • 48. how clean are you? ! one action per screen only necessary elements adequate spacing
  • 51. A B
  • 52. A B
  • 53. A B
  • 54. A B
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60. mobile behaviors and mindsets mobile design mobile case studies
  • 61. Articulate iPad App Flash Mobile conversion project Articulate Storyline Desktop
  • 62. Conversion from Articulate Presenter Purpose Extend delivery option of existing Flash-based desktop course to tablets Output Web and native app to support Android, Windows and iOS devices Tools Used Articulate Presenter and Storyline Key Team Members Me Timeline 2 weeks to convert 7 modules (2 hrs. of seat time) from Articulate Presenter to Storyline and output to both web and native versions
  • 63. Conversion from Articulate Presenter Bottom Line: • Storyline easily converts existing Presenter files • Watch those Engage interactions • If you have substantial interaction, consider the iPad app over a web app (native). Complex tasks can be difficult using a tablet browser • Know that when a user can’t activate navigation, they consider the app to be broken
  • 64.
  • 65. Mobile App for New Hires Need to get FULL screenshot of app s Web Page using SnagIt?
  • 66. Mobile App for New Hires: Mobile Only Game
  • 67. Mobile App for New Hires Purpose Give new hires access to most requested information without the complication of a firewall and from whatever device they choose to use. App includes Oracle news, welcome videos from executives, a To Do list, the History of Oracle, and a game. Output Web-based mobile app that also works on a PC. By thinking mobile first, we were able to create a responsive web app that supports both mobile and desktop. Tools Used App was created in Dreamweaver with extensive use of CSS to create the responsive design. Key Team Members Web designer/programmer, graphic designer, instructional designers, HR SME. Timeline Ongoing. While move new hire information to mobile is important, we have an iterative process with exhaustive reviews. We’re constantly refining and learning. Our goal is to get this one right and then apply our lessons learned to future apps.
  • 68. Mobile App for New Hires Bottom Line: • We’re still in beta. • Too many cooks in the kitchen. • Lessons learned on an internal wiki. • IT/Security concerns
  • 69.
  • 70. Mobile App for Performance Support
  • 71. Mobile App for Performance Support Purpose Provide a support aid to reinforce information about a specific topic. Output Web-based mobile app optimized for iPhone. Tools  Used App was created in Adobe Muse using existing templates provided by Muse. Key  Team   Members I developer and 1 ID Timeline 3 days http://tincanapi.businesscatalyst.com/overview-of-tin-can.html
  • 72. Mobile App for Performance Support Bottom Line: • Muse is a WYSIWYG editor for creating web apps • Comes loaded with templates and widgets • Real easy to build rapid prototypes: you can import PSD and Fireworks files
  • 73. Focus on goals ! Launch and Iterate ! Take small steps
  • 74.
  • 76. some research for this
 presentation came from: ! Yahoo! Mobile Mindsets:
 http://www.ipsos-mori.com/Assets/Docs/Publications/ IpsosMediaCT_Yahoo_Mobile_Modes_Sept2011.pdf ! Google:The New Multi-Screen World Study
 http://www.google.com/think/research-studies/the-new-multi-screenworld-study.html !
  • 77. Brandon Carson Twitter: @brandonwcarson LinkedIn: brandoncarson E-mail: bcarson@entirenet.net ! ! ! Michelle Lentz Twitter: @michellelentz LinkedIn: michelleslentz E-mail: michelle.lentz@oracle.com 77

Editor's Notes

  1. Michelle and Brandon You can download today’s session on Slideshare at this URL.
  2. Michelle and Brandon Introductions
  3. Brandon We are gonna try and cover a lot of material this morning. We’re going to focus on what three key areas to consider when supporting mobile workforces: mobile behaviors and mindsets mobile ID and a few mobile-related projects we’ve been working on.
  4. Michelle When you see the Happy Monkey appear, that’s your prompt to ask a question and get a reward!
  5. Brandon We want to make sure we’re all in “sync” for today’s presentation. We’ll assume you agree with us on the following: We’re in a post-mobile world now. We’re using the term “mobile” today because we need a way to categorize our session. Realistically, there is no such thing as “mobile learning” anymore.
  6. Brandon Your workforce, your consumers are already ‘mobile’ – many are always connected, and not always present.
  7. Brandon You may or may not be providing learning experiences optimized for their mobility – but you probably recognize that you need to be if you’re not already. We think you should begin thinking “mobile first” in all your design and development even if you’re not delivering on mobile yet. If you disagree with any of these, raise your hand and let us know your thoughts. We’re genuinely interested.
  8. Michelle Have you recently asked yourself: How do my designs change when dealing with different screen sizes and resolutions?
  9. Michelle How do I take advantage of mobile device capabilities?
  10. Michelle How will I support and maintain content development for multiple devices? These are fundamentals that will help you as you move toward mobile-optimized designs.
  11. Brandon To help answer those questions, are you: prepared to look closely at your content development workflow, your process, and even your organizational structure?
  12. Brandon Are you willing to look at different internal tools, different ways to communicate?
  13. Brandon Are you willing to look at your staff capabilities, roles and job descriptions? + … because …
  14. Brandon Designing and delivering mobile learning experiences means you may need to change some of how you do what you do, and who you have doing it.
  15. Michelle One of the first areas to concentrate on is your audience, and their mobile behaviors. We’ll take a look at the common behaviors that are important for us in L&D to understand. Then, we’ll discuss some principles for mobile instructional design. And finally, we’ll step through a few short case studies of training-related apps we’ve been involved with recently.
  16. Brandon Some of what people do with their devices is not what we think they do with them… Yes, people read on their mobile devices. Sometimes in short bursts, sometimes they move around quickly, and sometimes they even read long articles.
  17. Brandon Just because you may know the device the majority of your audience has in hand, doesn’t mean you know their intent. People traverse multiple devices doing similar things on various devices. A person doesn’t normally stop and think, “oh, I want to update my Facebook status, so I’ll use my tablet.”
  18. And let’s stop trying to create specific mobile personas or to. Everyone is mobile, all the time.
  19. Brandon Smartphones are the backbone of our daily media use. They are the devices used most throughout the day and serve as the most common starting point for activities across multiple screens.
  20. Michelle The device we choose to use at a particular time is often driven by our context.
  21. Michelle The four key context drivers are: The amount of time we have or need The goal we want to accomplish Our location Our attitude and state of mind
  22. Michelle Users look at their devices differently: “I consider my phone to be my personal device, my go-to device. It’s always close to me if I need quick, precise feedback.”
  23. Michelle “When I want more in-depth information, I use my tablet. I’m less distracted because I can’t get a phone call, and I can ignore email on it.”
  24. Michelle “My laptop is purely for business. That’s work, where I feel like I need to be doing something productive.”
  25. Brandon We recommend that when you embark on designing and developing a mobile app, you take a methodical approach and place yourself in the real-world contexts your users are in. Don’t make assumptions, go out there and observe them in their situations, and make sure you observe over time as they move through their workday.
  26. Michelle Yahoo segmented all mobile behavior into seven mindsets: Connect: Covers all the ways a person communicates with their mobile device Search: Refers to information seeking, primarily using a search engine Entertain: Listening, playing or viewing media designed for entertainment Manage: Coordinating day-to-day activities like online banking and schedules Inform: Viewing news, information portals or educational material Shop: buying stuff. The one mindset retailers love the most! Navigate: Getting places via a GPS or Maps app
  27. Brandon and Michelle Considering these mindsets: Brandon When do you think people are the most frustrated on their mobile devices?When searching or navigating. Because they’re on the go and trying to find something or get somewhere Michelle When do you think people are most relaxed on their mobile devices?When shopping and consuming entertainment Brandon What mindset do you think they’re in most when learning?More than likely it’s Inform, but could also be Search, Connect, and maybe Navigate. Michelle How do you see these mobile mindsets affecting how you design for mobile?
  28. Brandon In short… People pogo-stick. They jump around, usually in short bursts, but they’ll stick with the content if it’s meaningful and relevant. The four key context drivers are: time, goal, location and attitude. Can someone tell me what types of audiences they support? What is their context? What type of device applies to them? Smartphones are the backbone of our daily media interactions. They have the highest number of user interactions per day and serve as the most common starting point for activities across multiple screens.
  29. Brandon OK, so you’ve decided to create an app. Often the first question asked is ‘native or web app?’ Individuals have different expectations when it comes to apps versus mobile browsers.
  30. Brandon The majority of mobile users conceptualize the typical app experience as ‘discover – install – tap – run.’ With web apps it’s not as clear-cut: the consumer visits the mobile site as if it's a regular website -- via a browser. People will play a game, music or video or update their social networking page on their desktop via the web without considering whether or not the experience is conducted via an app. On a mobile device, the same consumers prefer native apps, believe they perform better, and prefer how they are ‘packaged.’ So, what are the differences?
  31. Michelle Native apps must be installed on the device. They are either pre-installed or they can be downloaded from app stores. Native apps are written specifically for the operating system so they can take advantage of the device’s functions, such as the camera or GPS.
  32. Michelle Web apps reside on a server and are accessed via the Internet. Web apps can be coded once to work across multiple operating systems, rather than being developed separately. This means that the same application can be used by most devices that can surf the web.
  33. Michelle Here’s a simple table that can help you determine what type of app you should build.
  34. Brandon Hybrid apps are written in native languages, downloaded to mobile devices, and able to access the device’s APIs, but the content is pulled from the web. Personalized news apps are good examples of hybrid apps. This also allows a higher level of personalization for your users and possibly a more consistent user experience.
  35. Michelle Next, we’ll discuss some principles for mobile instructional design.
  36. Michelle Always ask ‘why’ you want to create training for a specific device. Why do you want the content to be available on mobile devices? How are you choosing the specific device to support? Should the course provide a different experience on a phone vs. a tablet? Is there a business need to support deployment on mobile devices?
  37. Brandon Fully comprehend the inherent constraints of the mobile ecosystem: + Small screens + Unreliable networks and connectivity + People in a myriad of situations when using mobile
  38. Michelle Whether you’re designing for mobile first or you have no choice but to try to convert, take it one step at a time. Don’t build or convert 150 courses all at once. Conduct a pilot. Start with one course and create it for every device you intend to support. Take into account any problems during development, as well as deployment. Learn in-depth from your testers and your developers and apply those lessons to the other 149 courses before you ever start developing.
  39. Brandon Think again about how you use your own mobile device, particularly your phone. As eLearning developers, we’re used to designing longer courses, 15 minutes or more. A longer course - especially if you’re designing for the smallest screen - isn’t effective. Would you want to learn by staring at your phone for 15 or more minutes? Chunkify your content into small learning objects that learners can access quickly and efficiently. Remember pogosticking!
  40. Michelle Understand how users can rotate their devices. Do you need to support both portrait and landscape mode?
  41. Michelle Make touchable elements look touchable. It’s of the utmost consideration to consider usability. If your app requires substantial interaction, consider a native app over a web app. Complex tasks can be difficult on a mobile device. Consider "tap symmetry" -- give your users enough space to touch the correct area. Re-think radio buttons because they are often too close together, and it's easy to touch the wrong one. Consider having a back button. It reduces navigation error. Make sure your touchable areas LOOK touchable.
  42. Brandon Re-consider text input interactions. Users don't like to type on the touchscreen more than they have to. People share tablets -- they don't share smartphones. When designing for tablets, think of it as a multi-user device. With this consideration, make sure it's easy and intuitive to log out and log in to your app, and make sure you design an app icon that is easily recognized.
  43. Brandon When considering graphics determine what your learner should be focused on: task or content. Notice that the ToDo List app has no original content. The focus is squarely on completing a task and, thus, the graphics are all user interface elements. The fitness app focuses purely on the content and even hides the status bar at the top in order to keep the user engaged in the content – without status updates as distractions.
  44. Michelle Try to keep one action per screen. Only have the necessary elements on screen to fulfil the action and provide navigation choices Be sure to adequately space the elements
  45. Michelle Which is the cleaner UI? Why?
  46. Michelle Texting, cameras and GPS are now standard on smartphones. Leverage existing technology and create activities around features already built into the phone.
  47. Michelle And finally, let’s step through some short case studies of training-related apps we’ve been involved with recently.
  48. Brandon Recently, I worked on what might be called a Flash > Mobile conversion project. We had a course originally created in Articulate Presenter. + I wanted to develop a mobile version optimized for tablets. I didn’t want to redesign the course, so I thought I’d attempt a conversion with Storyline. Storyline has a ‘publish to mobile’ feature. It has a publish to HTML5 and Articulate has developed their own iPad app. This flexibility allows you to offer access across almost all mobile devices that support HTML5 and of course the iPad via Articulate’s app. So let me quickly explain what my conversion process was like. The Articulate course I had was a pretty basic one It consisted of graphics, videos, audio narration on each screen, several Engage interactions, and quizzes built in Articulate QuizMaker. Using Storyline, I opened the Articulate Presenter file and Storyline easily converted it. The Engage interactions converted as well, but they are designed as Flash-only output, so they will not publish to mobile. I had to re-build all the Engage interactions. That was a decent amount of work because I had several of them in the course. The QuizMaker files posed no problem. After the Engage interactions were re-built, I tested the course by publishing it to mobile. At first it looked pretty good. However, in mobile Safari on iPad, audio has to be initiated by the user. So the audio on each screen would not auto play. That caused a design work-around. Do I place an audio controller on each screen and expect the user to tap it? I can solve this issue without too much re-design by leveraging Articulate’s iPad app. But my initial design had a Menu LINK at the top of the UI. At the time of my use, the iPad app didn’t support that, and forced me to use the left navigation default. So to use the app to solve the audio problem, I had to change my UI design. And so it goes. Between HTML5, the iPad app, and the Flash version, I was not able to have ONE original source file. I had to optimize for each device. I was able to deploy a course that ran on PCs and the two mobile OS’s that I supported in record time. Is it a scalable strategy? No. Is it good for legacy content, or courses already existing in Flash format? Sure.
  49. Brandon Here are some highlights from this project. We wanted to extend delivery options for the course since many in our audience were asking for a mobile option. We had a slim budget, and wanted a quick development cycle. Although the majority of our audiences used iPad, we wanted to ensure people with other tablet operating systems could also access the course. We were building a tablet version as an additional option – not to replace the desktop Flash version. We used Articulate Presenter and Storyline as development tools. This was done by me for a startup. So, again, the budget was tight. It only took us two weeks to convert 7 modules into Storyline and then optimize for tablets.
  50. Brandon Storyline easily converts existing Presenter files Watch those Engage interactions If you have substantial interaction, consider the iPad app over a web app (native). Complex tasks can be difficult using a tablet browser Know that when a user can’t activate navigation, they consider the app to be broken
  51. Michelle Goal: To provide new hires with instant information to pertinent tasks and questions without requiring access to the VPN. Format: We were discussing redesigning our New Hire portal on our intranet and in the process, added the mobile app for increased access. We started over, designing for mobile first and using responsive web design (specifically CSS within Dreamweaver) to parse the same, and at times different, content depending on the device used. Visibility: The project has high visibility. We keep iterating, until we really feel we have it right. Once we get it down, we’ll use this model to move most of Global HR portal to mobile first design.
  52. Michelle One of the biggest sticking points I’ve had is this game, and it’s a source of disagreement on our team. Several people like it, as it’s a game (acquired from the eLearning Brothers and GUI modified). The game itself is a fun exercise, and requires you to earn points by answering Oracle trivia (learned in the app) and using those points to shoot baskets. My issue with the game is that it forces you into landscape mode. What are your thoughts on forcing an orientation change on the user? Good, bad, neutral?
  53. Michelle It’s a high visibility project, so we have too many people chiming in. Initially, we had 2 IDs for user experience, a graphic designer, and a web developer. We started the mobile app on paper in September and by December, we had our current working prototype. However, this is still a work in progress and we’ll continue to iterate until we’re completely happy.
  54. Michelle Bottom Line: We’re still in beta / testing. But our output is now successfully parsing to both mobile and web. Iterating constantly. Our biggest issues have been too many cooks in the kitchen (so to speak) and disagreement over the forced landscape mode of the game. We have learned a lot and as we continue to iterate, we are keeping a list of lessons learned on an internal wiki so that we can apply them to our future mobile apps. Any questions?
  55. Brandon We created a simple web-app optimized for iPhone as a prototype. We used Adobe’s Muse software, which is available via their Creative Cloud software subscription service. With Muse, you can leverage built-in templates and widgets to quickly build prototypes and even full apps. This app uses conventional navigation elements for mobile apps, including large areas for touch.
  56. Brandon The idea behind this app is to provide a support aid to reinforce information about a specific topic It’s a web-based app optimized for iPhone App was created in Adobe Muse using existing templates provided by Muse. Simple interface elements are all drawn in Muse so that scaling will produce the best results. This was done by a developer on our team in 3 days
  57. Brandon Muse is a WYSIWYG editor for creating web apps Comes loaded with templates and widgets Real easy to build rapid prototypes: you can import PSD and Fireworks files It’s important to build wireframes and prototypes before you apply a lot of user interface design. You want to iterate and test until you’re confident your design will support the information architecture you need for your content.
  58. Brandon Focus on goals. As IDs we are used to task analysis as a part of the science of what we do. But goal-directed design is a way to provide for ambiguities in execution and implementation. Launch and Iterate. Iterate a lot. Iterative design surfaces both ambiguities and the design solutions that can accommodate them. Get the app in front of users early so they can show you how to refine it. Expect that the design will not be perfect at launch, provide for continuous improvement.
  59. Brandon Here are some good references if you’re interested in learning more about mobile development
  60. Brandon Some of our data came from these two research reports.
  61. Michelle and Brandon