SlideShare a Scribd company logo
Mobile Context and
   Strategies
         Ivano Malavolta
    ivano.malavolta@univaq.it
http://www.di.univaq.it/malavolta
Roadmap

• Designing for Context
• Developing a Mobile Strategy
• Types of Mobile Applications
from the previous lecture…
Designing for the Context
Two kinds of context

      Context
     with a big “C”

           VS


      context
    with a little “c”
Context VS context by example




• The app works in a specific context depending on
  the current location of the user
• The app gives Context by providing additional info
Context VS context by example

 Context       who is here?

   VS
 context       where I am

Context answers users’
      questions
         VS
                              https://foursquare.com
  context is a fact
Context with a big “C”

   How users will derive value from something
             they are currently doing

 For example:
 • info on restaurants
 • rate places
 • GPS navigator

http://www.oink.com
Context with a big “C”

The information provided by the app gives Context



A better understanding of what this moment in
  time means to the user

Recurrent targets:
  people, places, things, situations, ideas
context with a little “c”

 The mode, medium and environment in which
            we perform our tasks

There are 3 different types of context:
1. Physical context
2. Media context
3. Modal context
context with a little “c”

                       Physical context
                          where I am




http://bit.ly/wXGpNA
http://bit.ly/yoBk7d
context with a little “c”

                       Physical context
                   In which environment I am

   •   at home
   •   on a bus                         car
   •   in the streets                   VS
   •   in my office                    train
   •   in a shop
http://www.textndrive.com
http://www.whatsapp.com
context with a little “c”

                         Media context
                      The device I am using

  •   Connectivity
  •   Screen size
  •   Camera
  •   etc …

http://www.facebook.com
context with a little “c”

                       Modal context
                   My present state of mind

  what I am doing right now
  How I feel right now



http://www.runens.com
http://photostatsapp.com/
http://babypad.mezmedia.com
…again on “big C” VS “little c”

       I only care              I only care
         about…                   about…
              Context                  context



user                    Developer
                          (you)
…again on “big C” VS “little c”

Your users do not care about physicality, media,
  or modes…

They simply care about the app perceived value:

                  Context
…again on “big C” VS “little c”

Good Design means making the context
  transparent to the user

We have to create apps that anticipate and
 solve problems with little or no action from
 the user
The Mobile golden rule

              If you can unlock the state of
              mind of your users and start
                                context,
              thinking in their context
understanding how a mobile experience will
add value to their lives you will have the
                   lives,
ever-elusive…

              KILLER
               APP
How can I apply the golden rule?
Think of your app in the different contexts

• Who is your user? Business man, teenager, mum…

• What is happening? Are they hanging out with friends?

• When will he interact? @home? @work? waiting for the bus?
               interact?

• Where is he? Public/private space, inside/outside, day/night

• Why will he use your app? How do you give Context?

• How is he using his mobile device? Is the device held in the
  hand? Portrait or landscape?
Examples




http://www.soundhound.com
Examples 2




http://www.endomondo.com
Examples 3




http://www.instagr.am
Roadmap

• Designing for Context
• Developing a Mobile Strategy
• Types of Mobile Applications
Developing a Mobile Strategy

Mobile Strategy =

how much it will cost you to develope your app?

  How much time
           time?
              How much effort
                       effort?
                        How much money
                                 money?
Busting the first myth

   Mobile design and
   development is not cheap!
                      cheap!




http://www.slideshare.net/fling/native-v-hybrid-v-web
Busting the first myth




http://www.slideshare.net/fling/native-v-hybrid-v-web
Busting the first myth

   You have to sum this price for each platform
     you want to support
                                                        Even with
                                                        Phonegap!




http://www.slideshare.net/fling/native-v-hybrid-v-web
The new rules for a mobile strategy
Remember, mobile is a new medium
  different rules

Don’t try to follow “traditional rules” since mobile has
  its own peculiarities:

•   context,
•   location, user mood
•   device fragmentation
•   unique UI rules
•   ...
Rule #1
            Forget what you think you know
Mobile is an ever-evolving area
     today you are already outdated

• Forget what you think you know about mobile
   – It is most likely incorrect
• Don’t try to emulate other projects
   – Focus on what is right for your user, not what is right for
     someone else’s user
