IAT-102: 11 Getting Interactive

IAT-102: 11 Getting Interactive — A slide deck

<<<<<<< HEAD

Getting Interactive

Lecture outline

In this week's lecture

  • Designing interaction
  • Interactive media

Lecture slides will be available the morning of the lecture.

Close All Laptops Please

Only the back row may use laptops during lecture.

IAT-102 — P05: Portfolio

Getting Interactive

The Old Rules Still Apply

Design Principles

Let's take a look at how the CBC uses colour and works with scale to create hierarchy in their design.

Gestalt

Let's take a look at how Google uses Gestalt principles to clarify relationships.

The Web is 95% Typography

Whitespace

Let's recap your reading on Horror Vacui for a moment.

Delight in Design

"There is a tendency to think that to delight someone with design is to make them happy. Indeed, the work may do that, but more appropriately, the object is to produce a memorable experience because of its superior fit."
Frank Chimero
Adam Hartwig
The audiences for the portfolio project

Connections and Humans

We're lazy, er, or efficient

"...users have time to read [on average] 20% of words on a page."
Nielson-Norman Group

Patterns and Chunking

Giving us consistent and reasonable chunks of information makes it easier for us to use.

User Expectations

What they have experienced before

"Users spend most of their time on other websites."
Jakob's Law of the Web User Experience

Fulfilling a Need

first goal for every web project isfulfilling a need.will have less than 20 seconds to convince an employer or client that your website is 'the one'.

What might help convince them your portfolio is 'the one'?

Experience

You want to craft a usable, accessible, and pleasurable experience for your audience.

Making it Usable

Thinking about context

This is a link. But how do you know that?

Making it Interactive

Buttons

A series of web buttons
A series of different download buttons

Keeping Up With the Jones

Flat design is... good? bad? ugly? gorgeous?

A series of flat UI elements

The Fluidity Problem

The web is not a fixed medium, as much as you may wish otherwise. As designers, we must embrace this.

Human Search Engines

We are the search engines. Google is just a tool. This is why effective navigation is key in effective design of websites.

How We Navigate

Some considerations:

  • We're lazy (make it easy)
  • We're efficient (make it quick)
  • We search (make it findable)
  • We click (give us directions)

What kind of design considerations might apply to making our navigation more usable?

Affordances

Interaction points should clearly indicate they are interactive.

The Peer Review for your Process Analysis is due in this weeks lab!

Critique Quiz

next week's labs we will be doing the critique quiz. It is important that you prepare for this quiz by reviewing the language and skills we have discussed in the course so far.

Next week we're going to get ethical.

Contacting Andrew

Your Lecturer

Reachable at:

  • Office hours — Mondays from 8:30-9:30am and Thursdays from 8:30-9:30am at the Surrey campus mezzanine.
  • ac.ufs@h_werdna
=======

Getting Interactive

Lecture outline

In this week's lecture

  • Designing interaction
  • Interactive media

Lecture slides will be available the morning of the lecture.

Close All Laptops Please

Only the back row may use laptops during lecture.

A dropdown icon in its inactive and active states
What are some advantages and disadvantages to using this?
An image that only shows more information when hovered
What are some advantages and disadvantages to using this?
A series of hover states using colour
What are some advantages and disadvantages to using this?
IAT-102 — P05: Portfolio

Getting Interactive

The Old Rules Still Apply

Design Principles

Let's take a look at how the CBC uses colour and works with scale to create hierarchy in their design.

Gestalt

Let's take a look at how Google uses Gestalt principles to clarify relationships.

The Web is 95% Typography

Whitespace

Let's recap your reading on Horror Vacui for a moment.

An illustration of two layouts, one more visually 'uncomfortable' than the other
Care of Creativity is Not Design

Whitespace is Not Evil

'Let's stay at the table'

Minister George said he's not surprised by the results.

"We have had and felt the pressure to get a settlement since last September, I feel no more pressure tonight after this than I did yesterday," George told the news.

The minister also issued a statement reacting to news of the vote.

"While the leadership received the mandate they sought, no one should interpret this as any kind of enthusiasm on the part of them to shut down," said the statement.

Passive Whitespace

Important for helping balance and hierarchy.

'Let's stay at the table'

Minister George said he's not surprised by the results.

"We have had and felt the pressure to get a settlement since last September, I feel no more pressure tonight after this than I did yesterday," George told the news.

The minister also issued a statement reacting to news of the vote.

"While the leadership received the mandate they sought, no one should interpret this as any kind of enthusiasm on the part of them to shut down," said the statement.

Active Whitespace

Useful for focusing attention or clarifying hierarchy.

'Let's stay at the table'

Minister George said he's not surprised by the results.

"We have had and felt the pressure to get a settlement since last September, I feel no more pressure tonight after this than I did yesterday," George told the news.

The minister also issued a statement reacting to news of the vote.

"While the leadership received the mandate they sought, no one should interpret this as any kind of enthusiasm on the part of them to shut down," said the statement.

Delight in Design

"There is a tendency to think that to delight someone with design is to make them happy. Indeed, the work may do that, but more appropriately, the object is to produce a memorable experience because of its superior fit."
Frank Chimero
Adam Hartwig
The audiences for the portfolio project

Connections and Humans

We're lazy, er, or efficient

"...users have time to read [on average] 20% of words on a page."
Nielson-Norman Group

Patterns and Chunking

Giving us consistent and reasonable chunks of information makes it easier for us to use.

Make Effective Hierarchies

MAJOR Headline
(Museo 300)

Subtitle of Awesome
(Bosque)

Body copy lorem ipsum dolor set imagine the type possibilities as this continues to flow into the next line... so exciting!
(Georgia)

User Expectations

What they have experienced before

"Users spend most of their time on other websites."
Jakob's Law of the Web User Experience

Fulfilling a Need

first goal for every web project isfulfilling a need.will have less than 20 seconds to convince an employer or client that your website is 'the one'.

What might help convince them your portfolio is 'the one'?

Experience

You want to craft a usable, accessible, and pleasurable experience for your audience.

Making it Usable

Thinking about context

This is a link. But how do you know that?

Making it Interactive

Buttons

A series of web buttons
A series of different download buttons

Keeping Up With the Jones

Flat design is... good? bad? ugly? gorgeous?

A series of flat UI elements

The Fluidity Problem

The web is not a fixed medium, as much as you may wish otherwise. As designers, we must embrace this.

Human Search Engines

We are the search engines. Google is just a tool. This is why effective navigation is key in effective design of websites.

How We Navigate

Some considerations:

  • We're lazy (make it easy)
  • We're efficient (make it quick)
  • We search (make it findable)
  • We click (give us directions)

What kind of design considerations might apply to making our navigation more usable?

Affordances

Interaction points should clearly indicate they are interactive.

The Peer Review for your Process Analysis is due in this weeks lab!

Critique Quiz

next week's labs we will be doing the critique quiz. It is important that you prepare for this quiz by reviewing the language and skills we have discussed in the course so far.

Next week we're going to get ethical.

Contacting Andrew

Your Lecturer

Reachable at:

  • Office hours — Mondays from 8:30-9:30am and Thursdays from 8:30-9:30am at the Surrey campus mezzanine.
  • ac.ufs@h_werdna
>>>>>>> 1e7f29527a38bea9c7203656e8f70aff540171c7
1/1