Mobile Applications Development - Lecture 2

Designing for Context

Developing a Mobile Strategy

Types of Mobile Applications

This presentation has been developed in the context of the Mobile Applications Development course at the Computer Science Department of the University of L’Aquila (Italy).

http://www.di.univaq.it/malavolta

Transcript

1. Mobile Context and Mobile Context and Strategies Ivano Malavolta Ivano Malavolta ivano.malavolta@univaq.it http://www.di.univaq.it/malavolta
2. Roadmap • Designing for Context • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications
3. from the previous lecture…
4. Designing for the Context
5. Two kinds of context Context Context with a big “C” VS VS VS VS context with a little “c”
6. Context VS context by example • The app works works works works in a in a in a in a specific specific specific specific context context context context depending on the current location of the user • The app gives gives gives gives Context Context Context Context by providing additional info
7. Context VS context by example who is here? Context where I am context VS Context answers users’ Context answers users’ questions context is a fact VS https://foursquare.com
8. Context with a big “C” How How How How users users users users will will will will derive derive derive derive value value value value from from from from something something something something they they they they are are are are currently currently currently currently doing doing doing doing they they they they are are are are currently currently currently currently doing doing doing doing For example: • info on restaurants • rate places • rate places • GPS navigator http://www.oink.com
9. Context with a big “C” The information provided by the app gives Context Context Context Context A A A A better better better better understanding understanding understanding understanding of of of of what what what what this this this this moment in moment in moment in moment in time time time time means means means means to to to to the the the the user user user user Recurrent targets: people, places, things, situations, ideas
10. context with a little “c” The mode, medium and The mode, medium and The mode, medium and The mode, medium and environment environment environment environment in in in in which which which which we we we we perform perform perform perform our our our our tasks tasks tasks tasks we we we we perform perform perform perform our our our our tasks tasks tasks tasks There are 3 different types of context: 1. Physical context 2. Media context 2. Media context 3. Modal context
11. context with a little “c” Physical Physical Physical Physical context context context context where I am where I am http://bit.ly/wXGpNA http://bit.ly/yoBk7d
12. context with a little “c” Physical Physical Physical Physical context context context context In which environment I am In which environment I am • at home • on a bus • in the streets car VS • in the streets • in my office • in a shop VS train http://www.textndrive.com http://www.whatsapp.com
13. context with a little “c” Media Media Media Media context context context context The device I am using The device I am using • Connectivity • Screen size • Camera • etc … http://www.facebook.com
14. context with a little “c” Modal Modal Modal Modal context context context context My present state of mind 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 I only care about… I only care about… Context context user Developer (you)
16. …again on “big C” VS “little c” Your users do not care about physicality, media, or modes… or modes… They simply care about the app perceived value: Context Context
17. …again on “big C” VS “little c” Good Good Good Good Design Design Design Design means making the context transparent to the user transparent to the user We have to create apps that anticipate and solve problems with little or no action from the user the user
18. The Mobile golden rule If you can unlock the state of mind of your users and start start start start mind of your users and start start start start thinking thinking thinking thinking in their context in their context in their context in their context, understanding how a mobile experience will add value to their lives add value to their lives add value to their lives add value to their lives, you will have the ever-elusive… ever-elusive… KILLER APP
19. How can I apply the golden rule? Think of your app in the different contexts • Who Who Who Who is is is is your your your your user? user? user? user? Business man, teenager, mum… • Who Who Who Who is is is is your your your your user? user? user? user? Business man, teenager, mum… • What is happening? What is happening? What is happening? What is happening? Are they hanging out with friends? • When will When will When will When will he interact he interact he interact he interact? ? ? ? @home? @work? waiting for the bus? • Where Where Where Where is he? is he? is he? is he? Public/private space, inside/outside, day/night • Where Where Where Where is he? is he? is he? is he? Public/private space, inside/outside, day/night • Why will Why will Why will Why will he he he he use use use use your your your your app? app? app? app? How do you give Context? • How How How How is he is he is he is he using using using using his mobile device? his mobile device? his mobile device? his mobile device? Is the device held in the hand? Portrait or landscape?
20. Examples http://www.soundhound.com
21. Examples 2 http://www.endomondo.com
22. Examples 3 http://www.instagr.am
23. Roadmap • Designing for Context • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications
24. Developing a Mobile Strategy Mobile Mobile Mobile Mobile Strategy Strategy Strategy Strategy = how much it will cost you to develope your app? How much time time time time? How much effort effort effort effort? How much effort effort effort effort? How much money money money money?
25. Busting the first myth Mobile design and Mobile design and Mobile design and Mobile design and development development development development is is is is not not not not cheap cheap cheap cheap! ! ! ! development development development development is is is is not not not not cheap cheap 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 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 different different different rules rules rules rules different different different different rules rules rules rules Don’t try to follow “traditional rules” since mobile has its own peculiarities: • context, • context, • location, user mood • device fragmentation • unique UI rules • ...
29. Rule #1 Mobile is an ever-evolving area 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 • 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 • Don’t trust any report, fact, or figure that 1-2 years old 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 – 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 • 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 goals needs user context actions
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 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 core core core customer customer customer customer • The most popular might not always be the best best best best device for your project • Check your server logs server logs server logs server logs for the devices accessing your • Check your server logs server logs server logs 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 little market little market little market research research research 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 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 • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications – Mobile Application Medium Type – Mobile Application Context – Mobile Application Context
39. Types of Mobile Applications In the following we will talk about: • Mobile Mobile Mobile Mobile Application Application Application Application Medium Medium Medium Medium Types Types Types Types – the technology technology technology technology presenting the content to the user • ex. SMS, native app, web app … • Mobile Mobile Mobile Mobile Application Application Application Application Context Context Context Context • Mobile Mobile Mobile Mobile Application Application Application Application Context Context Context Context – the type of experience experience experience experience provided to the user • ex. utility, informative, productivity …
40. Mobile app medium types The technology technology technology technology presenting the content to the user SMS Mobile Websites Mobile Web Widgets Mobile Web Apps Mobile Web Apps Native Apps Games
41. The user sends an SMS to a 5-digit code and then he can get: Mobile app medium types: SMS 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 PROS PROS PROS • they work on any mobile device any mobile device any mobile device any mobile device nearly instantaneously • they work on any mobile device any mobile device any mobile device 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 CONS CONS CONS CONS CONS CONS 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 PROS PROS PROS • easy to create, maintain, and publish • 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 CONS CONS CONS CONS CONS CONS 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” 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 PROS PROS PROS • easy to create using basic HTML, CSS, JavaScript • easy to create using basic HTML, CSS, JavaScript • simple to deploy across multiple handsets • They can directly access device features and offline use CONS CONS CONS CONS • typically require a compatible widget platform to be • 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 web browser developed using standard technologies ex. HTML, CSS, Javascript Differently from mobile websites, they offer an “app-like” experience 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 PROS PROS PROS • easy to create using basic HTML, CSS and JavaScript • 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 CONS CONS CONS CONS CONS CONS 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 platform platform platform Certified, sold and distributed via an operator portal or an app app app app store store store 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 PROS PROS PROS • best-in-class user experience, rich design and tapping • 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 CONS CONS CONS CONS CONS CONS 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 • 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 PROS PROS PROS • simple and easy way to create an immersive experience • simple and easy way to create an immersive experience • can be ported to multiple devices relatively easily CONS CONS CONS CONS • can be costly to develop as an original game title • 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 • Designing for Context • Developing a Mobile Strategy • Types of Mobile Applications – Mobile Application Medium Type – Mobile Application Context – Mobile Application Context
55. Mobile App Context The type of experience experience experience 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… es. taks-based utility, immersive experience, etc… • Typically, it is best to choose one one one one app context and present it to the user don’t mix don’t mix don’t mix don’t mix app app app app contexts contexts contexts contexts! ! ! ! • TIP: TIP: TIP: TIP: if you really need to switch context within your app, let the user choose when to switch
57. Mobile App Context: Utility • short, task short, task short, task short, task- - - -based scenarios based scenarios based scenarios based scenarios • minimal minimal minimal minimal information information information information from the user • minimal minimal minimal minimal information information information information from the user • minimal design minimal design minimal design minimal design ex. calculator alarm clock alarm clock weather forecast
58. Mobile App Context: Locale • it provides info about “what’s around” • recurrent feature: a map map map map on which data is displayed • recurrent feature: a map map map map on which data is displayed • goal of the user: to find additional info about his present present present present location location location location ex. find friends around find pubs around get route directions https://foursquare.com
59. Mobile App Context: Informative • Goal: to provide provide provide provide information information information information to the user • Task of the user: to read read read read and understand understand understand understand • Task of the user: to read read read read and understand understand understand understand – not necessarily to interact • remember that user tasks are short short short short and can be interrupted interrupted interrupted interrupted ex. ex. news online directory mobile commerce https://www.pinterest.com
60. • Meant to increase user’s sense of efficiency • Users have a clear goal in mind Mobile App Context: Productivity • 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… ex. mail, scanning, todo lists… TIP TIP 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 full full full- - - -screen screen screen screen app • meant to consume the user user user user’s focus ’s focus ’s focus ’s focus • meant to consume the user user user user’s focus ’s focus ’s focus ’s focus ex. games media players entertainment entertainment TIP TIP TIP TIP: you can use it as alternative to other app contexts http://www.rockstargames.com/grandtheftauto3
62. Mobile App Context: Summary
63. References Chapters 4-5-6