Dear reader,

A caveat.

Everything posted here is worth thinking about. On the other hand, the ideas and opinions put forth may not be right.

Curated and annotated by Timoni West.

Posts about web design
January 29th, 2014
In Movie OS, visual storytelling is used to make the system’s important, critical reaction to a user’s action abundantly clear. In Movie OS, you know if you’re logging into Facebook. I’d argue that visual storytelling doesn’t exist – if it does, it hardly exists at all – in computer or consumer eletronics user interfaces. The entire palette of visual storytelling in terms of interface, through accident of history, is purely engineering and control-led. This is where, I’d say, Apple is grasping when it says that interfaces should sometimes look toward real-life objects. Real-life physical objects have affordances that are used in effective visual storytelling – and animation – that can be used well to make clear the consequences of actions. It’s more complicated than that, though, and it can go horribly wrong as well as right.

The future is Movie OS : Extenuating Circumstances

I quoted this in part because it was written in 2010, years before animation became the main affordance indicator on the average handheld device.

January 13th, 2014
Pure, flat design doesn’t just get rid of dead weight. It shifts a burden. What once was information in the world, information borne by the interface, is now information in users’ heads, information borne by them. That in-head information is faster to access, but it does require that our users become responsible for learning it, remembering it, and keeping it up to date. Is the scroll direction up or down this release? Does swipe work here? Well I guess you can damned well try it and see.
November 20th, 2013
I’ve worked on a several responsive projects in the past couple years, and it’s always been a headache—not from technological limitations, but because there weren’t suitable words to describe the behaviors I wanted. I had to jump into code, and waste time writing non-production markup and CSS to prototype a behavior so the developer could see it. That’s really wasteful, especially if all you needed was a word for the behavior. The community has been putting a lot of effort in developing tools that allow for quicker prototyping, but explaining yourself can happen multiple ways. Clear wording with consistent meaning reduces the number of prototypes you need to build, because a simple word will do. We need to work as a community to develop a language of transformation so we can talk to one another. And we probably need to steal these words from places like animation, theater, puppetry, dance, and choreography.
March 27th, 2013
In our industry, you’ll often hear people say things like “if someone can’t figure it out in 10 seconds then they’re gone.” Or “I checked out the site and I couldn’t figure out what they did so I left. Terrible design.” Or “if it takes more than a couple sentences to explain it then it’s not simple enough.” Or “too much to read!” Or “there are too many fields on this form!” Or “there are too many steps in this process.”
I’ve said some of these things in the past, so I understand the knee-jerk impulse that lead to these sorts of reactions.
However, something’s usually missing from these assessments of the situation: The actual customer’s motivation. How motivated is the customer to solve their problem? What are they here for?

A loose rant on motivation and evaluation by Jason Fried of 37signals

Excellent post, though I’m a bit disconcerted that Fried just realized designers have to factor in the viewer’s motivation when assessing dropoff rates.

March 25th, 2013

West: There is a whole class of gesture-based functionality, basically, that mobile apps are trying to take advantage of, which is fantastic. Now on Foursquare, when you pull down on a venue, it checks you in without you having to tap the screen. It’s a power user feature we tell people about—it’s very rare you accidentally do it. Plus, a little bit of a learning curve isn’t that bad. A lot of web gurus say it’s bad if there’s any kind of learning curve or tutorial needed, but I disagree. We’re making the standards. This is the time when we’re figuring out what the best practice is.

Disabato: It’s funny, I’ll see people much younger than myself having no problem learning totally new interaction models on these interfaces when they aren’t given any help. I’ll see people my age or older, I’m 31, they’ll struggle and won’t be able to do anything on it, and they’ll need help.

West: We already have a mental model, or muscle memory, tripping us up. I have an Xbox, and I always had Nintendo before, so I keep wanting to hit A and B all the time. If I was a five year old, I would have no issues.

Disabato: I think you might start seeing apps that are experimental for their own sake. They do very weird things with gestures, they’re not really serious labored endeavors, but they’re something you can play with and understand the limitations of the medium. You see that a lot with game design and sound apps, music generation apps, that sort of stuff, where it’s just this weird set of graphics you play around with, like [sound toy app] Pluto Pluto. The more people actually use them, the more you’ll start to understand there’s way more to design than what Apple proscribes in their interface guidelines.

March 21st, 2013

…I’ve had a bit of trouble wrapping my head around what it is a UX Designer actually does for some time now, and I keep coming back to the same conclusion; a User Experience Designer doesn’t do anything special. They’re just a designer.

…A great designer should have a solid understanding of the psychological effects of their designs on top of all the typographic, colour, and layout techniques they use on a daily basis. Each decision in those categories will have an effect on the overall user experience, and we should be conscious of those effects. User experience is not something that should be considered separately from any design processes, let alone given a separate job description or department. User experience design is just design. Whether you’re designing a static mockup for a website, or considering the psychological effect of a particular user flow, you’re designing.

March 20th, 2013

Don’t be afraid to teach interactions.

(The Twitter conversations that inspired this post can be found here and here (ish).)

A couple of weeks ago, I was using the latest version of the Rdio app and realized that I had no idea how to put a song into a playlist. After hopelessly tapping around, I got a bit annoyed and posted a tweet asking if anyone had figured it out, which is my standard reaction when things aren’t immediately obvious in apps.

