Tags

All 22 items on Vale.Rocks categorised with the tag 'design'. Content relating to the practice of graphic and visual design.

ActivityPub Bluesky

Publishing pixel art on the web? Don’t let it get blurred and smushed.

Apply image-rendering: crisp-edges to the image with CSS. Alternatively, export your pixel art at a higher resolution, so each visual pixel is made of many pixels, minimising impact from scaling and compression.

Remember to also use a good file format. Formats like JPEG are optimised for photos, not pixel art, and can introduce artefacts. PNG and GIF are good choices.

A collection of 88x31 buttons. One set is blurry and rendered with image-rendering: smooth. The other is sharp, and each individual pixel can be seen. It is rendered with image-rendering: crisp-edges.

ActivityPub Bluesky

I love that the same brands which once carefully curated their identity and adhered to stringent brand guidelines are now slopping out brand resources with random image generators that smush their wordmark and butcher their logo.

Junior designers used to be crucified for lesser failings.

ActivityPub Bluesky

It is my true and honest opinion that every logo design process should involve a step of presenting the concept to a 14-year-old boy so they can identify anything phallic.

ActivityPub Bluesky

All my love to Adobe Illustrator, which has today decided I don’t need to use the shortcut Ctrl + Z. Wonderful stuff. Much appreciated.

My undo privileges have been undone.

ActivityPub Bluesky

One of my ‘rules’ is to not make notes in design files. It forces me to make fresh judgements every time, which helps me re-evaluate my work more objectively.

Design Considerations for Moderation Tooling

Ensuring protection of the protectors.

Overview of thoughful and protective design of tooling for moderating user-generated content, placing emphasis on minimising the psychological effects of exposure to heinous content, while balancing efficiency, accuracy, and the long-term wellbeing of trust and safety teams. Covering techniques for the mitigation of impact where applicable.

https://vale.rocks/posts/moderation-tooling-design

ActivityPub Bluesky

I’m proud to announce that after spending the better part of half an hour painstakingly tweaking and refining an animation, I’ve decided I don’t like it and that I’m deleting it.

ActivityPub Bluesky

I’ve used Lexend as my go-to for years, but its lack of OpenType features is really bothering me. I can’t find anything else quite like it, though.

It has a heavy default weight, wide letterforms, and is very legible. Fira, IBM Plex, and Manrope aren’t it.

Any suggestions?

ActivityPub Bluesky

And with a single click, I find myself transported to an ancient place. I’m a digital archaeologist, and I’ve stumbled across a long-forgotten remnant of those who came before. UI untouched for a decade.

It is two rebrands old. The palette is warped. Distorted. There are gradients. Buttons forged from a low-resolution image. I brush away a drop-shadow-lg.png to inspect an input form. Picking it up, I bring it to my face to count the pixels, only to be hit by the harsh aroma of Bootstrap 2 in the back of my throat.

I drop it to the ground, and it shatters into CSS properties. ‘Oh well,’ I muse aloud. ‘It’ll be fixed on refresh. Assuming anyone ever discovers this place again.’

I do what I came to do and close the tab.

ActivityPub Bluesky

I always feel dirty talking about type. Serifs with lovely ball terminals. Soft shoulders. Attractive curves. Deep inktrap crotches. Beautiful eyes. Broad arms. Long, slender legs. Tittles.

(I mean, good typography is sexy – even ignoring the trade diction.)

LinkedIn

Warping Rules

My biggest takeaway from studying graphic design was learning how to warp rules – to take a concept and distort it for my own needs.

Rules exist for a reason. They are defined and present. Rules exist and continue to exist because they have worth. They wouldn’t be rules. If they were worthless, they wouldn’t be respected across industry.

Once you’ve got a grasp for these rules (a real grasp – a proper understanding of not just what they are, but why they are), you can truly begin to warp them. You can tug them by a corner to stretch them into the shape you need. You can experiment to go beyond the normal and expected.

The concept of colour associations is a simple one, and with effort and a will to understand, you can grasp it. As you design more, you gain an understanding of what will work before you even try it. You gain a deep understanding that becomes present at a subconscious level. With time, you get to do things that seem to go against learnt concepts – that should clash, yet harmonise beautifully. It becomes intuitive.

You’re still respecting the underlying principles, but your deeper understanding allows you to treat them flexibly as needed.

This applies beyond abstract concepts. Illustrator has a rigid set of tools, but you don’t have to adhere exactly to their suggested usage. You are the creative; your tools have rules, but you must choose how they shall be used.

Studying design taught me to truly understand my tools, not just to use them. To do what is intended, but also to utilise them in unexpected and innovative ways. This mindset has transformed my approach to every project, including beyond design and especially into development.

When you master the fundamentals, you earn the right to break them creatively. You learn that artful clashes can create harmony, that imperfection can be perfect, and that the most memorable designs often come from challenging conventions.

Knowledge of systems allows you to innovate within them. The most successful innovators understand exactly what rules they’re breaking and why. True innovation happens at the intersection between understanding and experimentation. We stand on the shoulders of giants.