ah teaches information design (Structuring Content lecture)

Structuring Content

Lecture outline

Thinking about layout and structure to direct movement through content. Lecture slides will be made available on the day of the lecture (September 16).

In preparation for lecture...

Please close up any laptops, cellphones, N64s, Apollo Neuros and other 'beep-boop' devices.

Critique

Critique is a communication skill. Effective critique requires reading/listening, responding, and practice.

Bias

"[Our] perspectives are coloured by our habits, beliefs, and attitudes."

Effective critique is...

• Purposeful: Has a clear statement or goal.
• Specific: Identifies a particular strength/weakness (not speaking in generalities).
• Language appropriate: Uses language understood by the audience.
• Practical/action-oriented: There is something to do or think about.
• Timely: The type of feedback given makes sense for the stage of work.

Ineffective critique is...

• Absolute: Providing no potential direction for solving the problem.
• Not contextualized: Speaking your own opinion without stating so.
• Not clarified: Talks to work without understanding what it is about.
• Uninvited: Given without being requested or expected.
• Needlessly vulgar: Swearing unnecessarily.

Critique context

Before giving critique, it is always important that you understand what the project is, and where it is at. This helps ensure your feedback will be timely and purposeful.

Today's critique

A reminder that we are looking for our critique to:

• Have a clear statement or goal.
• Identify a particular strength/weakness (not speaking in generalities).
• Offer something to do or think about.
• Is appropriate for the work we are looking at.

Today's critique

Our approach

We will be taking the 'I like/I wish' approach for today's critique: Please start each critique with either 'I like' or 'I wish'.

Good content structure

Good content structure helps direct and guide a viewer through the content actively. We are going to recap a number of design fundamentals that help us build better structures.

Sequence of cognition

A simplified overview for the purposes of our class:

First is shape.

Second is colour.

We will skip this one for now as limited colour is used in the first project.

Third is form.

Building Relationships

Gestalt theory offers us tools for building meaningful visual relationships.

Proximity

Gestalt theory

Things that are closer are more related.

Similarity

Gestalt theory

Things that are similar are more related.

Continuance

Gestalt theory

We will build relationships between things that track along an expected line.

Space

Design practice

Helps to clarify relationships and direct attention.

Let's sketch

You have 5 minutes.

Order of cognition continued

1. Basics: colour, depth, form
2. Grouping: Gestalt
3. Memory: connections
4. Recognition: connections applied and understood

Connections and Humans

We're lazy, er, or efficient

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

Useful content

Our content should fulfill a clear and specific purpose for the user.

Labels

Consider in what context the buttons below make sense (or not).

Labelling

When you are creating new titling and categories remember the considerations of good labelling:

• Be clear: Use straight-forward unambiguous language.
• Be specific: Make sure categories are specific and not 'catch-alls'.
• Be inclusive: The terms used sould be accessible and welcoming of all.
• Be consistent: Use similar syntax and terminology.

Images, video, and audio are content too

Just like we think about text user experience, we can also think about photo experience (or video, audio...)

Content should be user-centered

We want our content to focused on what the user needs or understands.

P1 critique

Should anyone be willing to share their P1 for public critique, please let me know during the break.

To Figma!

Let's get you ready for continuing working on P1 with a tutorial covering:

• How to make frames
• How to add type
• How to add grid structures
• Viewing the prototype
• Sharing the project

Homework review

Things to work on this week:

• Submit your sketching exercise before 8am on Monday (Sept 22).
• Work on your project and bring your deliverables to class next week.

Next week: An introduction to interaction design and wireframing

Critique time

During this time you can:

• Complete the in-class activity
• Work on project deliverables or the sketching exercise
• Go grab a lunch/snack

Once done the in-class activity and critique you are free to go for the day.