Visual design and aesthetics

Visual appeal of a website is what meets to eye. It consists of the colours, shapes, graphics, typography, space and overall visual balance. Visual appeal helps to attract users attention, creates a first impression, build long-term relationships via creating an emotional bond with users, as often a picture speaks a thousand words. Several elements of visual design are listed below.

Colour scheme/ use of colours

  • My Flaming Heart
  • (a) Harsh/loud colours (saturated orange) of navigation buttons might strain users� eyes
  • (b) Busy and distracting gradient background on the sides that takes focus off the main content
  • (c) Too colourful. Colour scheme consists of multiple colours (black, orange, blue, white)
  • (d) Black background would make visitors feel displeased for using up their ink cartridge when they print the page
  • Rokit
  • (a) Calm and accessible colours (black/grey texts and white background)
  • (b) Colourful graphics able to stand out more in a toned-down backdrop (provides contrast) (image below)

Readability (of font appearance)

  • My Flaming Heart
  • (a) Heavy stylised text for title (image below), contact information and text phase �El Castigado�s Corner� on the left image
  • (b) Oversized title that stretch across page. Individual letters are spread out too far apart from each other � difficult to interpret at first glance (image below)
  • (c) Changing of font mid-flow. Inconsistent text font types and sizes throughout the webpages
  • (d) No spacing between paragraphs
  • (e) Black background interferes with readability of blue text (both are of dark colours, not enough contrast)
  • Rokit
  • (a) Text is big enough to read, but not too big
  • (a) White background does not interfere with the readability of black text
  • (a) Consistent font type. No fanciful text
  • (a) Decreasing font size from top to bottom to emphasize hierarchy of information

Other visual design elements

  • My Flaming Heart
  • (a) Lack of scaling of elements and absence of space leading to too many focal points, distracting the readers
  • Rokit
  • (a) Presence of space reduces noise, increases readability, creates tension and hierarchy to emphasize elements which the owner wants readers to be drawn to first

Overall

  • My Flaming Heart
  • (a) Looks crowded
  • (b) Flashy for no reason
  • Rokit
  • (a) Looks simple, to-the-point and professional
  • (b) Design fits corporate image