UI&us is about User Interface Design, User Experience design and the cognitive psychology behind design in general. It's written by Keith Lang, co-founder of Skitch; now a part of Evernote.  His views and opinions are his own and do not represent in any way the views or opinions of any company. 

Navigation
Categories
External Articles

Entries in Design (20)

Wednesday
Jun102009

Will This Link Open a New Tab/Window?

UPDATE:

Syphon kindly pointed out that I'd completely missed the forest for the trees — of course my design is based on an arrow, whereas browsers usually use a hand icon when mousing over links! :roll:

So, all the same applies, except imagine a hand instead of an arrow (until I have a chance to replace the graphics!) Also, this means the user is completely used to seeing their cursor change under their fingertips as they mouse around. We now return to your regular programming…

Ever clicked on a link and had a new window (or tab) unexpectedly open? Me too. It's a minor frustration that I think adds up over time. And sure — there are plugins and settings which can help manage this process. But the out-of-the box experience seems to be missing something to indicate whether a link will open a new window/tab, rather than simply take you to a new page.

A simple solution might be a custom mouseOver cursor indicating links that will result in new tabs/windows. I sketched up some ideas of what this cursor might look like and twittered the result:

The sketches were based on common graphic designs, with a few 'creative' ideas thrown in. Some commenters (thanks!) on my image's Skitch page added some useful feedback which I iterated on.

Then I ran the idea past my good friend and talented designer Cris Pearson, who had a few suggestions. I tried a few more designs…

Then Cris came up with the simple idea to simply add a more realistic image of a new tab below the cursor, rather than trying to be symbolic. Which I mocked up below. Seems to me to be an excellent solution.

Obviously h1 is for links that will open to a new tab. If a user hasn't set up their browser this way, then a different icon would be required to show a new page will be the result Further points:
  • A schizophrenic cursor, flickering as you mouse around a page, could be very annoying…
  • Adding a delay the transition to solve the above problem could be very problematic, as I expect expert users will want to see the change in milliseconds
  • Of course, there are other solution rather than changing the cursor. These might involve some kind of highlighting on the page on mouseover, or some kind of floating bezel that appears near the cursor
  • I brought the 'newlink' cursor idea up with Aza Raskin, and he suggested even more depth to this interaction (and that there'd been discussion on this topic before). For example: what if the browser knew a link might be 'unsafe'? This is where the idea for the design d2 came from, which I'm quite fond of


Click to read more ...

Monday
Jun012009

Pixar Discuss Character Design

The New York Times has a slideshow of some character designs from the Pixar movie "Up", with narration by the director and production designer. These guys are technicians of characters.


Click to read more ...

Friday
Apr242009

Human-sensing Computer Monitors

I've been looking forward to this for a while:

Eizo's new screens boast a new Green 'auto off' feature that turns off the computer monitor when you walk away to get a cup of joe. I hope it's smart enough to not turn off when you're simply sitting still. I hope it becomes standard — I'm frustrated by the fact the computer doesn't know I'm sitting there enjoying a TED video and the screen dims! It's a nice start to a more context-aware computer
(Via fareastgizmos.com)

I discussed this idea previously in my blogpost on 3D cameras:

Imagine your computer recognizing when you walk in front of it. Or putting itself to sleep when you walk out of a room




Click to read more ...

Wednesday
Apr222009

Aesthetics and Design and Your Emotions

A List apart published In Defense of Eye Candy looking at how good aesthetic design decisions impacts our rational thinking:

This raises some interesting questions—especially in the area of decision making. In short, our rational choices aren’t so rational. From studies on choice to first impressions, neuroscience is exploring how the brain works—and it’s kind of scary. We’re not nearly as in charge of our decisions as we’d like to believe.

You've probably seen the research studies where nice-looking ATMs cognitively 'work better' than their uglier, but equally competent cousins. As real-time brain imaging becomes available to researchers, it's seems that the mind forms many 'rational' decisions first emotionally and then creates logic to match.

This might explain more of this effect:

I think there's probably more to a Mac than just the computer — it's the culture of trust that users place in the interactions which enables them to try something on a whim. When users are rewarded with successful dragging between applications, they try it more. When modifier keys have reliable 'concepts' like "The Option key makes my action apply to other similar things", users are more likely to try them. This is becoming more and more of a moot point as Windows has improved over the years, but the cultural lag, I believe, means this still applies more to Mac users on average.


Click to read more ...

Tuesday
Apr072009

Design with Intent Blog

Comprehensive site defining and cataloging 'sustainable behavior', User Experience & social engineering. via the Umeå blog


Check out Dan Lockton's Design with Intent.


Click to read more ...

Tuesday
Mar242009

Google Design Guidelines

The 10 design guidelines Google's UI gurus use.


Click to read more ...

Thursday
Feb262009

Lukas on Spatial Thinking and the iPhone

Why do you have to swipe across every page of applications in your iPhone? Why not just have a continous list? Spatial thinking.


The topic of 'spatial thinking' was something I was planning to blog, but turns out Lukas Mathis' has already written a great post on the topic.

You can read about Spatial Thinking on the Ignore the Code blog.


Click to read more ...

Thursday
Feb192009

Gems of Unnoticed Problems

Pleasure and Pain alerted me to a talk series not unlike the TED talks called the Gel Conference. One talk to catch my attention was by Oxo's Alex Lee. Alex explained how Oxo, a kitchen utensil company renowned for its comfy designs, is constantly on the lookout for the gems of unnoticed problems; those unquestioned and unnecessarily difficult things people have to do everyday. oxo-design Traditional measuring cup Oxo measuring cup Oxo measuring cup I like his example of asking people "What is wrong with your current measuring cup?", which got answers like "it's sometimes slippery", or "the handle gets hot with hot liquids in it", but never

"it's actually hard to measure accurately without pouring a bit, bending down to look, pouring some more, bending down again…"

People didn't see the problem, until Oxo presented them with the solution. (Oxo actually didn't invent the better measuring cup design, they just improved on it and brought it to the masses). UPDATE: As was brought up in the comments, a company called Smart Design does the design work for Oxo. In addition, Oxo recieves many unsolicited designs, which on rare occasion turn into real products. This cup is one example. Alex Lee at Gel 2008 from Gel Conference on Vimeo.

