Mobile/Fennec/Extensions/UserInterface: Difference between revisions

Jump to navigation Jump to search

Mobile/Fennec/Extensions/UserInterface (view source)

Revision as of 16:47, 22 September 2009

680 bytes added ,  22 September 2009
no edit summary
No edit summary
Line 9: Line 9:
These two overlap, given that the design of Fennec was itself heavily influenced by point number 1, above.  Let's deal with this one at a time:
These two overlap, given that the design of Fennec was itself heavily influenced by point number 1, above.  Let's deal with this one at a time:


==Designing a UI for mobile==
==General UI design for mobile==


There's a mid-sized and furiously-growing body of knowledge out there about designing UIs for mobile, and I'm not going to be able to cover it all here, but this should get you started.  I've included some links to other resources for more in-depth coverage in section 2.3.
There's a mid-sized and furiously-growing body of knowledge out there about designing UIs for mobile, and I'm not going to be able to cover it all here, but this should get you started.  I've included some links to other resources for more in-depth coverage in section 2.3.
Line 20: Line 20:
The following is a list of the most relevant characteristics of the current generation of mobile devices.
The following is a list of the most relevant characteristics of the current generation of mobile devices.


* Small screens
'''Small screens'''
** They're getting bigger and higher resolution, but they're still small
* They're getting bigger and higher resolution, but they're still small
** Pare down what you put on the screen to the minimum - you have limited space to work with;  if something isn't directly relevant to the task at hand, consider moving it away or getting rid of it
* Pare down what you put on the screen to the minimum - you have limited space to work with;  if something isn't directly relevant to the task at hand, consider moving it away or getting rid of it
** You are further limited in that finger-size is fixed, even as resolution gets higher -- you can fit only so many points of interaction (like buttons) even as you can display more
* You are further limited in that finger-size is fixed, even as resolution gets higher -- you can fit only so many points of interaction (like buttons) even as you can display more


* Difficult to type
'''Difficult to type'''
** Even with good predictive suggestions on soft keyboards or physical keyboards, typing is almost always more difficult and time-consuming than on a full-sized keyboard
* Even with good predictive suggestions on soft keyboards or physical keyboards, typing is almost always more difficult and time-consuming than on a full-sized keyboard
** Try to minimize the amount of typing a user has to do
* Try to minimize the amount of typing a user has to do
*** let them pick from lists or make suggestions as to what they might want (which you can improve based on input like the awesomebar) that they can tap on
** let them pick from lists or make suggestions as to what they might want (which you can improve based on input like the awesomebar) that they can tap on
*** remember previous input so users don't have to keep re-entering it
** remember previous input so users don't have to keep re-entering it


