The following are some tips I have found to be most impactful when either designing new, or cleaning up and modernising a user interface. These aren’t hard rules, I find that what ‘feels right’ can often better than sticking to rigid rules or systems, but these are a good guide. 1. Reduce borders The more […]
March 13, 2024
Read post
I ran into an issue while implementing customisable text sizes into a UI. I had a Callout component which consists of a box containing an icon and a block of text – a layout similar to this: This component was built a few years ago and designed so the icon perfectly centered on the first […]
January 25, 2024
Simple, yet powerful. This is one of my guiding principles when designing and building a user-interface. Your app should be simple enough that your users can get started easily without much friction, but provide the ability for power-users to thrive. Simple Powerful You will need to find your balance of simple/powerful to empower all your […]
January 8, 2024
I highly recommend watching this talk from Rasmus Andsersson. One quote that stood out to me that I think rings very true is “your users come for the features, but stay for the details”. You can have all the features in the world, but if they aren’t well thought out, lack attention to detail or […]
December 24, 2023
When I started this blog nearly 15 years ago, Flash was at its peak and much of the content on this blog was related to Flash. Since the Flash player no longer exists, a lot of content had either been lost or old posts completely busted. There was even still some video embeds using old […]
December 21, 2023
Here is a small CSS snippet to calculate a transparent version of the current text color. This is useful in a themeable component system where semi-transparent elements like dividers, icons or backgrounds need to adapt to the surrounding text color. We can use the new color-mix function, which is now supported in all browsers, along […]
December 19, 2023
Now that browsers support wide-colour gamuts with P3, I have been wanting to build a colour picker that could select colours from outside the standard sRGB gamut. As the feature became more broadly available in browsers I’d seen a few examples popup from various people such as Gradient.style, the ColorJS.io picker demo, and OKLCH.com. However, […]
December 14, 2023
When designing a user interface with rounded corners you will likey run into situtation where you have nested rounded corners. It could be a button in a card or input, or a box inside a modal. What should the inner radius be? The easy way out is to just use the same radius, but it […]
December 11, 2023
I posted recently about an updated blog design, the first in 8 years. And now I’m doing another post about another redesign. My original intention was to build a front end in React+Remix and use WordPress headlessly as the backend. I ran into a few issues with this approach and it was going to be […]
December 9, 2023
I wanted to do a little update on my spray paint stencil experiments using HTML and JavaScript. While it’s not a recent thing, I realised that I had never done a update with the last painting app I built. It was a couple years ago that I built Graffiti Monster, an experimental drawing app which […]
December 6, 2023