Click to read more ...

Wednesday
Aug132008

Impairment and Design

Footprint A recent post on the excellent A List Apart usability blog focussed on designing for the deaf, the *Deaf or the hearing impaired. There are some excellent writings on how to design for deaf and visually impaired people out there, so I'll not go over that, except to say maybe they're getting ignored. A comment that caught my attention:

0.38% of America’s population is deaf. That’s 38 people in a stadium of 10,000, yet 50% of our time is spent blogging about them. I think if they spent as much time as we assume they do on the internet, they’d be insulted by all the wasted efforts. People already code sites with pure text/css now, and if there is Flash, it’s SIFR. I think this holy deaf talk is just trendy. posted at 02:57 pm on August 12, 2008 by Michael Angeletti
There is something the poster is not realizing — we are all impaired to some amount. I realized this a few years ago as a musician, moving heavy amplifiers to gigs. Those little ramps that had been required by law (at least here in Australia) for wheelchairs were my saving grace.. instead of lifting the hefty equipment I could roll it into the building. It probably saved me more than once from back injury. And yet, there would be no way the institutions would have put in those ramps for my convenience. And we are all time-impaired. If you compare iPhone's interface to traditional PDA you'll see that the iPhone usually has much larger, and easier to tap, targets and virtual buttons. Even with a stylus, most PDAs take a some very finite control. Fitts' law of course tells us that the smaller the target is, the longer it will take to aquire, so the cost to the some of us who have full control over our finger dexterity is still TIME. And time is the one thing we cannot get back. A final aspect, and I do mean final, is that we all lose some of our sensory capacity and dexterity as we age. The device that was once small and nifty becomes 'fiddly' and then 'darling can you help me with this, I can't do it anymore'. So any design that gracefully lets the sensory-impaired will also be helping you in future as you slowly decline! Arg.. time for a positive note! What about those wheelchair ramps? What would be the design equivalent? I would *love* to offer captioning on the video interviews I post. That would mean I no longer discriminate against hearing impaired. But think of the side benefits:
    Scannable text — just read the bits if you don't have time Searchable text. You, and Google can find any word spoken on a video. Think of all the great content locked up in YouTube because it's not easily searchable Note-taking and quoting copy and paste Contexts. In the office and can't make noise? You can watch with the sound down
I've looked around at possible services, for example everyzing.com but have found them cumbersome to use, and only partially accurate. Of course, machine translation of video audio is bad at this stage but I would happily make my own fixes to the text, and be happy for the community at large to make corrections. But there are a host of improvements possible to current computer interaction. Grab any old person from your local retirement home and plonk them down in front of a computer, and watch them squint and possibly, curse the machine in front of them. *Deaf, with a capital 'D' is how some hearing impaired people choose to define themselves, as a cultural group. They have a certain language (sign) speak cultural norms, and so forth

Click to read more ...

Thursday
Jul172008

New Podcast - Interview with Wil Shipley

I'm happy to announce the first of my interview series has gone up on the brand new UI and us video podcast. [EDIT] iTunes has now picked up the podcast.. click to subscribe for upcoming cool interviews, reviews and views. Click to view the UI and us podcast on iTunes The super-intelligent Wil Shipley talks about the inspiration behind the trend-setting Delicious Library 1 and 2, and also possible future directions. Well worth a watch! [UPDATE] You can also watch it right here.
UIandus.com Interview with Wil Shipley from Songcarver on Vimeo.

Click to read more ...

Page 1 2