But then I thought about an interaction that we’d recently put into place at Foursquare, the long tap checkin. So, curious, I held down my finger on the song title. Lo and behold, a whole set of song action options popped up, including Add to Playlist. Excellent! I added the song and went on my merry way.

Fast-forward a couple of weeks and my friend Keith is also complaining on Twitter about how he can’t find key features in Rdio. People mention the long tap, but it’s obvious there’s a problem; the menu is undiscoverable. The long tap is a graceful solution, but it’s a hidden solution: Rdio needs to teach us.

This illustrates an interesting tension in interaction design. On the one hand, designers want to make obvious interfaces—on some level, in fact, we’re looking to create the Holy Grail of interaction design: apps so fluid, so intuitive, that people naturally have an ‘a-ha’ moment, and there’s never a sense of frustration during onboarding. And that’s great; that’s an amazing goal, and I hope we achieve it.

But at this point in technology, especially with gestural-based stuff, we’re not only working out the kinks, we’re working with a lot of technological, physical disadvantages. For example, there’s no mass commercial computer interface as simple, light, and high-fidelity as pen and paper. The iPad is a solid start, and we can reasonably expect the technology to improve dramatically over the coming decades. But fine, delicate movements and gestures just aren’t supported by technology at this time.

And aside from the technology constraints, we simply do have to create a new set of interactions for new interfaces. Screens have things you can move around, unlike drawings on a sheet of paper, so you’ll be covering up content at some point. Screens can be positioned in a wide variety of spaces, sizes and contexts; if you’re presenting information, you’ll be using more than just your hands but your entire arms and perhaps entire body. So there’s a whole set of interactions, not only you interacting with elements on the screen, but you interacting with the screen, that simply haven’t been standardized yet.

But that’s okay! Here’s the important part: don’t feel like every single action you design right now, in this Wild West time of interaction design, has to be completely intuitive. There are things we think are intuitive now that we learned using tutorials decades ago. Andrei Herasimchuk pulled up a great old Apple tutorial on how to use a mouse. Do you remember those? Probably not, even if you’re above a certain age, and your kids or siblings (or maybe even you) have likely never seen them. They learned how to use a mouse by watching people instead. People don’t come out of the womb knowing how to use a mouse—they do learn it, at some point—but once the information is out there they can learn so seamlessly it doesn’t matter.

So don’t be afraid. The interactions we have to teach now may be the new standards for the next generation, and they may be much better than what we had before, even if they’re slightly less intuitive to start. Don’t be too hard on yourself, and don’t stop from doing something interesting just because you have to show someone else how to use it. Don’t stifle innovation and interesting gestures. Explain them, and people will remember.

—Timoni

January 7th, 2013
Sadly we see too many potentially amazing designers stuck by the glass ceiling of time. So they settle on the first solution that looks viable and are never allowed to sweat the details. They are forced to rely on 1% of inspiration without the benefit of perspiration. So this is the dirty little secret in our industry. The best designers and developers rarely have more talent. They simply have more time.

The Pastry Box Project | 7 January 2013, Baked by Andy Budd

  1. Does your job title have “design” somewhere?
  2. How many uninterrupted hours a day do you get for doing “design” work?
  3. When was the last time you produced the best work you know you are capable of with that number of hours and that level of focus?
(via soxiam)

(via soxiam)

November 5th, 2012
If your vision for mobile is designing for context, then the first step you need to take is getting all your content onto mobile devices.
March 5th, 2012

Even if the user is an absolute expert, able to remember almost everything, I’m always interested in the difference between what you might call stark meaning and adjustable meaning.

I did quite a bit of study on that over the years to understand the influence of having something that you can read. It’s known that our basic language mechanism for both reading and hearing has a fast and a slow process. The fast process has basically a surface phrasal-size nature, and then there’s a slower one. This is why jokes require pauses; the joke is actually a jump from one context to another, and the slower guy, who is dealing with the real meanings, has to catch up to it.

I recently exper­i­mented with an alter­nate approach in design­ing the UI for Lik­ables for iPhone, with a 4-pixel rhythm. No major no minor. Just 4 pix­els as a basic inter­val unit. Firstly, both the width and height of the iPhone and even the iPad screen can be divided by 4. Using 4 as a basic unit we can con­struct hor­i­zon­tal and ver­ti­cal grids with equal parts of 4, 8, 16 and 32-pixel inter­vals. It is highly flexible.
February 7th, 2012

Technology courses for the student designer should deal with the principles and methods of computer program construction. Topics would include computer systems architecture, microprocessor architectures, operating systems, network communications, data structures and algorithms, databases, distributed computing, programming environments, and object-oriented development methodologies.

Designers must have a solid working knowledge of at least one modern programming language (C or Pascal) in addition to exposure to a wide variety of languages and tools, including Forth and Lisp.

Make jokes even when it’s inappropriate. People get really emotional, myself included, when they’re working in web stuff. And it’s entirely understandable: often what we’re messing with are things that are mixed up in people’s jobs. Imagine if someone told you that what you do every day should be called something different because some guy called “the user” doesn’t know what it means. That’s emotional territory. Making jokes always works. Even if they’re bad ones. It puts people at ease and everyone can make rational decisions instead of emotional ones.