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!
Tags: guide
105
10 guidelines to improve your web accessibility | Aerolab
- Do not depend on color
- Do not block zoom
- Rediscover the alt attribute
- Add subtitles and captions to your videos
- Semantics = accessibility
- Use the right mark-up
- Use roles when necessary
- On hiding elements
- Follow web accessibility standards
- Audit and review
I made a style guide for my personal web site and you should too.—zachleat.com
Here’s Zach’s style guide. But the real reason I’m linking to this is his lovely description of having a personal website that grows over time:
As my own little corner of the web unceremoniously turned ten years old this year, it’s really starting to feel more like a garden than a piece of software. I certainly enjoy tending to it. I can plant what I like and with proper care it can grow into something useful.
Patterns Day 2017: Paul Lloyd on Vimeo
Paul pulls no punches in this rousing talk from Patterns Day.
The transcript is on his site.
Another Lens - News Deeply x Airbnb.Design
A series of questions to ask on any design project:
- What are my lenses?
- Am I just confirming my assumptions, or am I challenging them?
- What details here are unfair? Unverified? Unused?
- Am I holding onto something that I need to let go of?
- What’s here that I designed for me? What’s here that I designed for other people?
- What would the world look like if my assumptions were wrong?
- Who might disagree with what I’m designing?
- Who might be impacted by what I’m designing?
- What do I believe?
- Who’s someone I’m nervous to talk to about this?
- Is my audience open to change?
- What am I challenging as I create this?
- How can I reframe a mistake in a way that helps me learn?
- How does my approach to this problem today compare to how I might have approached this one year ago?
- If I could learn one thing to help me on this project, what would that one thing be?
- Do I need to slow down?
Patterns Day 2017: Alice Bartlett on Vimeo
At Patterns Day, Alice shared what she has learned from shepherding the Origami project within the Financial Times.
Patterns Day 2017: Jina Anne on Vimeo
Jina invented an entirely new genre for her Patterns Day talk—autobiographical fantasy.
Patterns Day 2017: Rachel Andrew on Vimeo
Rachel’s fantastic talk from Patterns Day. There’s a lot of love for Fractal specifically, but there are also some great points about keeping a pattern library in sync with a live site, and treating individual components as reduced test-cases.
Patterns Day 2017: Laura Elizabeth on Vimeo
The videos are coming! The videos are coming!
Here’s the first one: Laura Elizabeth opening the show at Patterns Day.
What’s the difference between style guides, pattern libraries, and design systems? – Joseph Fitzsimmons
Ah, the age-old question!
The Venn diagram here pretty much maps to how I think about these different terms, and how they relate to one another.
Fantasies of the Future / Paul Robert Lloyd
Paul has published the slides and transcript of his knock-out talk at Patterns Day. This a must-read: superb stuff!
Design systems are an attempt to add a layer of logic and reasoning over a series decisions made by complex, irrational, emotional human beings. As such, they are subject to individual perspectives, biases, and aspirations.
How does the culture in which they are made effect the resulting design?
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.
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.
Amazon Alexa Voice Design Guide
A style guide for voice interfaces.
Learn CSS Grid - A Guide to Learning CSS Grid | Jonathan Suh
A quick visual guide to CSS Grid properties and values.
Style Guide Guide | Style Guide Guide
If you want to understand the thinking behind this style guide guide, be sure to read Brad’s style guide guide guide.
Codebar Coach Guide
It’s a short list, but this brief guide for coaches at Codebar is packed with excellent advice for anybody getting into teaching or training:
- Do not take over the keyboard! This can be off-putting and scary.
- Encourage the students to type and not copy paste.
- Assume that anyone you’re teaching has no knowledge but infinite intelligence.
Springer Nature frontend playbook: house style guide
I like it when organisations share their in-house coding styles. This one from Springer Nature not only has guides for HTML, CSS, and JavaScript, but it also has a good primer on progressive enhancement.
Patterns Beyond Context · Matthias Ott – User Experience Designer
If we describe patterns also in terms of content, context, and contrast, we are able to define more precisely what a specific pattern is all about, what its role within a design system is, and how it is defined and shaped by its environment.
Evaluating Tools For Building a Component Library | Chromatic
A comparison of a few different tools for generating pattern libraries.
Spoiler…
In this particular case, Fractal comes out on top:
It has the features we need, and I’m happier than I should be with how simple the directory and file structure is. The documentation has also been super helpful thus far. We’ve customized it with our client’s branding and are ready to roll.