mirror of
https://github.com/jackyzha0/quartz.git
synced 2025-12-24 13:24:05 -06:00
41 lines
1.9 KiB
Markdown
41 lines
1.9 KiB
Markdown
---
|
|
title: "layout"
|
|
aliases:
|
|
tags:
|
|
- info203
|
|
- visual-design
|
|
---
|
|
|
|
Techniques such as, [similarity](notes/law-of-similarity.md), [grouping](notes/grouping.md) and (to a lesser extent) [closure](notes/law-of-closure.md), can be used to organise and groupu our interfaces. Often the grouping and layout is done before the rest of the design.
|
|
|
|
Examples:
|
|

|
|

|
|

|
|
|
|
This is relatively easy. However, when done badly it can quickly confuse the user.
|
|
|
|
**Summary**
|
|
- alignment guides the eye and reduces clutter
|
|
- avoid slight misalignments that undermine your ability to beacon organisation
|
|
- we automatically notice patterns and deviations
|
|
- when you deviate do so strategically
|
|
- use visual proximity and scale to convey semantic information
|
|
|
|
# Examples
|
|

|
|

|
|

|
|

|
|

|
|

|
|

|
|
|
|
# Jan Tschichold and Bauhaus
|
|
There was a sudden change from the right images to the left. This was partly due to advances in technology. This change was made by the Bauhaus group/school which became a way of thinking. Their ideas were inspired by architecture. The style was simple, functional, well grouped. These elements are also present in their visual design.
|
|
|
|

|
|

|
|

|
|

|