Tag Archives: atmedia2008

Building on the shoulders of Giants, Jonathan Snook [@media 2008 notes]


Image by SuLeS via Flickr

It’s a talk mostly about API, Mashups, Frameworks etc.

He wrote a really nice Twitter client – Snitter in Adobe AIR.

He’s also behind MyMileMarker, RoR

DjangoPlugables.com, a framework to manage plugins that tie into Django

Overheard.it, tracking what people say on twitter, and every-time some says “overheard”

Developers like to reinvent the wheel, it’s not necessarily a bad thing, it’s how we learn.

A nice matrix of LightBox scripts, lots of different ways. People like to reinvent this thing.

Designers on the other hand, like to reuse. We have things like design trends because designers like to take what they see. We wouldn’t get the whole “Web 2.0”, if designers wouldn’t use the same things from project to project. They know what works and they build on top of it.

Developers need to think more like designers.



  • Ruby on Rails
  • Django
  • CakePHP
  • CodeIgniter
  • ZendFramework
  • Etc.

But the point is that you can take any of these frameworks and build applications really good and fast on top of it.


  • JQuery
  • Prototype
  • ExtJS
  • Mootools
  • YUI
  • Dojo


  • Meyer Reset
  • YUI CSS Grids
  • Blueprint (it’s not only a grid, but also base typography)
  • 960.gs


  • Adobe AIR/Flash/Flex
  • Microsoft WPF/Silverlight
  • Java/JavaFX

Language of Markups:



It’s not one technology vs. Other stuff. We can mash.

So we can do in flash:

  • Built-in Socket support
  • Flash/JavaScript bridge (we can do cross-domain calls)
  • Binary transfer format
  • Charting, IMAP and other
  • SoundManager / sIFR / File Upload

Types of Data

How can we look a the data, to help us mash up even better.


  • Maps (Google, Yahoo, Microsoft)
  • Crime Database (Everyblock)
  • Real Estate (Trulia)
  • GPS
  • FireEagle
  • BrightKite (tying into FireEagle, it’s possible to push and pull data around)


(Everything has a timestamp on it)


  • Social networks (flickr, twitter, jaiku, youtube, digg)
  • LinkedIn


“Dynamic APIs” . The problem is that Twitter API is not static, it’s changing. Even though they have cool stuff, they’re disabling functionality because their servers are full. This can break your application, and this is really frustrating for developers.

Service Availability. You have to consider that things will go down.

You become middleman, so if you build a FlickR application and it goes down, people will blame you and not Flickr.

Well-tested, so if you use a reliable wide used stuff you know that you won’t have to worry about implementation detail.

Speed up development, you can build up applications very quickly and easily.

Solve problems outside of original solution, original solutions don’t necessarily tailor to the different people. One example of this is Accessibility.

It’s about IDEAS! It’s about solving problems that fit your business needs and your personal itches.


Get them out fast

Iterate fast and often

See what works

How fast?

Push out ideas in hours, instead of days, weeks, or months.

DjangoPlugables – it took about 3 days to build a site and put it out there. It’s just a matter of build the idea, put it out there, and then see what people want.

You can DO IT!

Mental Models: Sparking creativity through empathy, Indi Young [@media 2008 notes]

Di prima mattina

Image from Flickr

How do we make the data actionable? We get lot of data in form of demographics and our audience. “12% of movie goers preffer to go movies alone.” How do we figure out what to do with this piece of data?

Answering questions about Mental models. What’s a mental model, how do I use it, how do I decide to make a model, or not? Etc.

What is a mental model?

It’s a diagram of underlying reasons that drive people’s behavior. You match it in the ways you support people with your product.

What does a mental model look like?

Source: Rosenfeld media @ flickr
[It’s a long piece of paper, long narrow diagram]

Mental models are very closely tight to the kinds of audience you’re designing for.


Above the line, you have little boxes that describe: behavior, philosophy, feeling
Then you group them in a “tower” – conceptual group. You get a sort of skyline. A lot of people’s voices can be represented in the boxes and then combining all the towers together in mental spaces. The language above the line are verbs and it’s really colloquial.

Bellow the line, there are ways to support the tower.
Purple below the line – a pretty strong connection between product and what people are trying to do with the tower.
White box below the line – kind of aligned but not really.

You get data on top of data by using:

  • Field data
  • Interviews
  • Customer feedback
  • Call center recording
  • Card sort data
  • Voice of the customer

Mental models sits inside the nest of all the other user experience processes. You can make personas, scenarios and all sorts of task based audience separation out of it. It’s just a different visualization that keeps track of things.

  • Mental models show people that they need to develop separate application for separate sets of people.
  • The other ulterior motive, actually get things slated for the mythical phase 2.
  • Focus on customers, not internal organizations/categories
  • Get rid of stuff that doesn’t help.
  • Give stakeholders something that feels actionable.


Can it resolve some of the problems my team has?

Problem: We struggle to agree on a common design (everyone has a different opinion)
Mental model is an independent research model, that allows you to agree on interpretations of the field data.

Problem: We have difficulty taking off our employee hat
Helps you figure out what customers want.

Problem: We cross our fingers that the design will be successful
Mental models helps you in a way that gives you lots of confidence up at the start.

Problem: we worry we might have missed some part of the “whole user experience”
Problem: we wish we could attract loyal, adoring fans.

Mental models solve all this 😉

Source: Rosenfeld media @ flickr

We all hear stories, and when we hear a story, it helps us understand a situation that this person is in. And when you emphasize with someone, you can play their role and then you can understand the depth at which they are operating and it makes your decisions much easier.

Hear stories -> Feel empathy -> Deep understanding


How do I decide to make a mental model, or not?

It’s a “generative type of research”, it’s an mental environment in which things get done. You want it to use it for your Interaction design.

Mental models are Not Used for:

  • Evaluating usability
  • Showing cyclical relationships
  • Depicting detailed process flow
  • Creating art (composing, painting, …)

What do I put in a mental model?

Behavior, philosophy, feeling    vs.  Direct, implied, third party. You need to have good skills at reading between the lines.

Why focus on emotion?

“Distrust” is an emotion and it’s something that is really important to be aware of.

The hallway test: “what is she thinking while walking down the hallway.” Trying to focus on a higher level: “I’ve got to get report done, or I won’t be able to go to the movies.”

How can I do this by myself?

Yes, there are number of shortcuts you can use:

  • Rough sketch
  • Rough draft: 1 day, 1 conference room, lots of coffee and chocolate
  • Rough notes: do your analysis on the fly, while you’re talking to people. You write tasks, and emotions on sticky notes on the fly.
  • Fly Under the Radar
  • Piggyback on Other Research: add another half-hour to User research

How do mental models fit the agile principles:

  • Synchronize UX with development
  • Separate modeling from design
  • Increase design literacy
  • Design on the whiteboard with developers, stakeholders
  • Strip documentation
  • [One more]

How can I use mental model to innovate?

Innovation is something that is not forced. It’s something that is understandable, when you make a brand new flashlight, people won’t get it since it’s too different. Innovation occurs while you’re crafting details. The innovation needs to focus on people, and it’s long term.

Look at the mental model for possibilities:

  • Find a gap below the line to fill
  • Look for scarce of Weak Support
  • Redefine & augment existing features to better match
  • Combine related behaviors and features
  • Look for surprises
  • Look for emotions
  • Examine spaces formerly crossed out
  • [Two more]


Book: Mental models