Namespaces

Variants
Actions

Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries over the next few weeks. Thanks for all your past and future contributions.

(Difference between revisions)

Mobile Design Pattern: Markable List

From Wiki
Jump to: navigation, search
Yiibu (Talk | contribs)
hamishwillee (Talk | contribs)
m (Text replace - "Category:Mobile Design" to "")
 
(3 intermediate revisions by one user not shown)
Line 1: Line 1:
[[Category:Mobile_Design]]
+
{{ArticleMetaData <!-- v1.2 -->
[[Category:Mobile_Design_Patterns]]
+
|sourcecode= <!-- Link to example source code e.g. [[Media:The Code Example ZIP.zip]] -->
 +
|installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) -->
 +
|devices= <!-- Devices tested against - e.g. ''devices=Nokia 6131 NFC, Nokia C7-00'') -->
 +
|sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Qt SDK 1.1.4]) -->
 +
|platform= <!-- Compatible platforms - e.g. Symbian^1 and later, Qt 4.6 and later -->
 +
|devicecompatability= <!-- Compatible devices e.g.: All* (must have internal GPS) -->
 +
|dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 -->
 +
|signing= <!-- Signing requirements - empty or one of: Self-Signed, DevCert, Manufacturer -->
 +
|capabilities= <!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. -->
 +
|keywords= <!-- APIs, classes and methods (e.g. QSystemScreenSaver, QList, CBase -->
 +
|language= <!-- Language category code for non-English topics - e.g. Lang-Chinese -->
 +
|translated-by= <!-- [[User:XXXX]] -->
 +
|translated-from-title= <!-- Title only -->
 +
|translated-from-id= <!-- Id of translated revision -->
 +
|review-by= <!-- After re-review: [[User:username]] -->
 +
|review-timestamp= <!-- After re-review: YYYYMMDD -->
 +
|update-by= <!-- After significant update: [[User:username]]-->
 +
|update-timestamp= <!-- After significant update: YYYYMMDD -->
 +
|creationdate= 20090506
 +
|author= [[User:Yiibu]]
 +
}}
 +
 
 +
[[Category:Mobile Design Patterns]]
  
 
This design pattern is part of the [[:Category:Mobile Design Patterns|Mobile Design Patterns]] series.
 
This design pattern is part of the [[:Category:Mobile Design Patterns|Mobile Design Patterns]] series.
Line 8: Line 30:
  
  
[[Image:34-marked-list.jpg]]
+
[[File:34-marked-list.jpg]]
  
 
'''Figure:''' A marked list of emails. Each marked item is indicated with a check mark.
 
'''Figure:''' A marked list of emails. Each marked item is indicated with a check mark.
Line 28: Line 50:
 
* The user is free to apply any contextually available command to the group of items at any time. '''Note:''' Only commands that can be applied to the entire group should be provided.
 
* The user is free to apply any contextually available command to the group of items at any time. '''Note:''' Only commands that can be applied to the entire group should be provided.
 
* Once the command is applied, the list items remain marked until the user navigates away from the list (typically through a Back or Exit command). In this way, multiple commands can be applied to the same Marked list without the need to re-mark the items.
 
* Once the command is applied, the list items remain marked until the user navigates away from the list (typically through a Back or Exit command). In this way, multiple commands can be applied to the same Marked list without the need to re-mark the items.
* This pattern is most effective when combined with key-mapped shortcut to assist power-users. S60 3rd Edition FP2 now maps the Mark/Unmark command to the # key and has also implemented a host of [http://library.forum.nokia.com/index.jsp?topic=/S60_5th_Edition_Cpp_Developers_Library/GUID-ED784025-4E65-4BE9-ADA8-A13427B6EA30.html related shortcut behaviours]. These dramatically reduce the amount of time required to mark large numbers of items however discoverability may be a concern given the sophistication of certain shortcuts.
+
* This pattern is most effective when combined with key-mapped shortcut to assist power-users. S60 3rd Edition FP2 now maps the Mark/Unmark command to the # key and has also implemented a host of [http://library.developer.nokia.com/index.jsp?topic=/S60_5th_Edition_Cpp_Developers_Library/GUID-ED784025-4E65-4BE9-ADA8-A13427B6EA30.html related shortcut behaviours]. These dramatically reduce the amount of time required to mark large numbers of items however discoverability may be a concern given the sophistication of certain shortcuts.
  
 
'''Note:''' This pattern can be used with both direct and indirect manipulation devices.  
 
