Saturday 17 December 2016

OUGD504 - Studio brief 02 - The processes and procedures involved in designing for screen

As a consideration for the brief it is crucial to look at the processes and procedures involved in designing for screen and as ive never designed for screen before, a lot of the terminology and rules to consider are new to me. For this part of the brief I looked at different elements that may inform my design descions for designing for screen such as typographical elements like font use and line length. Icons, colours and grids were also considerations I looked at.

Most of the time designers create a front page to their sites with a very limited amount of information and a strong emphasis on design and visual appeal. The user needs to click to move from the front page to the information pages where the text is more densely displayed.And this is where information is presented on screens in a dense and compact way , and if this is not done in a way that recognises the need for reduced screen densities, the busyness of the page and large amounts of resources and information can make the page difficult to read and browse. Therefore the designer needs to fully consider typographical elements like font use and line length to make the content legible for the viewer. Line length, generally speaking, shorter line lengths are better than longer line lengths and optimal lengths are given as 35 - 75 characters per line. In studies of legibility and line length, a number of inquiries have demonstrated that longer lines can provide better legibility than short lines while most tend to suggest that text is read more efficiently when presented in a compact and fashion. Most browsers, however, enable users to choose the length of the displayed line so readers are often able to create a line length that suits themselves.

The following guidelines provide some general rules about font and size for screen designers.
  • Minimum 12 or 14 point size. For example, if the font has relatively small characters compared to other fonts of that size (e.g., Times), choose 14; if the characters are relatively large (e.g., Bookman),12 pt may be better;
  • Use plain (roman) style, rather than bold, italic,outline, shadow, or other style sans-serif or with serifs that are not too fine to render well on-screen
  • Use a proportional font (unless it is necessary to choose a non-proportional font for some reason)
  • For headings and titles on-screen, a general guideline is to choose a font with the following characteristics:• 18-36 point size (assuming 12- or 14-point body text)

There are many options for colour in modern Web applications. Some designers recommend that screens should be designed in shades of gray, black and white first, with colour added later in a fashion, which adds to instructional effectivenessThe reasons for this are as follows:
  • Many people suffer from some type of colour deficiency ranging from weakness in certain colours, mainly red and green, to full loss of colour (it is estimated that 8% of the population experience some type of colour deficiency)
  • Older users can often have some problems discerning and perceiving colours
  • The monitors that are used to access Web pages may have differing colour capabilities which can lead to unexpected variations in colours.
Grids and tables can be used to establish that certain areas of the screen are to be used for specific purposes (eg. navigation buttons or hyperlinks are found on the top, bottom or left side of the page, text information is placed in the centre half of the screen with white space found on either side). Since HTML makes no allowances for margins or white space, other means such as tables with invisible borders are used to provide designers with the means of implementing their ideas. 

Icons can be very useful when designing navigation aids, advantages of icons include:
  • To help users work smarter by improving productivity and reliability (road signs can read at twice the distance and half the time as word sign);
  • To represent visual and spatial concepts such as shape, colour, position, angle, size, texture, and pattern
  • To save space in crowded screen displays
  • To speed search (we can recognise icons much more quickly that reading a list of words)
  • For better recall and immediate recognition
  • To allow illiterate or semi-literate users to function more easily
  • To increase global access to a web page or multimedia product


No comments:

Post a Comment