• Start at the beginning
   – Provide new perspectives, and breathe life into the project
     right from the start
Rule #2
     Believe what you see, not what you read
• Don’t trust any report, fact, or figure that 1-2 years old
   – It is most likely wrong
• Go to your users and ask them questions in person
   – Don’t try to simply validate your ideas
• Record everything
   – Your own users’ worlds will help you in focussing on their need
• Don’t forget to innovate
   – Try new things, be bold, and don’t be afraid to fail.
• Have a contingency plan
   – If your plan fails to meet expectations, try to reuse what
     you’ve learned or done on something else
Rule #3
             Constraints never come first

• Avoid talking about constraints at an early-stage
  brainstorming session
   – Refer back to Rule #1 and forget what you think you know
• there will always be constraints in mobile, accept it!
• Focus on strategy first, what they user needs, and lay
  down the features
   – Then, if the constraints become an issue, fall back to the
     user goals
• There is always an alternative
Rule #4
Focus on context, goals and needs


           needs
                                user
           goals

              actions


          context
Rule #4
          Focus on context, goals and needs

1. Defining the users’ context is the first thing to do
   – without it, you don’t have a mobile strategy, you have only a
     plan of action
2. Uncover the users’ goals
   – and then try and understand how the users’ context alters
     their goals
3. With goals understood, figure out the tasks the users
   want to perform
4. Look for ways to filter content by context
   – for example: location, media, and model.
Rule #5
              You can’t support everything

• Don’t try to support everything
   – Start with the devices that best represent your core customer
• The most popular might not always be the best device for
  your project
• Check your server logs for the devices accessing your
  site
   – These are the first devices to target
• Go to a mobile phones store and do a little market
  research to find out the recommended devices for your
  target customer
Rule #6
                   Don’t convert, create

Great mobile products are created, never ported!

• Understand your user and his context
   – Having an idea of how and when users will access your content
     will aid in understanding how to best create a tailored mobile
     experience
• Mobile is a unique medium
Rule #6 - example
Rule #7
                        Keep it simple

People want to use mobile devices in a simple way

• Simplicity fewer problems
• Easier to iterate and evolve your app

• Don’t try to create a desktop software on a mobile!
   • Adding feature after feature is an easy trap to fall in
• Build the experience around your users’ main need and
  nothing else
Roadmap

• Designing for Context
• Developing a Mobile Strategy
• Types of Mobile Applications
  – Mobile Application Medium Type
  – Mobile Application Context
Types of Mobile Applications

In the following we will talk about:

• Mobile Application Medium Types
  – the technology presenting the content to the
    user
     • ex. SMS, native app, web app …
• Mobile Application Context
  – the type of experience provided to the user
     • ex. utility, informative, productivity …
Mobile app medium types

The technology presenting the content to the user

                      SMS
               Mobile Websites
             Mobile Web Widgets
               Mobile Web Apps
                  Native Apps
                     Games
Mobile app medium types: SMS

  The user sends an SMS to a 5-digit code and then he
    can get:
  • textual information
  • a link to premium content
  • a service



  Most common use: ringtones and wallpapers


http://smstweet.com/
Mobile app medium types: SMS
PROS
• they work on any mobile device nearly instantaneously
• useful for sending timely alerts to the user
• they can be incorporated into any web or mobile app
• simple to set up and manage

CONS
• limited to 160 characters
• limited text-based experience
• can be very expensive
Mobile app medium types: Mobile
                  Websites
A website designed for Mobile devices

It is NOT about viewing on a mobile
  device a website designed for
  desktop browsers

Features:
   –   Simple architecture
   –   Simple navigation links
   –   Simple design
   –   Informational in nature
        (typically, less interactive)
Mobile app medium types: Mobile
               Websites
PROS
• easy to create, maintain, and publish
• you can use the same tools and techniques for desktop
  sites
• nearly all mobile devices can view mobile websites

CONS
• devices fragmentation
• limited experience
• they can load pages slowly
   – network latency
Mobile app medium types: Web Widget

  Small web apps that cannot run by themselves, they
    must run on top of “something else”

  Known also as:
    portlet, web part, gadget, badge,
    module, webjit, capsule, snippet,
    mini, flake


  For example, Android has supported
  widgets natively since April 30, 2009