'''Note:''' This pattern can be used with both direct and indirect manipulation devices.  
 
Note however that in a touch device without hardware keys, the marking may only be available through the Options menu. This can impact both discoverability and usability.
 
Note however that in a touch device without hardware keys, the marking may only be available through the Options menu. This can impact both discoverability and usability.
  
See [http://library.forum.nokia.com/index.jsp?topic=/Design_and_User_Experience_Library/GUID-6E5CEE22-7804-4848-9513-F0EFC3130EB0.html Touch Specific Issues in Lists] within the Forum Nokia Design and User Experience Library for more information.  
+
See [http://library.developer.nokia.com/index.jsp?topic=/Design_and_User_Experience_Library/GUID-6E5CEE22-7804-4848-9513-F0EFC3130EB0.html Touch Specific Issues in Lists] within the Nokia Developer Design and User Experience Library for more information.  
  
  

Latest revision as of 03:26, 9 May 2012

Article Metadata
Article
Created: User:Yiibu (06 May 2009)
Last edited: hamishwillee (09 May 2012)

This design pattern is part of the Mobile Design Patterns series.

Contents

[edit] Description

A mechanism enabling users to select multiple items within a list then apply an action to the entire marked group of items.


34-marked-list.jpg

Figure: A marked list of emails. Each marked item is indicated with a check mark.

Advantages

  • Can be extremely useful in high productivity scenarios such as deletion or management of email.

[edit] Disadvantages

  • Can require complex sequences of actions that may not be easily discoverable.

[edit] Use when

  • To create a multi-selection list capability where it is not practical (or desirable) to implement a multi-selection list.
  • This option is most useful to enable record management (i.e. emails, photos, audio, video, documents). Common contextual commands include Move, Delete, Upload, Add to folder etc.

[edit] Use how

  • A contextual menu command is provided enabling users to Mark items by first placing focus on them and then selecting this Mark command.
  • A ‘Mark All’ option is also provided.
  • Once one or more items have been marked, ‘Unmark All’ replaces ‘Mark All’ and an additional ‘Unmark’ command becomes available.
  • The user is free to apply any contextually available command to the group of items at any time. Note: Only commands that can be applied to the entire group should be provided.
  • Once the command is applied, the list items remain marked until the user navigates away from the list (typically through a Back or Exit command). In this way, multiple commands can be applied to the same Marked list without the need to re-mark the items.
  • This pattern is most effective when combined with key-mapped shortcut to assist power-users. S60 3rd Edition FP2 now maps the Mark/Unmark command to the # key and has also implemented a host of related shortcut behaviours. These dramatically reduce the amount of time required to mark large numbers of items however discoverability may be a concern given the sophistication of certain shortcuts.

Note: This pattern can be used with both direct and indirect manipulation devices. Note however that in a touch device without hardware keys, the marking may only be available through the Options menu. This can impact both discoverability and usability.

See Touch Specific Issues in Lists within the Nokia Developer Design and User Experience Library for more information.


[edit] Design Tips

  • Clearly indicate the marked items using an easily recognizable symbol. S60 uses a check mark to indicate marked items.
  • In this context the check mark (a common symbol to indicate correctness in many countries) is used to indicate a positive choice. In Japan however, a check mark can be used to mean that something is incorrect so may not be the best option[1].
This page was last modified on 9 May 2012, at 03:26.
53 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×