... | ... | @@ -4,19 +4,19 @@ Usability design is an attribute that indicates how easy and user friendly the u |
|
|
|
|
|
## Visibility:
|
|
|
|
|
|
Visibility is a principle about component's visibility, and the more visible they are, the more likely the user is to use them. The application satisfies this by having components, like buttons and text fields, that occupy a big portion of the window. Furthermore, all the interactable interfaces are clearly visible. Users should be able to identify all controllers/components without problems. Lastly, the contrast between external background and the internal background of a component also separates the distinction between controls and non-controls.
|
|
|
Visibility is a principle about component's visibility, and the more visible they are, the more likely the user is to use them. The application satisfies this by having components, like buttons and text fields, that occupy a big portion of the window. Furthermore, all the interactable interfaces are clearly visible. Users should be able to identify all controls/components without problems. Lastly, the contrast between external background and the internal background of a component also separates the distinction between controls and non-controls.
|
|
|
|
|
|
## Affordance:
|
|
|
|
|
|
Controllers should have attributes that appeal to the user of how it is supposed to be used. For instance, a physical key on a keyboard should give the clue that it can be pressed for that key to be typed. In the application, when hovering over a component with functionality, the cursor will change its form to indicate that the component is interactable. For example, when hovering over a button, the cursor will change to a hand form to imply that the user can click it. Additionally, it will also darken the button's colour. Likewise, when hovering over a text field, the cursor will be shaped as a vertical bar to indicate that something can be written in that component. After the user has clicked the field, there will appear a blinking vertical bar giving the user an indication to write/enter text.
|
|
|
Controls should have attributes that appeal to the user of how it is supposed to be used. For instance, a physical key on a keyboard should give the clue that it can be pressed for that key to be typed. In the application, when hovering over a component with functionality, the cursor will change its form to indicate that the component is interactable. For example, when hovering over a button, the cursor will change to a hand form to imply that the user can click it. Additionally, it will also darken the button's colour. Likewise, when hovering over a text field, the cursor will be shaped as a vertical bar to indicate that something can be written in that component. After the user has clicked the field, there will appear a blinking vertical bar giving the user an indication to write/enter text.
|
|
|
|
|
|
## Mapping:
|
|
|
|
|
|
Mapping is a principle about having a clear relationship between the controllers and their actions. It is achieved by using labels, prompt text and tool tips. All text fields used in the application will be connected to a label and contain a prompt text that gives a description of what should be entered. Additionally, some text fields even have tooltips that better explain what the application expects to be entered. Likewise, buttons also have a small text with a description of the function. For example, "Sign up" text on a button will indicate that by pressing it you will sign up, given you have entered the requirements. Another prime example occurs when downloading a PDF of a selected album. Here, a user will have to both select a file location and press "Download" button for the action to take place. Together, they will imply that a PDF will be downloaded to the selected file location.
|
|
|
Mapping is a principle about having a clear relationship between the controls and their actions. It is achieved by using labels, prompt text and tool tips. All text fields used in the application will be connected to a label and contain a prompt text that gives a description of what should be entered. Additionally, some text fields even have tooltips that better explain what the application expects to be entered. Likewise, buttons also have a small text with a description of the function. For example, "Sign up" text on a button will indicate that by pressing it you will sign up, given you have entered the requirements. Another prime example occurs when downloading a PDF of a selected album. Here, a user will have to both select a file location and press "Download" button for the action to take place. Together, they will imply that a PDF will be downloaded to the selected file location.
|
|
|
|
|
|
## Constrains:
|
|
|
|
|
|
Constrains is a principle about limiting the possibilities of a user. This is done by simplifying the interfaces and guiding the user to the next action. Instances where this is satisfied, is when the application disables buttons in cases were interaction with it will cause errors or exceptions. In other words, buttons that are not meant to be used at that time, will not be able to be pressed. Secondly, the application uses other input controllers than text fields when possible. This is done to hinder incorrect input and to give the user a better understanding of what type of input the application wants. For instance, when choosing an album, you only get the option to select albums, instead of having to write the name of the album in a text field. Lastly, each page in the application only contains a few optional actions, as this keeps the interfaces/pages simple and understandable. This also keeps the cohesion on each page.
|
|
|
Constrains is a principle about limiting the possibilities of a user. This is done by simplifying the interfaces and guiding the user to the next action. Instances where this is satisfied, is when the application disables buttons in cases were interaction with it will cause errors or exceptions. In other words, buttons that are not meant to be used at that time, will not be able to be pressed. Secondly, the application uses other input controls than text fields when possible. This is done to hinder incorrect input and to give the user a better understanding of what type of input the application wants. For instance, when choosing an album, you only get the option to select albums, instead of having to write the name of the album in a text field. Lastly, each page in the application only contains a few optional actions, as this keeps the interfaces/pages simple and understandable. This also keeps the cohesion on each page.
|
|
|
|
|
|
## Learnability/consistency:
|
|
|
|
... | ... | |