http://bit.ly/yNvwEd
Mobile app medium types: Web Widget

PROS
• easy to create using basic HTML, CSS, JavaScript
• simple to deploy across multiple handsets
• They can directly access device features and offline use

CONS
• typically require a compatible widget platform to be
  installed on the device
• require learning additional proprietary, non-standard
  techniques
Mobile app medium types: Web App

Mobile apps that run on the mobile
  web browser developed using
  standard technologies
        ex. HTML, CSS, Javascript


Differently from mobile websites,
  they offer an “app-like” experience

   ex. buttons, actions, real-time
       data, no pages metaphor
http://touch.facebook.com
Mobile app medium types: Web App
PROS
• easy to create using basic HTML, CSS and JavaScript
• simple to deploy across multiple handsets
• better user experience and rich design
• content is accessible on any mobile web browser

CONS
• difficult to support across multiple devices.
• they don’t always support native application features
   – offline mode, location, filesystem access, camera …
Mobile app medium types: Native Apps

 Developed for a specific platform

 Certified, sold and distributed via an
   operator portal or an app store

 It sits on top of the device platform
    you can access all the device’s
   features
    need for certification
http://www.glancee.com/
Mobile app medium types: Native Apps

PROS
• best-in-class user experience, rich design and tapping
  into device features and offline use
• relatively simple to develop for a single platform
• access to app stores (you can charge for your apps)

CONS
• developing for multiple device platforms is costly
• require certification and distribution from an app store
• you have to share revenue with platform vendors
Mobile app medium types: Games

Technically they are like native apps, however:
• they cannot be esasily developed with web technologies
   – performance with vector graphics
• porting them to multiple platforms is a bit easier
   – the graphic engine does not use device APIs




www.angrybirds.com
Mobile app medium types: Games

PROS
• simple and easy way to create an immersive experience
• can be ported to multiple devices relatively easily

CONS
• can be costly to develop as an original game title
• cannot easily be ported to the mobile web



www.angrybirds.com
Mobile app medium types: summary
Roadmap

• Designing for Context
• Developing a Mobile Strategy
• Types of Mobile Applications
  – Mobile Application Medium Type
  – Mobile Application Context
Mobile App Context

The type of experience provided to the user

                     Utility
                     Locale
                  Informative
                  Productivity
                   Immersive
Mobile App Context

Applications can be presented in different ways
  es. taks-based utility, immersive experience, etc…


• Typically, it is best to choose one app context and
  present it to the user

     don’t mix app contexts!
                   contexts!

  • TIP: if you really need to switch context within your app,
    let the user choose when to switch
Mobile App Context: Utility

         task-
• short, task-based scenarios
• minimal information from the user
• minimal design

ex.
      calculator
      alarm clock
      weather forecast
Mobile App Context: Locale

  • it provides info about “what’s around”
  • recurrent feature: a map on which data is displayed
  • goal of the user: to find additional
    info about his present location

  ex.
        find friends around
        find pubs around
        get route directions

https://foursquare.com
Mobile App Context: Informative

  • Goal: to provide information to the user
  • Task of the user: to read and understand
    – not necessarily to interact
  • remember that user tasks are
    short and can be interrupted
  ex.
        news
        online directory
        mobile commerce
https://www.pinterest.com
Mobile App Context: Productivity

  • Meant to increase user’s sense of efficiency
  • Users have a clear goal in mind
  • Very structured (with folders)
      – it gives a sense of order
  • Follow a clear workflow

  ex. mail, scanning, todo lists…

  TIP:
  TIP focus on the main task only, and
    only after start adding other features
http://www.thegrizzlylabs.com/genius-scan/
Mobile App Context: Immersive

  • immersive, full-screen app
               full-
  • meant to consume the user’s focus
                         user’s

  ex.
        games
        media players
        entertainment



  TIP:
  TIP you can use it as alternative to other app contexts
http://www.rockstargames.com/grandtheftauto3
Mobile App Context: Summary
References




 Chapters 4-5-6

More Related Content

PPTX
Mobile Application Testing
PDF
Mobile Application Design & Development
PPTX
Mobile UI Design – User Centered Design and UI Best Practices
 
