OddBird

Web Application Design & Development

Young OddBirds

Featured Clients

Art from Riding SideSaddle*

Dark Raspberry

anywhere between maroon and magenta…

Designing Software!

iMac

iPhone

Iphones

All the devices

The Web is User-Centered

the printing press is creator-centered

👨

masc

femme

rando

“The fact we can control a paper page is really a limitation of that medium.”

—John Allsopp, A Dao of Web Design (April 07, 2000)

What are the Tradeoffs?

Open box with notecards

“The ‘collectible’ is because sometimes you want to treasure the book and touch the book and know that you have a special one.

—Seth Godin, Transforming the Book Industry

Multimedia Process…

  1. Define the Idea & Boundaries

  2. Generate Material

  3. Organize Structure

  4. Draft

  5. Revise

(iterate…)

Performative Turn

Sidesaddle Text

Open box with notecards

Teacup Gorilla at Syntax Physic Opera

Teacup Gorilla: The Holes They Leave

Art from Riding SideSaddle*

True West Award

Web as Performance

Content First

Markup

Screenshot of miriamsuzanne.com

“Looks pretty cool, but having the menu and the text rotated like that just makes them super difficult to read…”

—Dude, Online

¯\_(ツ)_/¯

Know Your Innovation Budget

Know Your Goals

click-through rates are not universal success

A Queer Theory Primer

[the oversimplified version]

Strange” or “Peculiar

1800’s: becomes a (sexual) insult

1980’s/90’s: Reclaimed

A big tent movement

"We’re all the same"

We’re all different

…but our struggles intersect…

“We’re normal too”

“Normal” is suspect

“Do I want to create work in which everyone feels the same, or everyone feels differently?”

—Anne Bogart, A Director Prepares

Use All The Tools

Unison, Harmony, Dissonance

OddBird:

Solve Real Problems for Real Users

rando

Start with Users

They know more about their needs than you do.

Most Abused Quote…

“If I had asked people what they wanted, they would have said faster horses.”

Henry Ford John McNeece (kinda)

Douglas Engelbart

1968: The Mother of All Demos


(the mouse, hypertext, view switching, networked computers, early GUI)

Bootstrapping

“The creation of tools for expert users”

Augmenting Human Intellect

"Providing the means for users to create better tools."

“You cannot create results. You can only create conditions in which something might happen.

—Ann Bogart, A Director Prepares

Steve Jobs

1976: Apple I

Identical, Easy-to-Use, Low-Cost appliance

Invisible” closed interfaces (the "just work")

What Are the Tradeoffs?

User Expertise:

  1. End Goals

  2. Existing Solutions

  3. Points of Failure

User Blind Spots:

  1. Interface Design

Ask about Problems, not Solutions

works with art feedback as well…

When the Problem is in Act V

The Solution is Often in Act I

Always Ask Why

look for the root causes…

Analyze Patterns

common pain-points, related issues, etc…

Present Context & Tradeoffs

establish yourself as a teammate

Only Show Good Options

mind games always backfire

Recognize Personal Bias

Dark Raspberry

anywhere between maroon and magenta…

Less Theory, More Practice

Less Mockups, More Code

Quarq Race Intelligence

How Does it Move & Adapt?

Responsive Design

Design & Code are Inseparable

QuarqNet

QN Activity sketch

QN list sketch

QN map sketch

<CODE>

Early QN

Friends sketches

Ugly Helps Communicate

Interactive Mockups

<CODE>

QuarqNet

Iterate on Features/Epics

sketch » wireframe » html markup » backend logic » design

Test, Test, Test

Tight Feedback Loop

Open box with notecards

Document Systems

and use shorthand

Color preview screenshot with three colors and their values

Herman Ratios

Herman Text Sizes

Preview of size patterns

Herman Icons

Buttons

Documentation:

Accurate > Complete

Website like Legos
Put your helmet on

Dragons

When In Doubt, Test