SlideShare a Scribd company logo
1 of 12
Grid layouts
On each of the
following slides, draw
vertical lines that
mark the margins of
the columns.

Like this.
Specify the
number of
columns for
each example
with a text box
annotation like
the one below.

2
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise
Grid examples lab exercise

More Related Content

Viewers also liked (20)

Controls
ControlsControls
Controls
 
Gestalt Principles
Gestalt PrinciplesGestalt Principles
Gestalt Principles
 
Twitter 101
Twitter 101Twitter 101
Twitter 101
 
18 b writing for the web
18 b writing for the web18 b writing for the web
18 b writing for the web
 
Vocabulary "Learning & Careers"
Vocabulary "Learning & Careers"Vocabulary "Learning & Careers"
Vocabulary "Learning & Careers"
 
Mcf Academy Book Low Rez
Mcf Academy Book Low RezMcf Academy Book Low Rez
Mcf Academy Book Low Rez
 
personas task analysis
personas task analysispersonas task analysis
personas task analysis
 
15 metaphor typography
15 metaphor typography15 metaphor typography
15 metaphor typography
 
Healthy Body Life
Healthy Body LifeHealthy Body Life
Healthy Body Life
 
mobile usability
mobile usabilitymobile usability
mobile usability
 
Engineering and Technology Education
Engineering and Technology EducationEngineering and Technology Education
Engineering and Technology Education
 
03 usability def designprocess
03 usability def designprocess03 usability def designprocess
03 usability def designprocess
 
Managing onlineidentity
Managing onlineidentityManaging onlineidentity
Managing onlineidentity
 
Occupational Health and Safety
Occupational Health and SafetyOccupational Health and Safety
Occupational Health and Safety
 
Book Demographic DPP
Book Demographic DPPBook Demographic DPP
Book Demographic DPP
 
Scientists Encode First Women Genome
Scientists Encode First Women GenomeScientists Encode First Women Genome
Scientists Encode First Women Genome
 
visual designprinciples_1
visual designprinciples_1visual designprinciples_1
visual designprinciples_1
 
11 info architecture
11 info architecture11 info architecture
11 info architecture
 
Reporting
ReportingReporting
Reporting
 
Procurement
ProcurementProcurement
Procurement
 

More from Dr. V Vorvoreanu

Attention info scent recognition vs recall
Attention info scent recognition vs recallAttention info scent recognition vs recall
Attention info scent recognition vs recall
Dr. V Vorvoreanu
 
UX user-centered design process overview
UX user-centered design process overviewUX user-centered design process overview
UX user-centered design process overview
Dr. V Vorvoreanu
 
26 social interaction design
26 social interaction design26 social interaction design
26 social interaction design
Dr. V Vorvoreanu
 
Sketches wireframes mockups prototypes
Sketches wireframes mockups prototypesSketches wireframes mockups prototypes
Sketches wireframes mockups prototypes
Dr. V Vorvoreanu
 
Attention info scent recognition vs recall
Attention info scent recognition vs recallAttention info scent recognition vs recall
Attention info scent recognition vs recall
Dr. V Vorvoreanu
 

More from Dr. V Vorvoreanu (20)

Dia2 tues persona
Dia2 tues persona Dia2 tues persona
Dia2 tues persona
 
Dia2 sketches
Dia2 sketchesDia2 sketches
Dia2 sketches
 
DIA2 Design requirements presentation personas
DIA2 Design requirements presentation personasDIA2 Design requirements presentation personas
DIA2 Design requirements presentation personas
 
gestalt principles cats
gestalt principles catsgestalt principles cats
gestalt principles cats
 
07 principles 1 affordance
07 principles 1 affordance07 principles 1 affordance
07 principles 1 affordance
 
HCDD for ASEE 2015 presentation
HCDD for ASEE 2015 presentationHCDD for ASEE 2015 presentation
HCDD for ASEE 2015 presentation
 
Responsive design UX intro
Responsive design UX introResponsive design UX intro
Responsive design UX intro
 
Attention info scent recognition vs recall
Attention info scent recognition vs recallAttention info scent recognition vs recall
Attention info scent recognition vs recall
 
03 bad usability kills
03 bad usability kills03 bad usability kills
03 bad usability kills
 
Information architecture
Information architectureInformation architecture
Information architecture
 
UX Conceptual design - sketches, wireframes, mockups, prototypes
UX Conceptual design - sketches, wireframes, mockups, prototypesUX Conceptual design - sketches, wireframes, mockups, prototypes
UX Conceptual design - sketches, wireframes, mockups, prototypes
 
Cgt 256 course review
Cgt 256 course reviewCgt 256 course review
Cgt 256 course review
 
Cross channel ux
Cross channel uxCross channel ux
Cross channel ux
 
UX user-centered design process overview
UX user-centered design process overviewUX user-centered design process overview
UX user-centered design process overview
 
26 social interaction design
26 social interaction design26 social interaction design
26 social interaction design
 
Purdue MS degree CGT
Purdue MS degree CGTPurdue MS degree CGT
Purdue MS degree CGT
 
Sketches wireframes mockups prototypes
Sketches wireframes mockups prototypesSketches wireframes mockups prototypes
Sketches wireframes mockups prototypes
 
11 info architecture-2014
11 info architecture-201411 info architecture-2014
11 info architecture-2014
 
Attention info scent recognition vs recall
Attention info scent recognition vs recallAttention info scent recognition vs recall
Attention info scent recognition vs recall
 
Grids mini lecture
Grids mini lectureGrids mini lecture
Grids mini lecture
 

Grid examples lab exercise

  • 2. On each of the following slides, draw vertical lines that mark the margins of the columns. Like this. Specify the number of columns for each example with a text box annotation like the one below. 2