PDF
UI design for mobile apps
PPTX
Top 11 Mobile App Development Frameworks
PDF
Android activities & views
PDF
Flutter
PDF
UX Design for Mobile Apps
Mobile Application Testing
Mobile Application Design & Development
Mobile UI Design – User Centered Design and UI Best Practices
 
UI design for mobile apps
Top 11 Mobile App Development Frameworks
Android activities & views
Flutter
UX Design for Mobile Apps

What's hot (20)

PPTX
Requirements gathering and validation for mobile applications
PPTX
Android application development ppt
PPTX
Publishing and delivery of mobile application ios
PPTX
Publishing and delivery of mobile application
PPTX
Designing applications with web access capabilities
PDF
Importance of Mobile Applications
PPT
Mobile application development
PPTX
User interface (UI) for mobile applications
ODP
Introduction to Progressive Web Apps (PWA)
PPTX
UI UX Introductory session
PDF
The 10 Golden Usability Heuristics (Montreal Girl Geeks September 2014)
PPTX
Progressive Web Apps(PWA)
PPTX
Ui ux designing principles
PPTX
Push Notification
KEY
Android Development: The Basics
PDF
Consistency in UX Design
PPTX
Introduction to Android and Android Studio
PDF
Email authentication using firebase auth + flutter
PPTX
Progressive web app
PDF
Introduction to flutter
Requirements gathering and validation for mobile applications
Android application development ppt
Publishing and delivery of mobile application ios
Publishing and delivery of mobile application
Designing applications with web access capabilities
Importance of Mobile Applications
Mobile application development
User interface (UI) for mobile applications
Introduction to Progressive Web Apps (PWA)
UI UX Introductory session
The 10 Golden Usability Heuristics (Montreal Girl Geeks September 2014)
Progressive Web Apps(PWA)
Ui ux designing principles
Push Notification
Android Development: The Basics
Consistency in UX Design
Introduction to Android and Android Studio
Email authentication using firebase auth + flutter
Progressive web app
Introduction to flutter
Ad

Similar to Designing for Context (20)

PDF
The mobile ecosystem & technological strategies
PDF
The mobile ecosystem
PDF
Designing and deploying mobile user studies in the wild: a practical guide
PDF
Pragmatic Principles for Mobile Design
KEY
Boris Chan - FITC SCREENS - Becoming Social By Default on Mobile
PDF
Putting Mobile First - July 2013
PDF
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
PPTX
Harnessing the content beast – Content marketing in the multiscreen world
PDF
Mobile Mania: What You Need to Know to Kick-Start Your Strategy (UK)
PPT
How To Design Mobile Content For Multiple Devices
PPTX
Building a better User Experience for Windows Phone Users
PDF
Six tips for cross-cultural UX
PDF
USC Future of Journalism | Emerging technology
PDF
Be Smart Be Mobile
PDF
The mobile ecosystem & technological strategies
PPT
SMS advertising for education
PPT
Mobile Marketing Education PowerPoint
PPT
Top 5 App Marketing Pitfalls
PPTX
6 mobile user interface design bb
PPTX
Mobile first-edinburgh 030913
The mobile ecosystem & technological strategies
The mobile ecosystem
Designing and deploying mobile user studies in the wild: a practical guide
Pragmatic Principles for Mobile Design
Boris Chan - FITC SCREENS - Becoming Social By Default on Mobile
Putting Mobile First - July 2013
Karen N. Johnson - Mobile Testing keynote delivered at Test Istanbul 2013
Harnessing the content beast – Content marketing in the multiscreen world
Mobile Mania: What You Need to Know to Kick-Start Your Strategy (UK)
How To Design Mobile Content For Multiple Devices
Building a better User Experience for Windows Phone Users
Six tips for cross-cultural UX
USC Future of Journalism | Emerging technology
Be Smart Be Mobile
The mobile ecosystem & technological strategies
SMS advertising for education
Mobile Marketing Education PowerPoint
Top 5 App Marketing Pitfalls
6 mobile user interface design bb
Mobile first-edinburgh 030913
Ad

More from Ivano Malavolta (20)

