I really, really like this approach. I’ve used something similar in my responsive design workshops, where I get people to break things down into nouns and verbs (objects and actions). I think there’s a lot of crossover with good URL design here too—this is kind of like REST for UX designers.
I quite like this step-by-step interface for a form, all cleverly handled with the
:focus pseudo-class. I’d want to refine some of the usability issues before using it in production, but the progressive disclosure is nice.
If you think people using ad blockers are just anti-ad or want to freeload on publishers, you’re completely missing the point. The online advertising industry has been abusing users for 20 years now, and we’re sick of it.
The thesis: any film is improved by playing Walk Of Life by Dire Straits over the ending.
The proof: this website.
(this is absorbing and brilliant)
A lovely outlook on designing with progressive enhancement:
There will always be users coming from places you didn’t expect, using devices you didn’t test for.
Cennydd speaks his brains on conversational interfaces—a refreshing counterpoint to Chris’s cheerleading.
My concern is that by encouraging the practice of doing UX design without touching the surface of a product, we get shitty designs. In a process where UX and UI are seen as separate things the risk is one comes before the other. The UX designer draws the wireframes, the UI designer gets to turn them into pretty pictures, with no back-and-forth between the two. An iterative process can mitigate some of the damage such an artificial division of labour produces, but I think we still start out on the wrong foot. I think a better practice might entail including visual considerations from the very beginning of the design process (as we are sketching).
Charlotte talks through some of the techniques she used when she was building the site for this year’s UX London, with a particular emphasis on improving perceived performance.
Jennison Asuncion outlines the problem with relying on a swipe gesture for interactions.
I would say that this could be expanded to just about any interaction: it’s always dangerous to rely on one specific gesture. It’s always better to either provide multiple ways of accomplishing a task, or to simply take a declarative approach, get out of the way, and let the user agent handle it.
I completely agree with Cennydd (and Peter, and Leisa). If anyone working on a project—whether they’re a designer, developer, or anything else—isn’t considering the user experience, then what’s the point of even being there? By extension, labelling your work as “UX Design” is as redundant and pointless as labelling it “Good Design.”
But my complaint is with the label, not the activities. It’s the UX Design label that has little value for me. These activities happen in all good design: if you’re not trying to create positive experience then I don’t really understand what you are doing.
A lesson on the importance of handling each state of an interface:
- the blank state,
- the loading state,
- the partial state,
- the error state,
- and the ideal state
…instead of just focusing on that last one.
I kind of want to link to every one of John’s post chronicling his 90 days at Clearleft, but this one is particular good, I think: how narrative ideas from the world of storytelling can help unlock some design problems.
Yes! Yes! YES!
Marco makes the same comparison I did between the dark days of pop-up windows and the current abysmal state of bloated ads and tracking on today’s web.
I have one more thing to add to this list…
But publishers, advertisers, and browser vendors are all partly responsible for the situation we’re all in.
…developers. Somebody put those harm-causing
script elements on those pages. Like I said: “What will you be apologising for in decades to come?”
In a few years, after the dust has settled, we’re all going to look back at today’s web’s excesses and abuses as an almost unbelievable embarrassment.
A detailed and humorous deep dive into motion design and spatial depth in digital interfaces.
This sounds like it could be a very useful tool to introduce early in projects to get a shared understanding of progressive enhancement.
I think the distinction between ‘how it works’ and ‘how it looks’ is blurrier than we think.
SmashingConf Oxford 2015: Richard Rutter on Don’t Give Them What They Want, Give Them What They Need
A great case study from Richard, walking through the process of redesigning the website for the Royal Borough of Kensington and Chelsea.
This would be better titled “Futures of texting” but it’s an interesting grab-bag of observations. I’ve always felt that SMS has been overlooked as an input mechanism.
(Conversely, I’ve always felt that voice is really over-rated as input mechanism, but under-rated for output.)
A great investigation into the usability benefits of allowing users to fill in their passwords in plain text.
Major caveat: make sure you still offer the ability to mask passwords too.
Paul Kinlan writes an honest post-mortem of his push for Web Intents.
There are some valuable lessons here, particularly for the indie web’s web actions.
Smart thinking here on the eternal dilemma with loading web fonts. Filament Group have thought about how the initial experience of the first page load could be quite different to subsequent page loads.
Here’s a fun little interview I did recently, mostly about work stuff. It’s available for your huffduffing pleasure.
One thing that really bothers me is the way I repeatedly said “guys” to refer to my colleagues at Clearleft. I must stop doing that.
A fantastic collection of short videos from Luke on interaction design for devices of all shapes and sizes.
Make yourself a nice cup of tea, hit “Play all”, sit back, relax and learn from the master.
A look behind the scenes of gov.uk. I like their attitude to Photoshop comps:
We don’t want a culture of designs being “thrown over a wall” to a dev team. We don’t make “high fidelity mock ups” or “high fidelity wireframes”. We’re making a Thing, not pictures of a Thing.
We don’t have a UX Team. If the problem with your service is that the servers are slow and the UX Team can’t change that, then they aren’t in control of the user experience and they shouldn’t be called the user experience team.
A concise case study from gov.uk:
Designing for the constraints of mobile is useful – if we get the fundamentals of the service working on small screens and slow network speeds, it can work on more capable devices.
The transcript of Anab Jain’s talk from the FutureEverything Festival.
I really like this interface idea from Brad that provides the utility of input masks but without the accessibility problems.
If you insist on having a fixed header on your site, please, please, please add this script to your site. I often use the spacebar to page down so this would be a life-saver.
Fast Company features Aral’s tantalising Indie Phone project that he’s been working on at Clearleft Towers.
Good to see Oskar the dog getting the recognition he deserves.
On the top floor of a commercial building in the old maritime city of Brighton, England, Balkan has been quietly hacking away at Indie Phone for the last several months with the rest of his team—Victor Johansson, an industrial designer, Laura Kalbag, a professional web designer (and Balkan’s partner), and her Husky, Oskar.
A great write-up of the design process behind The Guardian’s responsive site. It’s really gratifying to see UX designers talking about performance.
This observation by Josh seems obvious in hindsight (all the best insights do), but there’s a powerful idea there:
So here is the real difference: scrolling is a continuation; clicking is a decision. Scrolling is simply continuing to do what you’re currently doing, which is typically reading. Clicking, however, is asking the user to consider something new…is this new thing the same as what I’m already doing, or something new?
Usually I find these kinds of name-and-shame collections to be unnecessarily mean-spirited. In this case, the sites being named and shamed are themselves guilty of far worse rudeness.
Speakers from this year’s UX Week conference provide career advice. I think my advice is clearly the best:
To be successful in today’s industry, UX professionals should have really killer paisley shirts. Some people will tell you that it’s more important to have good hair and straight teeth, but in my experience, a really good paisley shirt will really take you places.
Trent proposes a way to avoid implementing dark patterns: take a leaf from the progressive enhancement playbook and assume the worst conditions for your user’s context.
Empathy is for everyone:
No matter how many times I go through this journey, it never stops surprising me how easy it is to lose perspective in the heat of a project and forget that there is no difference between a user, a client and a designer. It shouldn’t be so hard to remember that no matter the title, we’re all just people trying to get things done.
A nice reminder from Viv.
I was interviewed for this article on psychology in web design. The title is terrible but the article itself turned out quite nicely.
The transcript of a terrific talk by Harry on how dark patterns are often driven by a slavish devotion to conversion rates.
Jared explains how adding new features can end up hurting the user experience.
A design fiction video depicting technology that helps and hinders in equal measure.
Yes, yes, yes!
I’m going to miss having Harry around at Clearleft. Sounds like he might miss Clearleft too:
What I’ve loved about Clearleft is that it’s just so different to any other agency I’ve worked at. There’s no company process – everyone’s encouraged to experiment and try different techniques to suit the client’s needs. There’s hardly any internal meetings. I’ve never once had a conversation about my billing efficiency. The focus is on quality, and profitability is almost seen as a by-product. You’re encouraged to share your learnings externally rather than keep them in-house. Everyone’s trusted and given a lot of independence.
Dan isn’t keen on the term “natural user interface.” Here’s why.
The latest Clearleft product will be like having an intensive set of discovery, collaboration, and exploration workshops in a box. Perfect for startups and other small businesses short on time or budget.
It starts in Spring but you can register your interest now.
A great meaty piece from Cennydd, diving deep into the tricky question of context.
A short film about interaction design.
Let’s be polite. Especially when starting relationships.
A really terrific piece about wireframing for responsive designs. Again, it’s all about the prototypes.
Interaction dissolving into the environment.
Less wireframing, more prototyping.
Funny because it’s true.
A classic piece of design fiction written by Mark Weiser 21 years ago.
The most profound technologies are those that disappear. They weave themselves into the fabric of everyday life until they are indistinguishable from it.
Leisa nails it. The real stumbling block with trying to change the waterfall-esque nature of agency work (of which Clearleft has certainly been guilty) can be summed up in two words: sign off.
And from a client’s perspective, this emphasis on sign-off is completely understandable.
It takes a special kind of client to take the risk and develop the level of trust and integration required to work the way that Mr Popoff-Walker any many, many other inhabitants of agency world would like to work.
A fascinating insight into the psychological implications of animated progress indicators.
Some sensible advice from Oliver Reichenstein. Cluttering your social media icons isn’t helping and may actively be hindering your audience.
Harry’s 15 minute case-study presentation at UX London was excellent. He says the lesson is that we shouldn’t be afraid to make mistakes, but there’s another lesson here too: testing with users will save your ass.
Anna goes through some of her favourite pattern libraries. It’s really, really great to see this stuff getting documented.
A great article from David with some concrete proposals for media companies.
By the way, how nice is David’s new responsive design? Very nice. Very nice indeed.
Some interesting ideas on the commonalities and differences between native apps and the web.
Yes, yes, yes! This article does an excellent job of explaining what Captchas are attempting to do and why, therefore, they are so utterly shit.
Harry interviews Glenn about web intents (web actions). Glenn gives a good clear explanation of what they are.
This looks like it’s going to be a great event on February 25th right here in Brighton: a gathering of minds to brainstorm around web intents. Get there if you can.
Bill Buxton’s collection of input devices going back thirty years.
I think Rebecca is on to something here. Everyone has been so quick to self-identify as a UX designer while marginalising visual design as a purely surface-level layer …but it’s all part of the design process.
Glenn has written up the discussion that followed his UXCampBrighton talk on web actions.
Dana has put together an excellent grab-bag of data on people’s password habits.
Tantek’s braindump of research he and Erin have been doing on web actions—verbs for the web, specifically interactions across sites: sharing, liking, and so on. I agree with him that this terminology feels better than “web intents.”
Erin documents the next step after web intents.
Just when you thought it couldn’t get any worse than “webinar.”
Steph Hay takes a look at how websites can allow a narrative to unfold, with the Ben The Bodyguard site as a case study.
I agree with this. I like it. I plus one it. So to speak.
The dominance of the desktop browser is over – the web has become wider. After so long painting in a tiny corner of the canvas, it’s time to broaden our approach.
It’s understandable that the community is somewhat nervous about the changes ahead. So far, we’ve mostly responded by scratching around for device-specific tips, but this isn’t sustainable or scalable. We should transcend “platformism” and instead learn to design for diverse contexts, displays, connectivity, and inputs by breaking devices down into first principles. Instead of the defective dichotomy of the “desktop” and “mobile” web, designers should aim to create great user experiences using the truly fluid nature of the web.
This looks like a beautiful way to present information, although it seems a real shame that the information is locked to just one class of device.
Ben documents the improvements in Twitter’s OAuth flow. Maybe this will help to stop people blindly giving permission to dodgy third-party sites to update their Twitter stream.
A good analysis of many of the factors involved in web design, of which responsiveness is clearly an important part.
A browser-based tool for creating HTML prototypes.
James follows up on his previous excellent post on hashbangs by diving into the situations where client-side routing is desirable. Watch this space for a follow-up post on performance.
The Riegers are like emissaries from Planet Smart and we mere mortals are fortunate that they take the time to give us great articles like this.
Cennydd’s closing remarks from this year’s IA Summit. Huzzah!
A nice overview of the increasing importance of UX on the web, written by Bobbie with soundbites from Andy.
Superb in-depth analysis of Ryanair’s website dark patterns and nasty brand strategy.
Yes! Yes! Yes! Mark nails it: just because someone visits a site with a certain kind of device doesn’t mean you can make assumptions about their intentions.
- Mobile != low download speed
- Context != intent
I wish I could’ve attended James’s talk at Tools of Change. It sounds like it was great.
An excellent article from Bryan, hammering home the point that there is no sharp dividing line between desktop and mobile.
Remember as well that the most ubiquitous of technologies, the common thread throughout many connected devices, is the browser. Browser-based experiences may not always be as sexy, but they are often far more capable of adapting to different contexts. In times of rapid change, adaptability—rather than features—may be your product’s greatest ally.
One potential nightmare vision of the future …that looks kind of cool.
Luke points to the sweet spot between creating endpoints for classes of devices, and using responsive design to allow them to adapt.
Pitching Orwell against Huxley in an argument that is ironically shallow: it only holds up if you accept the premise that activities involving the web, television and video games are inherently “bad” and anti-social: a pathetically, narrow-minded and condescending worldview.
A fascinating look at the experience design of the 9h brand of capsule hotel. I like the consistent use of colour, light and iconography.
A fascinating explanation of why Instapaper is migrating away from its passwordless sign-up.
Watch this space. Glenn has a really interesting idea (and implementation) for exchanging structured data between browser windows using drag'n'drop.
Aza Raskin on the UI failings of kitchens.
An excellent overview of the evolution of the St. Paul's School website from David Smith, noting an increasing emphasis on mobile usage.
An excellent little rant by Cennydd that I agree with 100%: hovering does not demonstrate user intent.
Personality in software. Pieces of technology are people too.
A timely reminder: don't hide information behind mouseover events.