4-corners sketching

Updated on Saturday, August 12, 2023

For an interface, a method to document and understand the interface's target user, their task, the previous and next steps, and the content and functionality needed to support the user.

Picture this. You and your team are designing screens. You know what screens you want to design, but how do you make sure the screens are designed the right way?

When you sketch or design an interface, the image may look fantastic. Yet, it's tough to know how good the interface is because it's not clear who you designed it for, why, and how it fits into what the user is doing.

Difficulty	Anyone can do this
Participants	Up to 6 with or without experience
Time	45 minutes (in-person), 1 hour (remote)
Materials	a way to collect ideas, a place to collect them, and some way to sketch

4-corners is an easy way to explain to your team the why behind an interface. Whether you're sketching or delivering high fidelity visual comps, 4-corners helps people describe why they designed the things they designed.

4-corners is a simple way to tweak your process that anyone at any level can use to improve any sketch or comp. Use 4-corners to help when you collaborate on sketches at the whiteboard or to supplement a comp to preserve your rationale, so it's clear when someone looks at it later.

How it works

4-corners is an Interface method to make decisions about interface features and their priority. It uses brainstorming and prioritization to list users, tasks, content and functionality before sketching to design the interface.

Identify the target user, their task, and context
Identify content and functionality to support the above
Sketch the interface

The brainstorming and prioritization help you capture the thinking you need to design a good interface and the sketch documents all your decisions. You can even go straight from 4-corners sketching into development.

When to use

Designed for anyone at any level

4-corners was developed for workshops with participants with no design skills, and it's been used by everyone from QA analysts to executives, developers to marketers. It's designed to be easy to teach, easy to set-up, and easy to do.

Perfect for sketching

4-corners was developed to support collaborative sketching and works great adding just a few scribbles to whatever you're sketching. This speed and ease make it an ideal companion when you're rapidly sketching multiple variations of an interface.

Makes for easy annotations for wireframes and comps

The simplicity of 4-corners make it an easy way to annotate wireframes and comps with just enough information without requiring detailed annotations about everything on the interface.

Alternatives to consider

Maybe 4-corners doesn't include enough information. If you need more or more detailed information, consider full annotation of your interface models.

If you're moving quickly and sketching lots of variations of the same interface, you can document the 4-corners once and reference it for each sketch. This is useful in activities like Crazy Eights or 6-8-5 sketching.

What you need

Inputs

Start with a blank slate, or
Start with pre-collected list of tasks, content, or functionality

Outputs

A sketched interface
List of relevant users
List of tasks the interface supports
List of content and functionality appearing on the interface
Previous and next steps for the interface

Participants

Use on your own
Up to 12 participants
For more than 12, split into groups

Materials

Some way to collect ideas
Somewhere to collect them like a dry erase board or physical or digital wall
A place to draft the interface like a piece of paper or whiteboard or your favorite graphic software

Templates and facilitation materials

Download 4-corners interface sketching template and facilitation guide

4-corners.pptx (269.12 kB). Last modified 06/27/20

Download

Learn more

The following resources provide more information about using this method.

Book cover for Collaborative Product Design by Austin Govella

Facilitation tips and instructions

Austin Govella provides detailed instructions and facilitation tips for 4-Corners in chapter 18 of his book, Collaborative Product Design. You can view chapter 18 online via O’Reilly’s Safari Books. Chapter 18 includes detail on variations and alternatives for using this method.

Facilitation tips and instructions in Portuguese - 4 Cantos - Técnica para criação de Interfaces do livro Collaborative Product Design

Daniel Furtado provides detailed instructions and facilitation tips in Portuguese for 4-Corners in a video for his YouTube channel, UXNow. His resources include a PDF canvas, presentation guide, and a canvas in Figma.