UX Prototyping:
Sketching

Mick McQuaid

2024-01-30

Week THREE

Recap

• sketches: mostly terrific, raises issue of how to sharpen your skills
• sketches: some appeared to use iPad—is that the best approach?
• sketches: different styles for graphical self-intro vs good design
• accessibility reports: well done (only one so far), used a lot of good techniques to convey information
• three things: act fast, think slow, energize yourself

project ideas

idea rejected, then reconsidered

• presented idea was to help women seeking abortions in Texas
• rejected because it seemed like more of a privacy and security issue than a UX issue
• reconsidered because I then researched it and found UX issues
• e.g., websites to help undocumented migrants assume literacy and often English literacy
• two synergistic groups: drivers and patients

project inspiration

orange sky

sugar shack

unbreakable

pause for project ideas

mood boards

What is a mood board?

• Collage
• Images
• Typography
• Color palettes
• Conveys a strong impression
• Can be checked by asking people what they see

Why a mood board, according to 99designs

• Inspiration
• Affirmation
• Guidance
• Communication

Images (again 99designs)

Both images convey melancholy but uplifted, somehow.

Color palettes (again 99designs)

Visual metaphors (from 99designs)

And more

• Words
• Letters
• Textures
• Patterns
• Shapes

Result

Milanote Mood Board

THere are even apps for designing mood boards, such as Milanote.

Mood Board for a Law Firm

People make mood boards for all kinds of things, even law firms!

〈make your own mood board〉

design inspiration

• Where did you get the inspiration for your mood board?
• Where do you get inspiration in general?
• Where do you want to get inspiration?

A whole new mind

• Keep a sketchbook
• Read design magazines
• Be like Karim
• Become a design detective
• Visit a design museum

Keep a sketchbook

Read design magazines

Linkrot, anyone?

• Ambidextrous (not found)
• Dwell (www.dwell.com)
• How (went bankrupt 2019)
• i-D (bought but exists i-d.vice.com)
• Metropolis (metropolismag.com)
• O (oprah.com)
• Print (www.printmag.com)
• Real Simple (www.realsimple.com)

Be like Karim

Karim directives (excerpt)

• Don’t specialize
• Before giving birth to anything physical, ask yourself if you have created an original idea, an original concept, if there is any real value in what you disseminate.
• Know everything about the history of your profession and then forget it all when you design something new.
• Never say “I could have done that” because you didn’t.
• Consume experiences, not things.

• Normal is not good.
• There are three types of beings—those who create culture, those who buy culture, and those who don’t give a shit about culture. Move between the first two.
• Think extensively, not intensively.
• Experience is the most important part of living, and the ex- change of ideas and human contact is all life really is. Space and objects can encourage increased experiences or distract from our experiences.
• Here and now is all we got

More Karim

Become a design detective

• Visit open houses
• Make it a group project
• Compare notes at the end regarding current design trends

Visit a design museum

I visited the Palacio de Bella Artes in Mexico City in 2012. It’s not a design museum specifically, but it did give me a lot of design inspiration nonetheless.

At the time, they were featuring an exhibition on Edvard Münch, as well as this exhibition about a trip by Borges to Mexico.

The museum features a lot of work by Diego Rivera, including this admittedly overexposed mural.

This mural by Diego Rivera was in the same room as the previous one.

And this mural was in the street, at a construction site.

On the same trip, I visited some of the homes of Frida Kahlo and Diego Rivera which have been converted into museums. I think this is the only one where I got pictures.

This is the view you see when you first enter the gate.

This is Frida Kahlo’s desk. I love to see the working environments of artists and I took a number of photographs of her workspace, a few of which follow.

A closeup of one of her sketchbooks …

Here are the pastels and inks on the right side of her desk.

Here are some pigments and brushes sitting on the left.

Here is part of Frida’s kitchen.

This is part of a larger exhibit, where this shows her color palette for the project.

This is a view of Kidzania, a working city for children with branches in Mexico City, Dallas, and, I think, a few other places. Here the children are getting dressed in preparation to work as painters.

Sketching

• Easy enough to say just do it
• Nothing works like conscientious practice
• Once inspired, what keeps you going?
• Try Dodson (2006)
• Try the five minute plan

Crazy eights

How to do it

• Choose a site or app to work on
• Make a list of screens needed
• Fold a large sheet into 8 squares
• Quickly draw a screen on each square (one minute per screen)
• Can be one screen eight times or eight diff screens or a combo

Develop your own shorthand

For example

• a boxed x means a photo
• a circle means an icon
• a straight line means a headline
• a squiggly line means body copy

Pause for video

〈do your own crazy eights〉

Use this bash code to give one minute to each panel; change 60 to 120 to give two minutes per panel

for i in $(seq 0 8); do printf "\a\n$i"; sleep 60; done

milestone 2

References

Dodson, Bert. 2006. Keys to Drawing with Imagination. Cincinnati, OH: North Light.

END

Colophon

This slideshow was produced using quarto

Fonts are League Gothic and Lato