User Interface Elements And Coded Components

User Interface Elements And Coded Components

1. Screen Elements

   • Font Size
     • Site/app should be adaptive to browser widgets and such for the sake of accessibility
       • Font size scales with device settings when user is accessing the application with a mobile device
         • Allows users to read bodies of text in the format and size which they prefer
       • Further in-app settings for the user to customise text size with
   • Sidebar Width
     • Should a sidebar be stowed away and extend on a button press, or be always visible?
       • Application/website formatting should be different on mobile and desktop devices
         • Sidebar is stowed away on a mobile device
           • Full size sidebar with shortcuts to every relevant section of the application will pop out upon icon being tapped, taking up most of the screen
       • On a desktop client, due to a greater amount of space being available the sidebar can be constantly visible
         • Every portion of the sidebar can be given an icon which is always visible - when a user hovers over an icon with their mouse, the sidebar extends in full
   • Stylised or generic font?
     • How will a stylised font match the purpose and design of the application?
       • Is an eye-catching font design needed, or is a more comprehensive and readable font a better choice for the target audience?
     • Can a font impact readability and accessibility through becoming too complex visually?
       • Logos and title cards in certain industries use stylised fonts, but when bodies of text are present, a more readable and generic font is used
         • What makes a font difficult or easy to read?
           • Letters and their shapes need to be easily differentiated - as users of a product or website grow older and cognitive functions become weaker, there are more and more symbols that can be confused for each other
           • Serifs, small strokes added onto the end of letters, can impact readability depending on the font
             • Care needs to be taken when choosing a font for body paragraphs - it is more important for something to be readable than to be visually pleasant from a distance
   • Integration with graphics elements
     • Screen space needs to be arranged to fit both pictures, text, and occasionally other graphics such as maps
       • Images can come with captions to additionally take advantage of screen space
       • Images should be prominent in order to draw attention to visually pleasing items or important information

2. Coded Elements

   • Data sets distributed by Australian government and state councils are used
     • Data sets include information such as the location of disabled-inclusive parks, public toilets, and events ongoing in various areas
       • In order to maximise the relevance of data sets used in the application, the target audience of the application needs to be considered
         • Individuals who are impaired or have a type of disability need to be taken into consideration as interactive elements of the application are coded and data sets used are chosen
   • Database used needs to be constantly accessible and editable in the case of changing circumstances
     • SQL and flask will be used to create a solution to accomplish this
       • A user with the necessary permissions will be capable of editing databases in ways such as removing, adding, and modifying entries in specific data sets
   • Interface needs to be coded with accessibility features in mind
     • Users will want to avoid having to think too much while using the application
       • Where every element and feature within the app is needs to be easily found - to aid this, a function such as a search with specific filters that can be selected by the user should be implemented
     • Visual indicators should be given to the user on all devices which are capable of accessing the application
       • Users of the desktop should have elements become emphasised upon hovering over with mouse
       • Elements such as a scroll bar will need to be added on mobile devices so users will know how far they have left to go
     • Integration of a screen reader should be added to accommodate for those who struggle with reading in a conventional setting
       • Explore by touch: Users run fingers or hover a mouse over a section of a body of text, upon which they will hear the section of text being read aloud
       • A solution to streamline the exploration process should also be added - for example, a user should be able to navigate several pages easily by simply swiping left and right or scrolling up and down