* Direct manipulation - touchscreens
'''Direct manipulation - touchscreens'''
** It's not all just limitations!  Touchscreens allow for very rich physical interactions
* It's not all just limitations!  Touchscreens allow for very rich physical interactions
** look into to gestures, and follow the emerging design patterns
* look into to gestures, and follow the emerging design patterns
** certain principles from the desktop (like Fitts' law) don't apply in the same way
* certain principles from the desktop (like Fitts' law) don't apply in the same way


* Many abilities - rich devices
'''Many abilities - rich devices'''
** devices have cameras (multiple!), microphones, location-positioning abilities, compasses, accelerometers, to name the common ones
* devices have cameras (multiple!), microphones, location-positioning abilities, compasses, accelerometers, to name the common ones
** think about what you can do with them, and also how they can help you avoid making users type
* think about what you can do with them, and also how they can help you avoid making users type
 
'''Constant but interruptible connection'''
* users are never on a wired connection, or even necessarily wifi, so interruptions are more common;  try to fail and recover gracefully


* Constant but interruptible connection
** users are never on a wired connection, or even necessarily wifi, so interruptions are more common;  try to fail and recover gracefully


===Mobile User Characteristics===
===Mobile User Characteristics===
Line 47: Line 48:
People are different in what they want and do while not in the special-case context of a desk and computer.  Here is a taxonomy drawn from "Designing the Mobile User Experience" by Barbara Ballard of some of those differences.
People are different in what they want and do while not in the special-case context of a desk and computer.  Here is a taxonomy drawn from "Designing the Mobile User Experience" by Barbara Ballard of some of those differences.


* Mobile
'''Mobile'''
** People can be on the move - they're already navigating in the real world, and so using the parts of their brains that do help them do that.  These are the same parts that help them figure out complicated UI navigation -- they'll be in contention!
* People can be on the move - they're already navigating in the real world, and so using the parts of their brains that do help them do that.  These are the same parts that help them figure out complicated UI navigation -- they'll be in contention!
** not much with them, other than themselves and the device;  you can't rely on people being able to write anything down, for example
* not much with them, other than themselves and the device;  you can't rely on people being able to write anything down, for example
** a user's motor precision will not be at its peak
* a user's motor precision will not be at its peak


* Interruptible and distractible
'''Interruptable and distraction-prone'''
** The outside world will take priority - user won’t necessarily be able to choose the best time for software
* The outside world will take priority - user won’t necessarily be able to choose the best time for software
*** this means that your UI should always deal well with being made to wait, if a user's attention goes away
*** this means that your UI should always deal well with being made to wait, if a user's attention goes away
*** a user may be looking away and back, so if something changes in the UI, it should be clear where you've taken them, and how that relates to where they were before (they may have missed the transition)
** a user may be looking away and back, so if something changes in the UI, it should be clear where you've taken them, and how that relates to where they were before (they may have missed the transition)
** There are fewer social cues to other humans that they're engrossed in a virtual activity compared to a person at a desk staring at a screen, so those other humans will interrupt them more (and they'll take priority)
* There are fewer social cues to other humans that they're engrossed in a virtual activity compared to a person at a desk staring at a screen, so those other humans will interrupt them more (and they'll take priority)
 
'''Available'''
* People take their phones/devices with them everywhere
* But it's not always a good time, so don't be too demanding


* Available
'''Sociable'''
** People take their phones/devices with them everywhere
* Away from their desks, people enter their more natural mode, which is as social creatures;  in fact, even at their desks, people will use their mobile devices as links to their social world (through IM, calls, SMS, etc.)
** Clay Shirky: coordination vs. planning
* It's not that the mobile device makes people more social, but that the devices are present when people away from the contexts in which they are less social (i.e. work)
** It’s not always a good time
* online sociability vs. sociability in person [will put more here]


* Sociable
'''Contextual'''
** Engaged in the world of people, as they should be
* more affected by context -- environment affects how a device is used;  it's not that context is magically more important while mobile, but that the traditional setting we assume -- a person at a desk -- is one where context is made artificially minimal
** online sociability vs. sociability in person [will put more here]
* think about implications of the following;  they will matter, and you can know things about all of them, through the device:
** location
** time
** weather
** schedule


* Contextual
'''Identifiable'''
** more affected by context -- environment affects how a device is used;  it's not that context is magically more important while mobile, but that the traditional setting we assume -- a person at a desk -- is one where context is made artificially minimal
* users are connected to and associated with their devices even more than their computers thanks to one thing - phone numbers
** think about implications of these for your UI:
* Devices tend to be personal
*** location
* Sharing, at least in North America and Europe, is rare
*** time
* Privacy risk, but also an means that you can assume more about the private way the device will be used
*** weather
*** schedule


* Identifiable
** users are connected to and associated with their devices even more than their computers thanks to one thing - phone numbers
** Devices tend to be personal
** Sharing, at least in North America and Europe, is rare
** Privacy risk, but also an means that you can assume more about the private way the device will be used


===Other Resources===
===Other Resources===
Line 87: Line 89:
* On finger size: https://help.ubuntu.com/community/UMEGuide/DesigningForFingerUIs
* On finger size: https://help.ubuntu.com/community/UMEGuide/DesigningForFingerUIs
* http://patterns.design4mobile.com/index.php/Main_Page
* http://patterns.design4mobile.com/index.php/Main_Page
* about uses for location: http://www.littlespringsdesign.com/blog/blog/2008/10/09/location-services-beyond-maps-directions-and-local-search/
* some best-practices: http://www.usercentric.com/news/2009/08/26/best-practices-designing-mobile-applications
* Books:
* Books:
** bb
** bb
Madhava
Confirmed users
1,492

edits

Retrieved from "https://wiki.mozilla.org/Special:MobileDiff/169879"

Navigation menu