Tags: list

104

sparkline

Brutalist design is the bad influence we all need

What these brands are taking from web-brutalism — and truly, we should all be learning something here — is that User-centered design doesn’t need to be monopolized by the same colors, same buttons, same photography and even same copy you see in pretty much every single website or product.

Going Offline · An A List Apart Article

The first chapter of my new book Going Offline has been published in A List Apart.

The first hit is free. If you like what you read here and you’re just dying to know how it ends, you can pre-order the book now (it’s shipping on April 24).

Vox Product Accessibility Guidelines

Accessibility isn’t a checklist …but this checklist is a pretty damn good starting point. I really like that it’s organised by audience: designers, engineers, project managers, QA, and editorial. You can use this list as a starting point for creating your own—tick whichever items you want to include, and a handy copy/paste-able version will be generated for you.

Futurists & realists – The Man in Blue

Cameron contrasts Syd Mead with Frank Lloyd Wright.

Mastery of materials is a valuable thing to have. It will help you build what’s needed now and forge ahead into the near future. But vision is also valuable – it helps inspire and drive teams, and lays out a longer term future that can alter the path of humanity. What I take from the futurists and the realists is that there’s a place for every person and every process; what you need to do is find your own place, get comfortable, and own it.

The King vs. Pawn Game of UI Design · An A List Apart Article

I love this analogy and I love this approach—starting with the simplest possible thing and building up from there. This article talks about taking that approach for UI design, but it’s pretty much the same thing I talk about for development in Resilient Web Design.

As Shakespeare once didn’t say, progressive enhancement by any other name would smell as sweet.

Laws of UX

  1. Fitts’s Law
  2. Hick’s Law
  3. Jakob’s Law
  4. Law of Prägnanz
  5. Law of Proximity
  6. Miller’s Law
  7. Parkinson’s Law
  8. Serial Position Effect
  9. Tesler’s Law
  10. Van Restorff Effect

Not listed:

  1. Murphy’s Law
  2. Sturgeon’s Law

Web Typography: Designing Tables to be Read, Not Looked At · An A List Apart Article

An extract from Richard’s excellent book, this is a deep dive into styling tables for the web (featuring some CSS I had never even heard of).

Tables can be beautiful but they are not works of art. Instead of painting and decorating them, design tables for your reader.

(It also contains a splendid use of the term “crawl bar.”)

Coding with Clarity · An A List Apart Article

Good advice on writing code that is understandable to your fellow humans (and your future self).

The Story of CSS Grid, from Its Creators · An A List Apart Article

It must be the day for documenting the history of CSS. Here’s an article by Aaron on the extraordinary success story of CSS Grid. A lot of the credit for that quite rightly goes to Rachel and Jen:

Starting with Rachel Andrew coming in and creating a ton of demos and excitement around CSS Grid with Grid by Example and starting to really champion it and show it to web developers and what it was capable of and the problems that it solves.

Then, a little bit later, Jen Simmons created something called Labs where she put a lot of demos that she created for CSS Grid up on the web and, again, continued that momentum and that wave of enthusiasm for CSS Grid with web developers in the community.

New A List Apart wants you! · An A List Apart Article

We’re getting rid of advertisers and digging back to our roots: community-based, community-built, and determinedly non-commercial.

I approve!

A List Apart has given me so, so much over the years that becoming a supporter is quite literally the least I can do.

And so can you!

Yes, That Web Project Should Be a PWA · An A List Apart Article

A fantastic piece by Aaron who—once again—articulates what I’ve been thinking:

Your site—every site—should be a PWA.

He clearly explains the building blocks of progressive web apps—HTTPS, a manifest file, and a service worker—before describing different scenarios for different kinds of sites:

  • Informational
  • Periodical
  • Transactional
  • Social
  • Software
  • Institutional

Progressive Web Apps may seem overly technical or beyond the needs of your project, but they’re really not. They’re just a shorthand for quality web experiences—experiences that can absolutely make a difference in our users’ lives.

Highly recommended!

User Interfaces for Variable Fonts · An A List Apart Article

A good introduction to variable fonts, and an exploration of the possible interface elements we might use to choose our settings: toggles? knobs? sliders? control pads?

Integrating Animation into a Design System · An A List Apart Article

Alla looks at ways of documenting animations into a pattern library. I tell ya, her book is going to be unmissable!

What Would Augment Reality? (with images, tweets) · lukew · Storify

Luke has been asking people to imagine ways of augmenting the world. Spimes are back, baby!

The Nine Principles Of Design Implementation – Smashing Magazine

I like this list:

This is not a checklist. Instead, it is a set of broad guidelines meant to preserve an underlying value. It can be used as a guide for someone working on implementation or as a tool to evaluate an existing project.

I’ve added them to my collection of design principles.

Patterns Day playlist on Spotify

If you were at Patterns Day and you liked the music that was playing during the breaks, here’s the playlist. All the artists are based in Brighton.

Introducing Fractal and Federalist | U.S. Web Design Standards

Another instance of Fractal in the wild, this time for the Federalist design system.

Why Fractal?

  • It’s open source.
  • It’s easy to use.
  • It generates standalone HTML previews of each component.
  • It uses or supports many of the technologies we use already.
  • Fractal offers a customizable theme engine.

A Todo List

A great step-by-step walkthrough by Heydon of making an accessible to-do list, the “Hello World” of JavaScript frameworks.

There’s a lot of great knowledge in here that can be applied to plenty of other interface elements too.

Front-End Performance Checklist 2017

You can print out this PDF and then have the satisfaction of ticking off each item on the list as you build your website.