Adactio: Links

Design systems - Alla Kholmatova

Here’s the website for Alla’s forthcoming book. You can sign up to a low-volume mailing list to get notified of updates.

Meet “Design Systems”, A New Smashing Book (Pre-Release) – Smashing Magazine

Alla’s book is going to be a must-have (I know because I’ve been reviewing it as she’s been writing it). Pre-order it now. It’s out in September.

Implementing a slider well

A look at the feedback needed for a slider control that feels “right”.

You can get most of the behavioural (though not styling) suggestions in HTML by doing this:

<form>
  <input type="range" min="0" max="100" value="50"
   onchange="amount.value=this.value"
   onmousemove="amount.value=this.value">
  <output name="amount">50</output>
</form>

The Equilateral Triangle of a Perfect Paragraph | Better Web Type

This is a fun game (I scored a measly 73/100). The idea is to develop a feeling for the balance between font-size, line-height, and line length …just like the three sides of an equilateral triangle.

Too many of them still set line-height, font size and line width as independent features when in fact they should all be considered together. The equilateral triangle is a perfect representation of how the three features work in harmony.

Out of the (Drop)Shadows | Scott Jensen Design

Can an opinionated flat design still have depth and truly be free of drop shadows?

Scott proposes a technique that mimics atmospheric perspective—y’know, when things in the distance look hazier than things in the foreground.

The fact is, we are surrounded by a world that is full of depth, and very little of it is defined by shadow. If we are going to replace drop shadows in our visual UI metaphors, we should look at other options that create depth in the world around us.

Using CSS variables correctly - Mike Riethmuller

Mike examines the real power of CSS custom properties compared to Sass variables—they can change at runtime.

I’m convinced that in almost all cases, responsive design logic should now be contained in variables. There is a strong argument too, that when changing any value, whether in a media query or an element scope, it belongs in a variable. If it changes, it is by definition a variable and this logic should be separated from design.

Standard Ebooks: Free and liberated ebooks, carefully produced for the true book lover.

Beautifully designed and typeset eBooks of royalty-free works—yours for the taking and reading.

There’s a styleguide if you want to get involved on the production side too.

IndieWebifying my website: part 1, the why & how – AltPlatform

Richard MacManus begins to document the process of making his website part of the indie web.

Beyond Curie—a design project celebrating women in STEM

Beyond Curie is a design project that highlights badass women in science, technology, engineering + mathematics.

Design in the Era of the Algorithm | Big Medium

The transcript of Josh’s fantastic talk on machine learning, voice, data, APIs, and all the other tools of algorithmic design:

The design and presentation of data is just as important as the underlying algorithm. Algorithmic interfaces are a huge part of our future, and getting their design right is critical—and very, very hard to do.

Josh put together ten design principles for conceiving, designing, and managing data-driven products. I’ve added them to my collection.

Favor accuracy over speed

Allow for ambiguity

Add human judgment

Advocate sunshine

Embrace multiple systems

Make it easy to contribute (accurate) data

Root out bias and bad assumptions

Give people control over their data

Be loyal to the user

Take responsibility

Inclusive Design Principles

I’ve added these to my collection of design principles:

Provide comparable experience

Consider situation

Be consistent

Give control

Offer choice

Prioritise content

Add value

Worst volume sliders possible – Designer News

Truly awful interfaces …made real.

4 Things I Know About Pattern Libraries - daverupert.com

Dave muses on the challenges of maintaining a pattern library:

Rolling out a Pattern Library is infinitely harder than building one.

If you don’t have pages, it’s doesn’t solve the problem.

Vertical spacing will make or break you.

The Pattern Library is dead if it’s not prioritized.

Left to our own devices. — Ethan Marcotte

Your website’s only as strong as the weakest device you’ve tested it on.

My argument is relatively simple: creating a comprehensive styling mechanism for building complex user interfaces is startlingly hard, and every alternative to CSS is much worse. Like, it’s not even close.

Learn CSS Grid - A Guide to Learning CSS Grid | Jonathan Suh

A quick visual guide to CSS Grid properties and values.

Tags: design

1068