The Minimal Viable Web by Kristofer Layon

Posted on: by

Notes at Breaking Development :focus on responsive
Minneapolis, MN

Presentation Slides

This is more than about mobile.

Part 1: The Victorian Web

We started doing layouts in tables.

Zen Garden

The idea is you can take semantic markup and effect change. But looking at it now it seems like too much separation between content and presentation.

We seem to be so driven by the visual side.

The Victorian Web is very, very visual. This is seen in many other mediums e.g. Victorian architecture – lots of superfluous ornamentation , Victorian dress – very ornate.

We see in the mobile web, that the Victorian web is falling apart.

There are risks and how much do you want to take on.

The dike has broken on our web designs. We have tried to control our designs and they are inherently brittle.

Part 2: Modernism to the rescue

Form follows function.

Examples are simple. Can we learn from these other examples. Perhaps we do not need such ornate designs.

Criticism is that it is cold or too simple.

Part 3: Human Modernism – Focus on people

or the advent of user-centered product design

Best examples of human product centered design – new design of the London Underground. It was more than making a map easy to read, but also iconography.

Focus on type and abstract visually. Branding was a new design touch.

The London Underground example didn’t treat it as a technology it doesn’t discuss it.

Similar idea happened in fashion. “It is always better to be slightly underdressed” Coco Chanel

Simply designed.

Part 4: Mobile can help us make the web better

Maybe the mobile web is like packing a carry on vs a full-size suitcase

  • Some of the contents need to be packed differently
  • Other items need to be smaller or less bulky version
  • And sometimes you need to leave some things behind
    • But not the things we absolutely need.
      -Perhaps we didn’t need those other items at all.

What about designing for the mobile web?

  • Our purpose stays the same
  • our strategy changes
  • the solution is a mix of what we already have plus some new things
  • the result: more simple+ lightweight

It’s about the content stupid Stephanie Rieger

Mobile is simply shining a light on some of the things we should be thinking about.

Part 5: Web Product Management

Some things you can’t control for. No matter how much you test, you can’t test it all, so design for this reality.

We aren’t focused on what people need but on innovation for innovations sake.

Dan Cederholm is a good example of simplifying things.

We can do nothing, or do like Dan Cederholm says is ok to do, you don’t have to get it all right. Baby steps. (see Adapted)

Start by working on the base of human needs and working your way up (Maslow theory of human motivation)

A mobile version:

  • Base: See Content – Navigate
  • Readability & pinch+zoom
  • Respond & share
  • Performance
  • Tip: HTML5 local storage, web sockets, offline, transitions

Concentrate on the human priorities.

Not to say that there are only one set of priorities.

Be somewhat pragmatic, get mobile started, prioritize based on your situation.

  • group priorities
  • everything can’t be a priority

Product management is about managing priorities

Tool: Kano Model

  1. Basic attributes
  2. Performance
  3. Delight

Use charts/graphs to show progress. Executives like graphs.

You can’t assume how the Kano attributes rank based on you the designer. Who people are, time, manner, place all matter.

Start with basic priorities, don’t over design. Don’t try to do everything under the sun.

Minimal viable web design

  • Start with people
  • Design from your content out
  • The best visual design is the least amount that is necessary
  • Iterate and add only if people need more
  • The result: simple+lightweight

Web product management

  • Get away form your desk talk to people
  • Write user stories
  • Road map your product