Milestone 3 part VI

Card Set Information

Milestone 3 part VI
2015-11-15 19:11:24
DesignForHackers visual hierarchy

Chapter 7: Enlivening Information: Establishing a Visual Hierarchy
Show Answers:

  1. hierarchy:
    The term hierarchy implies that information has a linear progression of important to not important.
  2. hierarchy -- implies linear progression of important to non-important--> not exactly true...WHY?
    The importance of a piece of information in an interface can change according to the use case.
  3. List ways to differentiate different pieces of information and design elements from one another.
    • alter the white space
    • make changes in size
    • changes in typeface
    • make changes in visual weight
  4. Whitespace (defn):
    White space usually used to describe any area that doesn’t have information, or some other design element within it.

    --When expressing how pieces of information differ, we need to isolate the variables with which we can make those expressions. One tool is the use of white space
  5. Type weight and size:
    • Defaulting first to the factors of weight and size can improve your versatility and contribute to elegant designs.
    • As apposed to going to a different font.
  6. Color:
    • Can make a distinction. An example would be coloring the text of a web page in different hues of one color and then giving the title of an opposite color on the color wheel.
    • Also when you click on a link to a different page the background color or link may have a different color...denoting that you are on that page.
    • Using a greater contrast (albeit sparingly)  to push the important parts out so they are more noticeable and therefore helpful to the user.
  7. Visual ornamentation:
    Putting visual ornamentation, in a sparse manor can also bring out important areas of the page.

    Example: putting a horizontal line under the title of the title of the page would bring attention of it to the user.
  8. Tabular data tips:
    Try to not put lines (rules) in tabular data right away.Creates Tufts 1+1 =3 condition where  by the pieces of data arranged in a table such as this are already visually divided by virtue of the white space between them. When you interrupt this white space with a rule, you now have two areas of white space and a rule (three things) all with the purpose of separating these pieces of data.

    With no grids,the mere alignment of elements can be very powerful in guiding the eye.