PDF
On-Device or Remote? On the Energy Efficiency of Fetching LLM-Generated Conte...
PDF
Conducting Experiments on the Software Architecture of Robotic Systems (QRARS...
PDF
The H2020 experience
PDF
The Green Lab - Research cocktail @Vrije Universiteit Amsterdam (October 2020)
PDF
Software sustainability and Green IT
PDF
Navigation-aware and Personalized Prefetching of Network Requests in Android ...
PDF
How Maintainability Issues of Android Apps Evolve [ICSME 2018]
PDF
Collaborative Model-Driven Software Engineering: a Classification Framework a...
PDF
Experimenting on Mobile Apps Quality - a tale about Energy, Performance, and ...
PDF
Modeling objects interaction via UML sequence diagrams [Software Design] [Com...
PDF
Modeling behaviour via UML state machines [Software Design] [Computer Science...
PDF
Object-oriented design patterns in UML [Software Design] [Computer Science] [...
PDF
Structure modeling with UML [Software Design] [Computer Science] [Vrije Unive...
PDF
Requirements engineering with UML [Software Design] [Computer Science] [Vrije...
PDF
Modeling and abstraction, software development process [Software Design] [Com...
PDF
[2017/2018] Agile development
PDF
Reconstructing microservice-based architectures
PDF
[2017/2018] AADL - Architecture Analysis and Design Language
PDF
[2017/2018] Architectural languages
PDF
[2017/2018] Introduction to Software Architecture
On-Device or Remote? On the Energy Efficiency of Fetching LLM-Generated Conte...
Conducting Experiments on the Software Architecture of Robotic Systems (QRARS...
The H2020 experience
The Green Lab - Research cocktail @Vrije Universiteit Amsterdam (October 2020)
Software sustainability and Green IT
Navigation-aware and Personalized Prefetching of Network Requests in Android ...
How Maintainability Issues of Android Apps Evolve [ICSME 2018]
Collaborative Model-Driven Software Engineering: a Classification Framework a...
Experimenting on Mobile Apps Quality - a tale about Energy, Performance, and ...
Modeling objects interaction via UML sequence diagrams [Software Design] [Com...
Modeling behaviour via UML state machines [Software Design] [Computer Science...
Object-oriented design patterns in UML [Software Design] [Computer Science] [...
Structure modeling with UML [Software Design] [Computer Science] [Vrije Unive...
Requirements engineering with UML [Software Design] [Computer Science] [Vrije...
Modeling and abstraction, software development process [Software Design] [Com...
[2017/2018] Agile development
Reconstructing microservice-based architectures
[2017/2018] AADL - Architecture Analysis and Design Language
[2017/2018] Architectural languages
[2017/2018] Introduction to Software Architecture

Recently uploaded (20)

PPTX
Pharma ospi slides which help in ospi learning
PPTX
Open Quiz Monsoon Mind Game Prelims.pptx
PDF
The Lost Whites of Pakistan by Jahanzaib Mughal.pdf
PDF
FourierSeries-QuestionsWithAnswers(Part-A).pdf
PPTX
Introduction_to_Human_Anatomy_and_Physiology_for_B.Pharm.pptx
PDF
Abdominal Access Techniques with Prof. Dr. R K Mishra
PDF
O7-L3 Supply Chain Operations - ICLT Program
PDF
Saundersa Comprehensive Review for the NCLEX-RN Examination.pdf
PPTX
Introduction to Child Health Nursing – Unit I | Child Health Nursing I | B.Sc...
PDF
3rd Neelam Sanjeevareddy Memorial Lecture.pdf
PPTX
Open Quiz Monsoon Mind Game Final Set.pptx
PPTX
school management -TNTEU- B.Ed., Semester II Unit 1.pptx
PPTX
PPH.pptx obstetrics and gynecology in nursing
PPTX
BOWEL ELIMINATION FACTORS AFFECTING AND TYPES
PDF
grade 11-chemistry_fetena_net_5883.pdf teacher guide for all student
PPTX
PPT- ENG7_QUARTER1_LESSON1_WEEK1. IMAGERY -DESCRIPTIONS pptx.pptx
PDF
Pre independence Education in Inndia.pdf
PDF
Anesthesia in Laparoscopic Surgery in India
PPTX
The Healthy Child – Unit II | Child Health Nursing I | B.Sc Nursing 5th Semester
PDF
STATICS OF THE RIGID BODIES Hibbelers.pdf
Pharma ospi slides which help in ospi learning
Open Quiz Monsoon Mind Game Prelims.pptx
The Lost Whites of Pakistan by Jahanzaib Mughal.pdf
FourierSeries-QuestionsWithAnswers(Part-A).pdf
Introduction_to_Human_Anatomy_and_Physiology_for_B.Pharm.pptx
Abdominal Access Techniques with Prof. Dr. R K Mishra
O7-L3 Supply Chain Operations - ICLT Program
Saundersa Comprehensive Review for the NCLEX-RN Examination.pdf
Introduction to Child Health Nursing – Unit I | Child Health Nursing I | B.Sc...
3rd Neelam Sanjeevareddy Memorial Lecture.pdf
Open Quiz Monsoon Mind Game Final Set.pptx
school management -TNTEU- B.Ed., Semester II Unit 1.pptx
PPH.pptx obstetrics and gynecology in nursing
BOWEL ELIMINATION FACTORS AFFECTING AND TYPES
grade 11-chemistry_fetena_net_5883.pdf teacher guide for all student
PPT- ENG7_QUARTER1_LESSON1_WEEK1. IMAGERY -DESCRIPTIONS pptx.pptx
Pre independence Education in Inndia.pdf
Anesthesia in Laparoscopic Surgery in India
The Healthy Child – Unit II | Child Health Nursing I | B.Sc Nursing 5th Semester
STATICS OF THE RIGID BODIES Hibbelers.pdf

Designing for Context

  • 1. Mobile Context and Strategies Ivano Malavolta ivano.malavolta@univaq.it http://www.di.univaq.it/malavolta
  • 2. Roadmap • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications
  • 3. from the previous lecture…
  • 5. Two kinds of context Context with a big “C” VS context with a little “c”
  • 6. Context VS context by example • The app works in a specific context depending on the current location of the user • The app gives Context by providing additional info
  • 7. Context VS context by example Context who is here? VS context where I am Context answers users’ questions VS https://foursquare.com context is a fact
  • 8. Context with a big “C” How users will derive value from something they are currently doing For example: • info on restaurants • rate places • GPS navigator http://www.oink.com
  • 9. Context with a big “C” The information provided by the app gives Context A better understanding of what this moment in time means to the user Recurrent targets: people, places, things, situations, ideas
  • 10. context with a little “c” The mode, medium and environment in which we perform our tasks There are 3 different types of context: 1. Physical context 2. Media context 3. Modal context
  • 11. context with a little “c” Physical context where I am http://bit.ly/wXGpNA http://bit.ly/yoBk7d
  • 12. context with a little “c” Physical context In which environment I am • at home • on a bus car • in the streets VS • in my office train • in a shop http://www.textndrive.com http://www.whatsapp.com
  • 13. context with a little “c” Media context The device I am using • Connectivity • Screen size • Camera • etc … http://www.facebook.com
  • 14. context with a little “c” Modal context My present state of mind what I am doing right now How I feel right now http://www.runens.com http://photostatsapp.com/ http://babypad.mezmedia.com
  • 15. …again on “big C” VS “little c” I only care I only care about… about… Context context user Developer (you)
  • 16. …again on “big C” VS “little c” Your users do not care about physicality, media, or modes… They simply care about the app perceived value: Context
  • 17. …again on “big C” VS “little c” Good Design means making the context transparent to the user We have to create apps that anticipate and solve problems with little or no action from the user
  • 18. The Mobile golden rule If you can unlock the state of mind of your users and start context, thinking in their context understanding how a mobile experience will add value to their lives you will have the lives, ever-elusive… KILLER APP
  • 19. How can I apply the golden rule? Think of your app in the different contexts • Who is your user? Business man, teenager, mum… • What is happening? Are they hanging out with friends? • When will he interact? @home? @work? waiting for the bus? interact? • Where is he? Public/private space, inside/outside, day/night • Why will he use your app? How do you give Context? • How is he using his mobile device? Is the device held in the hand? Portrait or landscape?
  • 23. Roadmap • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications
  • 24. Developing a Mobile Strategy Mobile Strategy = how much it will cost you to develope your app? How much time time? How much effort effort? How much money money?
  • 25. Busting the first myth Mobile design and development is not cheap! cheap! http://www.slideshare.net/fling/native-v-hybrid-v-web
  • 26. Busting the first myth http://www.slideshare.net/fling/native-v-hybrid-v-web
  • 27. Busting the first myth You have to sum this price for each platform you want to support Even with Phonegap! http://www.slideshare.net/fling/native-v-hybrid-v-web
  • 28. The new rules for a mobile strategy Remember, mobile is a new medium different rules Don’t try to follow “traditional rules” since mobile has its own peculiarities: • context, • location, user mood • device fragmentation • unique UI rules • ...
  • 29. Rule #1 Forget what you think you know Mobile is an ever-evolving area today you are already outdated • Forget what you think you know about mobile – It is most likely incorrect • Don’t try to emulate other projects – Focus on what is right for your user, not what is right for someone else’s user • Start at the beginning – Provide new perspectives, and breathe life into the project right from the start
  • 30. Rule #2 Believe what you see, not what you read • Don’t trust any report, fact, or figure that 1-2 years old – It is most likely wrong • Go to your users and ask them questions in person – Don’t try to simply validate your ideas • Record everything – Your own users’ worlds will help you in focussing on their need • Don’t forget to innovate – Try new things, be bold, and don’t be afraid to fail. • Have a contingency plan – If your plan fails to meet expectations, try to reuse what you’ve learned or done on something else
  • 31. Rule #3 Constraints never come first • Avoid talking about constraints at an early-stage brainstorming session – Refer back to Rule #1 and forget what you think you know • there will always be constraints in mobile, accept it! • Focus on strategy first, what they user needs, and lay down the features – Then, if the constraints become an issue, fall back to the user goals • There is always an alternative
  • 32. Rule #4 Focus on context, goals and needs needs user goals actions context
  • 33. Rule #4 Focus on context, goals and needs 1. Defining the users’ context is the first thing to do – without it, you don’t have a mobile strategy, you have only a plan of action 2. Uncover the users’ goals – and then try and understand how the users’ context alters their goals 3. With goals understood, figure out the tasks the users want to perform 4. Look for ways to filter content by context – for example: location, media, and model.
  • 34. Rule #5 You can’t support everything • Don’t try to support everything – Start with the devices that best represent your core customer • The most popular might not always be the best device for your project • Check your server logs for the devices accessing your site – These are the first devices to target • Go to a mobile phones store and do a little market research to find out the recommended devices for your target customer
  • 35. Rule #6 Don’t convert, create Great mobile products are created, never ported! • Understand your user and his context – Having an idea of how and when users will access your content will aid in understanding how to best create a tailored mobile experience • Mobile is a unique medium
  • 36. Rule #6 - example
  • 37. Rule #7 Keep it simple People want to use mobile devices in a simple way • Simplicity fewer problems • Easier to iterate and evolve your app • Don’t try to create a desktop software on a mobile! • Adding feature after feature is an easy trap to fall in • Build the experience around your users’ main need and nothing else
  • 38. Roadmap • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications – Mobile Application Medium Type – Mobile Application Context
  • 39. Types of Mobile Applications In the following we will talk about: • Mobile Application Medium Types – the technology presenting the content to the user • ex. SMS, native app, web app … • Mobile Application Context – the type of experience provided to the user • ex. utility, informative, productivity …
  • 40. Mobile app medium types The technology presenting the content to the user SMS Mobile Websites Mobile Web Widgets Mobile Web Apps Native Apps Games
  • 41. Mobile app medium types: SMS The user sends an SMS to a 5-digit code and then he can get: • textual information • a link to premium content • a service Most common use: ringtones and wallpapers http://smstweet.com/
  • 42. Mobile app medium types: SMS PROS • they work on any mobile device nearly instantaneously • useful for sending timely alerts to the user • they can be incorporated into any web or mobile app • simple to set up and manage CONS • limited to 160 characters • limited text-based experience • can be very expensive
  • 43. Mobile app medium types: Mobile Websites A website designed for Mobile devices It is NOT about viewing on a mobile device a website designed for desktop browsers Features: – Simple architecture – Simple navigation links – Simple design – Informational in nature (typically, less interactive)
  • 44. Mobile app medium types: Mobile Websites PROS • easy to create, maintain, and publish • you can use the same tools and techniques for desktop sites • nearly all mobile devices can view mobile websites CONS • devices fragmentation • limited experience • they can load pages slowly – network latency
  • 45. Mobile app medium types: Web Widget Small web apps that cannot run by themselves, they must run on top of “something else” Known also as: portlet, web part, gadget, badge, module, webjit, capsule, snippet, mini, flake For example, Android has supported widgets natively since April 30, 2009 http://bit.ly/yNvwEd
  • 46. Mobile app medium types: Web Widget PROS • easy to create using basic HTML, CSS, JavaScript • simple to deploy across multiple handsets • They can directly access device features and offline use CONS • typically require a compatible widget platform to be installed on the device • require learning additional proprietary, non-standard techniques
  • 47. Mobile app medium types: Web App Mobile apps that run on the mobile web browser developed using standard technologies ex. HTML, CSS, Javascript Differently from mobile websites, they offer an “app-like” experience ex. buttons, actions, real-time data, no pages metaphor http://touch.facebook.com
  • 48. Mobile app medium types: Web App PROS • easy to create using basic HTML, CSS and JavaScript • simple to deploy across multiple handsets • better user experience and rich design • content is accessible on any mobile web browser CONS • difficult to support across multiple devices. • they don’t always support native application features – offline mode, location, filesystem access, camera …
  • 49. Mobile app medium types: Native Apps Developed for a specific platform Certified, sold and distributed via an operator portal or an app store It sits on top of the device platform you can access all the device’s features need for certification http://www.glancee.com/
  • 50. Mobile app medium types: Native Apps PROS • best-in-class user experience, rich design and tapping into device features and offline use • relatively simple to develop for a single platform • access to app stores (you can charge for your apps) CONS • developing for multiple device platforms is costly • require certification and distribution from an app store • you have to share revenue with platform vendors
  • 51. Mobile app medium types: Games Technically they are like native apps, however: • they cannot be esasily developed with web technologies – performance with vector graphics • porting them to multiple platforms is a bit easier – the graphic engine does not use device APIs www.angrybirds.com
  • 52. Mobile app medium types: Games PROS • simple and easy way to create an immersive experience • can be ported to multiple devices relatively easily CONS • can be costly to develop as an original game title • cannot easily be ported to the mobile web www.angrybirds.com
  • 53. Mobile app medium types: summary
  • 54. Roadmap • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications – Mobile Application Medium Type – Mobile Application Context
  • 55. Mobile App Context The type of experience provided to the user Utility Locale Informative Productivity Immersive
  • 56. Mobile App Context Applications can be presented in different ways es. taks-based utility, immersive experience, etc… • Typically, it is best to choose one app context and present it to the user don’t mix app contexts! contexts! • TIP: if you really need to switch context within your app, let the user choose when to switch
  • 57. Mobile App Context: Utility task- • short, task-based scenarios • minimal information from the user • minimal design ex. calculator alarm clock weather forecast
  • 58. Mobile App Context: Locale • it provides info about “what’s around” • recurrent feature: a map on which data is displayed • goal of the user: to find additional info about his present location ex. find friends around find pubs around get route directions https://foursquare.com
  • 59. Mobile App Context: Informative • Goal: to provide information to the user • Task of the user: to read and understand – not necessarily to interact • remember that user tasks are short and can be interrupted ex. news online directory mobile commerce https://www.pinterest.com
  • 60. Mobile App Context: Productivity • Meant to increase user’s sense of efficiency • Users have a clear goal in mind • Very structured (with folders) – it gives a sense of order • Follow a clear workflow ex. mail, scanning, todo lists… TIP: TIP focus on the main task only, and only after start adding other features http://www.thegrizzlylabs.com/genius-scan/
  • 61. Mobile App Context: Immersive • immersive, full-screen app full- • meant to consume the user’s focus user’s ex. games media players entertainment TIP: TIP you can use it as alternative to other app contexts http://www.rockstargames.com/grandtheftauto3