Skip to content
GitLab
Projects Groups Topics Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in
  • Picturerama Picturerama
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributor statistics
    • Graph
    • Compare revisions
  • Issues 0
    • Issues 0
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 0
    • Merge requests 0
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Artifacts
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Container Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Gruppe 12Gruppe 12
  • PictureramaPicturerama
  • Wiki
  • Universial Design

Universial Design · Changes

Page history
Update Universial Design authored Apr 23, 2020 by Olaf Rosendahl's avatar Olaf Rosendahl
Hide whitespace changes
Inline Side-by-side
Universial-Design.md
View page @ 42805d00
......@@ -6,7 +6,7 @@
_Intent of this Success Criterion is to ensure that all users can access information that is conveyed by color differences, that is, by the use of color where each color has a meaning assigned to it_."
Reference: [CITATION Acc181 \l 1044]
Reference: (Accessibility Guidelines Working Group 2017-2018)
In the application, it is used black/grey color consistently, and no information is only displayed through color differences. An example of color changing is when a user is hovering over a button (Figure 1,2). This will darken the color of the button and the cursor will also change to a hand format to indicate the option to "click" it. That way, color changing is not the only indication of buttons being clickable.
......@@ -32,7 +32,7 @@ _Text that is part of a logo or brand name has no contrast requirement._
_The intent of this Success Criterion is to provide enough contrast between text and its background so that it can be read by people with moderately low vision_"
Reference: [CITATION Acc182 \l 1044]
Reference: (Accessibility Guidelines Working Group 2017-2018)
Throughout the application, the default background color for JavaFX (Color code: #F1F2F2) is used as the background color for all pages, and for text, black color is used (Color code: #000000). In terms of the criteria written above, the contrast ratio is required to be at least 7:1. To check if the colors meet the criteria we used a web Color Contrast Checker [CITATION sno15 \l 1044]. It calculated the contrast ratio to be approximately 18:1, which is well above 7:1.
......@@ -60,7 +60,7 @@ _Parts of graphics required to understand the content, except when a particular
_The intent of this Success Criterion is to ensure that active user interface components (i.e., controls) and meaningful graphics are distinguishable by people with moderately low vision._"
Reference: [CITATION Acc184 \l 1044]
Reference: (Accessibility Guidelines Working Group 2017-2018)
Some of the application's non-text components have borders that differentiate the internal background color from the external background color. Internal background is the background inside the component, and external background is the background outside the component. Text fields for instance all have black boarders to distinguish the inner field from the scene background (Figure 4).
......@@ -80,8 +80,8 @@ _The intent of this Success Criterion is to ensure that, wherever possible, cont
References:
- [CITATION Acc185 \l 1044]
- [CITATION Acc186 \l 1044]
- (Accessibility Guidelines Working Group 2017-2018)
- (Accessibility Guidelines Working Group 2017-2018)
The application gives the user the option to use the keyboard to navigate through components with functionality. This is done by using the "Tab" key and/or the arrow keys. The focused object will change to a darker color to show that it is being focused, same color as when hovered over by the cursor (Figure 7). Therefore, a user can benefit from all the application's functionalities by only using a keyboard.
......@@ -95,7 +95,7 @@ _Figure 7: Focused button_
_The intent of this Success Criterion is to allow users to access the full content of a site without inducing seizures due to photosensitivity.__"_
References: [CITATION Acc187 \l 1044]
References: (Accessibility Guidelines Working Group 2017-2018)
The application has no animation or sudden color changes that could be categorized as flashes that cause seizures. As mentioned before, color changes occur if a user either hovers over or focus marks a component with functionality. Additionally, when a feedback text is given, it should display a red or green colored text (Figure 10), but this does neither exceed the threshold, as it only occupies a small portion of the window.
......@@ -115,7 +115,7 @@ _Figure 10: Loading animation_
_The intent of this Success Criterion is to help users find content and orient themselves within it by ensuring that each Web page has a descriptive title. Titles identify the current location without requiring users to read or interpret page content."_
References: [CITATION Acc188 \l 1044]
References: (Accessibility Guidelines Working Group 2017-2018)
Every scene in the application has a descriptive title, that should give a sufficient description of the purpose of the scene (Figure 11).
......@@ -129,7 +129,7 @@ _Figure 11: Log in scene with title_
_The purpose of this success criterion is to help a person know which element has the keyboard focus."_
References: [CITATION Acc1810 \l 1044]
References: (Accessibility Guidelines Working Group 2017-2018)
As mentioned before, when buttons receive focus, their color darkens (Figure 7). Additionally, when a text field receives focus a vertical bar is displayed in the field, indicating that the user can type. If text already exist in the field, it will be highlighted, indicating that the user can type over the text (Figure 12).
......@@ -143,7 +143,7 @@ _Figure 12: Focused text field_
_The intent of this Success Criterion is to ensure that users are aware that an error has occurred and can determine what is wrong._"
Reference:[CITATION Acc189 \l 1044]
Reference: (Accessibility Guidelines Working Group 2017-2018)
Input errors in the application will display an error message. The user will receive a descriptive text of what caused the error. For instance, when a user wants to sign up, he will be displayed different red labeled error messages if something went wrong during the registration (Figure 13,14,15).
......
Clone repository
  • Domain model
  • Installation Manual
  • Project Structure
  • Requirements
  • Sequence diagram
  • System
  • Universial Design
  • Usability Design
  • Usability Testing
  • Use case
  • User Manual
  • Vision Document
  • Wireframes
  • Home