Confirmed users
1,492
edits
Mobile/UI/Designs/TouchScreen/workingUI: Difference between revisions
Mobile/UI/Designs/TouchScreen/workingUI (view source)
Revision as of 22:58, 11 December 2008
, 11 December 2008no edit summary
No edit summary |
|||
| (6 intermediate revisions by the same user not shown) | |||
| Line 42: | Line 42: | ||
==== Panning ==== | ==== Panning ==== | ||
Panning, on a touchscreen device, is achieved through direct manipulation -- a finger placed on the screen and "dragging" what's visible as if it were a continuous plane. | |||
Some details: | Some details: | ||
| Line 76: | Line 76: | ||
* Worth thinking about, but I think it will be too abstract for most users | * Worth thinking about, but I think it will be too abstract for most users | ||
3. Gestural | 3. Overlays - as in Android, where +/- controls show up over content. This has the disadvantage of only controlling zoom level, not location. | ||
4. Gestural | |||
* Tracing the area to which you'd like to zoom | * Tracing the area to which you'd like to zoom | ||
* "Dialing" to zoom: clockwise to zoom in, counterclockwise to zoom out - like this: | * "Dialing" to zoom: clockwise to zoom in, counterclockwise to zoom out - like this: | ||
| Line 82: | Line 84: | ||
http://people.mozilla.com/~madhava/files/mobile/zooming/dialing_to_zoom.png | http://people.mozilla.com/~madhava/files/mobile/zooming/dialing_to_zoom.png | ||
There's an example of this in use here: http://socialhelix.com/ In that example, the gesture conveys only the zoom level, but we could make it also convey zoom location. The area circled, when dialing in, could be the area to zoom to -- this allows correction as you go in, | There's an example of this in use here: http://socialhelix.com/ In that example, the gesture conveys only the zoom level, but we could make it also convey zoom location. The area circled, when dialing in, could be the area to zoom to -- this allows correction as you go in, by refining the encircled position. This gesture also has the benefit of being continuous -- you can just keep dialing until you're at the right level of zoom. | ||
This last one is what I think we should try out. | This last one is what I think we should try out. | ||
| Line 147: | Line 149: | ||
===Bookmarks=== | ===Bookmarks=== | ||
Designs here: | |||
[[Mobile/UI/Designs/TouchScreen/workingUI/bookmark_management]] | |||
===History=== | |||
The primary access to history, other than going back or forward a single page through the back and forward buttons, is via the awesomebar. For the key use case of going somewhere you've been before, using the awesomebar is the primary mechanism. | |||
That said, there's also a use case wherein the user wants to go back a few page (often while avoiding loading the intervening pages) -- e.g. to get back to the front page of an online newspaper after finishing reading a multi-page article. In this case, being able to see a list of recent history is very useful. UI for that usecase is explored here: | |||
[[Mobile/UI/Designs/TouchScreen/workingUI/visual_history]] | |||
| Line 210: | Line 224: | ||
Leaning towards the notification bar approach (alternative 2) at the moment, in the name of not having yet another means of displaying information about a page. | Leaning towards the notification bar approach (alternative 2) at the moment, in the name of not having yet another means of displaying information about a page. | ||
=== Extended Site Button === | |||
http://people.mozilla.com/~madhava/files/mobile/2008-11-18/site_button.png | |||
==== Authentication ==== | |||
===== Client Certificates ===== | |||
http://people.mozilla.com/~madhava/files/mobile/2008-11-18/certificate.png | |||
===== Username/Password===== | |||
http://people.mozilla.com/~madhava/files/mobile/2008-11-18/userpass.png | |||
===Preferences=== | ===Preferences=== | ||
| Line 220: | Line 249: | ||
Also see: http://madhava.com/egotism/archive/005024.html | Also see: http://madhava.com/egotism/archive/005024.html | ||
===Context-sensitive Menus (CSM)=== | |||
See here [[Mobile/UI/Designs/TouchScreen/workingUI/CSM]] (work in progress) | |||