×
Namespaces

Variants
Actions
(Difference between revisions)

Notes Usability

From Nokia Developer Wiki
Jump to: navigation, search
Rahulsingh1m (Talk | contribs)
(/* Confirmation note is used to show successfully completed operation. The symbol at right side of dialog confirm the user that operation completed successfully. Use confirmation note when the effect of the operation cannot be seen directly by user.)
hamishwillee (Talk | contribs)
m (Text replace - "Category:Mobile Design" to "")
 
(3 intermediate revisions by 2 users not shown)
Line 1: Line 1:
[[Category:Mobile_Design]][[Category:Usability]]
+
{{ArticleMetaData <!-- v1.2 -->
 +
|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= 20090619
 +
|author= [[User:Naresh99]]
 +
}}
 +
[[Category:Usability]]
  
 
==Description==
 
==Description==
Line 9: Line 31:
 
'''Depending on your requirement, design an application in such a way that note can show meaningful message'''
 
'''Depending on your requirement, design an application in such a way that note can show meaningful message'''
  
===Confirmation note is used to show successfully completed operation. The symbol at right side of dialog confirm the user that operation completed successfully. Use confirmation note when the effect of the operation cannot be seen directly by user.===
+
===Confirmation note is used to show successfully completed operation. The symbol at right side of dialog confirm the user that operation completed successfully. Use confirmation note when the effect of the operation cannot be seen directly by user.===
  
 
'''Confirmation note should NOT be used when:'''<br/>
 
'''Confirmation note should NOT be used when:'''<br/>
Line 21: Line 43:
 
     <td align="left">
 
     <td align="left">
 
'''Good confirmation note example  '''<br>
 
'''Good confirmation note example  '''<br>
[[Image:Goodconfirmationnote.jpg]]
+
[[File:Goodconfirmationnote.jpg]]
 
   </td>
 
   </td>
 
     <td align="left">
 
     <td align="left">
 
'''Bad confirmation note example'''<br>
 
'''Bad confirmation note example'''<br>
[[Image:confirmationnoteBad.jpg]]  
+
[[File:confirmationnoteBad.jpg]]  
 
     </td>
 
     </td>
 
   </tr>
 
   </tr>
Line 36: Line 58:
 
     <td align="left">
 
     <td align="left">
 
'''Good information note example    '''<br>                     
 
'''Good information note example    '''<br>                     
[[Image:informationnote.jpg]]
+
[[File:informationnote.jpg]]
 
   </td>
 
   </td>
 
     <td align="left">
 
     <td align="left">
 
'''Bad information note example'''<br>
 
'''Bad information note example'''<br>
[[Image:informationnoteBad.jpg]]  
+
[[File:informationnoteBad.jpg]]  
 
     </td>
 
     </td>
 
   </tr>
 
   </tr>
Line 51: Line 73:
 
     <td align="left">
 
     <td align="left">
 
'''Good warning note example'''<br>                     
 
'''Good warning note example'''<br>                     
[[Image:warningnoteBad.jpg]]
+
[[File:warningnoteBad.jpg]]
 
   </td>
 
   </td>
 
   </tr>
 
   </tr>
Line 63: Line 85:
 
     <td align="left">
 
     <td align="left">
 
'''Good error note example    '''<br>                     
 
'''Good error note example    '''<br>                     
[[Image:errnoteGood.jpg]]
+
[[File:errnoteGood.jpg]]
 
   </td>
 
   </td>
 
     <td align="left">
 
     <td align="left">
 
'''Bad error note example'''<br>
 
'''Bad error note example'''<br>
[[Image:ErrnoteBad.jpg]]  
+
[[File:ErrnoteBad.jpg]]  
 
     </td>
 
     </td>
 
   </tr>
 
   </tr>
Line 78: Line 100:
 
     <td align="left">
 
     <td align="left">
 
'''Good wait note example    '''<br>                     
 
'''Good wait note example    '''<br>                     
[[Image:waitnote.jpg]]
+
[[File:waitnote.jpg]]
 
   </td>
 
   </td>
 
     <td align="left">
 
     <td align="left">
 
'''Bad wait note example'''<br>
 
'''Bad wait note example'''<br>
[[Image:BadWait.jpg]]  
+
[[File:BadWait.jpg]]  
 
     </td>
 
     </td>
 
   </tr>
 
   </tr>
Line 93: Line 115:
 
     <td align="left">
 
     <td align="left">
 
'''Good progress note example    '''<br>                     
 
'''Good progress note example    '''<br>                     
[[Image:progressnote.jpg]]
+
[[File:progressnote.jpg]]
 
   </td>
 
   </td>
 
     <td align="left">
 
     <td align="left">
 
'''Bad progress note example'''<br>
 
'''Bad progress note example'''<br>
[[Image:Badprogressnote.jpg]]  
+
[[File:Badprogressnote.jpg]]  
 
     </td>
 
     </td>
 
   </tr>
 
   </tr>
 
</table>
 
</table>
 +
 +
 +
==Related Links==
 +
* [[Showing Notes]]
 +
* [[Progress and wait notes in Symbian C++]]

Latest revision as of 06:42, 9 May 2012

Article Metadata
Article
Created: naresh99 (19 Jun 2009)
Last edited: hamishwillee (09 May 2012)

Contents

[edit] Description

Notes display short messages to the user. Usually a note is displayed on the screen for a few seconds, but the user can also dismiss it sooner. In graphical user interfaces, a Notes is a special window, used in user interfaces to display information to the user.

[edit] Examples

Depending on your requirement, design an application in such a way that note can show meaningful message

[edit] Confirmation note is used to show successfully completed operation. The symbol at right side of dialog confirm the user that operation completed successfully. Use confirmation note when the effect of the operation cannot be seen directly by user.

Confirmation note should NOT be used when:
1. There is already another dialog in the procedure.
2. A progress indication is visible during the procedure.
3. The user can see the result of the operation when it is performed. For example, when adding or removing objects in a list.
4. A setting has been changed. The new value of the setting is visible in the setting item.

Good confirmation note example
Goodconfirmationnote.jpg

Bad confirmation note example
ConfirmationnoteBad.jpg

[edit] Information note is used to show an unexpected situation occur in application. An information note should be used when an error that can be rectified occurs. Information note can note be used to show error message.

Good information note example
Informationnote.jpg

Bad information note example
InformationnoteBad.jpg

[edit] Warning notes can be used to notify user about some action. It should also play a warning tone. for example battery is low.

Good warning note example
WarningnoteBad.jpg


[edit] Use Error notes if the user does something that may cause considerable harm immediately or later. e.g., when the user gives a wrong PIN code. Repeating this a couple of times would block the SIM card.

Good error note example
ErrnoteGood.jpg

Bad error note example
ErrnoteBad.jpg

[edit] Use wait note when you are doing processing that take long time. It does not, however, indicate how long the processing will take. it should provide option for user to cancel the operation, if they choose. for example connecting to remote server. provide a softkey to cancel the processing, if user want.

Good wait note example
Waitnote.jpg

Bad wait note example
BadWait.jpg

[edit] Progress notes is also used to show the processing that take long time. it also indicate how much processing has been done and how much is still left. it should provide option for user to cancel the operation, if they choose.for example downloading data from remote server.

Good progress note example
Progressnote.jpg

Bad progress note example
Badprogressnote.jpg


[edit] Related Links

This page was last modified on 9 May 2012, at 06:42.
73 page views in the last 30 days.