profile

Design tips to help you create products that are ridiculously simple and accessible to use

Join 10,000+ designers, content designers and engineers who get my free weekly newsletter with evidence-based design tips (in 3 minutes or less). Mostly forms UX, but not always.

Me holding a sign saying "Test boring patterns first."
Featured Post

Why I don’t use “interruption pages” (and what to do instead)

Last week, someone paid me to review their form flow. One thing they wanted advice about was interruption pages. Coincidentally, the following day the GOV.UK Design System added the interruption page pattern. Interruption pages are designed to pause the user within a journey - usually to warn them about a possible mistake or give them important information before they continue. Here’s an example from the GOV.UK Design System: It has: An h1 heading to ask a simple question A paragraph to...

Me holding a sign saying, "We all have fuzzy edges."

Last week, Kate Ivey-Williams, the Head of UCD on my programme, asked me: “What do you think your role is as a designer?” I said: “Errr... I design products that are easy to use... errr... I realise that’s a rubbish answer...” Kate saved me: “Don’t worry, I put you on the spot” But even so, as a designer you should be ready to be put on the spot because: If you aren’t able to explain what you do, it’s much harder for your teammates and stakeholders to value what you do. I messaged Kate later...

Me holding a sign that says, "Good UX is holistic."

Last week, I ran a live training on file upload UX. Every day leading up to the event, I was stressed, constantly thinking: “Shall I just purchase one month of Zoom?” Let me explain: I use Circle to run my courses and it comes with something called Live Rooms. It’s like Zoom. But Live Rooms is better than Zoom because: it’s quicker and easier to set up for me it comes with my Circle subscription for free it automatically posts the recording afterward the call it has better UX for my students...

Opening a file dialog with some files disabled and the user trying to click on them.

Last week I wrote about the problem with using the accept attribute for uploading files. As a quick reminder: When you use accept to specify which file types will be allowed like this: <input type="file" accept="image/jpeg,image/png"> …the dialog will disable invalid types like this: This is bad because: The disabled files are greyed out making them hard to read Some users won’t notice the subtle greyed out styling - so will try clicking the invalid files anyway And this will make the...

Me holding a sign saying, "Error hiding is not error prevention."

Last week I posted about why the accept attribute on file inputs is bad UX. The accept attribute lets you specify which file types an input will accept. For example, if users need to upload a receipt, you can do this: <input type="file" accept="image/jpeg,image/png,application/pdf"> That means users can only select those file types. All other files are disabled: This sounds good because it stops users from picking an invalid type before they submit - which would then cause an error. But as I...

Me holding a sign saying, "Go from good UX to great UX."

Last week I listened to episode 10 of the Complimentary podcast, “Taking Interaction Design from Good to Great”. Anthony Hobday, one of the hosts, gave an example of applying for a driving license on GOV.UK. He said that instead of asking you to upload a photo, the form said: “We notice that you’ve already got a passport with us. Do you want us to use your passport photo for your driver’s license?” You just click ‘Yes’ and move on. Anthony said this design is “next level”. I agree. The best...

Me holding a sign that says "Design like Blink-182"

I’ve just listened to Rick Beato break down “What’s My Age Again?” — Blink-182’s second biggest hit. Funnily enough, he kicked off his "What Makes This Song Great?" series with their biggest hit — "All The Small Things". One person commented: I can’t believe you started the series with All The Small Things when it’s all the small things that makes the song so great. In the chorus of “What’s My age Again?”, Rick points out how most bass guitarists would play continuously, but Blink-182 left a...

Me holding a sign that says "Design like Blink-182"

I’ve just listened to Rick Beato break down “What’s My Age Again?” — Blink-182’s second biggest hit. Funnily enough, he kicked off his "What Makes This Song Great?" series with their biggest hit — "All The Small Things". One person commented: I can’t believe you started the series with All The Small Things when it’s all the small things that makes the song so great. In the chorus of “What’s My age Again?”, Rick points out how most bass guitarists would play continuously, but Blink-182 left a...

Me holding a sign saying learn the material and become a better designer.

I didn’t start out as a designer. I started out as a frontend developer. I cared about the craft and spent a lot of time trying to master HTML, CSS, JavaScript and accessibility. Over time, I learned how these technologies affected UX, so as a dev, I started to suggest design changes to improve usability and accessibility. But most of the designers I worked with ignored my suggestions. Years later I transitioned to design. I tried to hide my engineering past because I was worried other...

Me holding a sign saying native elements don't guarantee good UX.

Last week I read a post by designer and frontend dev, Theodore Soti: Stop clearing forms with JavaScript.The browser already knows how. I still see a lot of apps using custom code to track inputs and reset state. But for many forms, you can just use the native reset button. <form> <!-- Your inputs go here --> <input type="submit" value="Submit"> <input type="reset" value="Reset"></form> That reset button restores every field to its initial value.Text inputs. Checkboxes. Radios. Selects....