Interaction Design: Structure

40mIntermediate2019-07-29

Authors

Diane Cronenwett

Specializing in solving complex design problems

Course details

Before UX designers can move on to anything else, they must think holistically about the structure of their project, determining how every element—no matter how small—fits into the overall experience. In this course, Diane Cronenwett delves into the role of structure in interaction design. Diane explains how the process of defining a project's structure helps designers see the big picture (and organize project elements in a more thoughtful way). She goes over when to use flow diagrams in UX design projects, as well as how to create information architecture deliverables. Plus, learn how to design page-level structure, organize projects with a grid, determine the right interface elements needed put everything together, and more.

Learning objectives
The role of information architecture in UX design
Navigation labels and content inventory
Information density in interface design
Setting up and using a grid system
Establishing the goals of a site
Creating flow diagrams
Iterating through multiple layouts

Skills covered

SketchBohemianInteraction DesignUser ExperienceDeep Dive (X:Y)

Concepts

0. Introduction

01 - Structure is the backbone of UX

1. Understanding Structure

02 - Understanding the big picture
03 - Defining different structural flows
04 - Role of information architecture
05 - Defining information architecture
06 - Navigation labels and content inventory

2. Designing Page-Level Structure

07 - Information scent and hierarchy
08 - Overview of page-level elements
09 - Overview of information density
10 - Organizing with a grid

3. Interface Design Considerations

11 - Sitemap and flow diagram
12 - Establishing the goals of the site
13 - Layout, hierarchy, and grouping
14 - Headings and content
15 - Iterating through layouts
16 - Determining the right interface elements to put it all together

Conclusion

17 - Next steps