A great selection of links about design systems, collected and categorised.
Saturday, November 10th, 2018
Thursday, November 8th, 2018
Monday, October 22nd, 2018
Wednesday, June 20th, 2018
A collection of collections.
This site is dedicated to compiling and sharing useful resources for Designers and UI Developers.
Wednesday, May 2nd, 2018
Service worker resources
At the end of my new book, Going Offline, I have a little collection of resources relating to service workers. Here’s how I introduce them:
If this book were a podcast, then this would be the point at which I would be imploring you to rate me on iTunes (or I’d be telling you about a really good mattress). Instead, I’d like to give you some hyperlinks so that you can explore some of the topics in this brief book in more detail.
It always feels a little strange to publish a list of hyperlinks in a physical book, so I figured I’d republish them here for easy access…
- Mariko Kosaka wrote and illustrated an explanation of service workers in a post on her site called “Service Worker, what are you?” (https://kosamari.com/notes/Service-Worker-what-are-you).
- Mariko also wrote and illustrated an explanation of promises called “The Promise of a Burger Party” (https://kosamari.com/notes/the-promise-of-a-burger-party).
- Ire Aderinokun wrote a clear guide to “The Service Worker Lifecycle” (https://bitsofco.de/the-service-worker-lifecycle/).
- Yoav Weiss has an explanation of different kinds of caching in “A Tale of Four Caches” (https://blog.yoav.ws/tale-of-four-caches/).
- Lyza Gardner wrote a step-by-step guide for Smashing Magazine on “Making A Service Worker: A Case Study” (https://www.smashingmagazine.com/2016/02/making-a-service-worker/).
- Jake Archibald has collected a series of service worker strategies into an “offline cookbook” (https://jakearchibald.com/2014/offline-cookbook/).
- Jake also recorded an excellent online video series that you can enjoy for free (https://www.udacity.com/course/offline-web-applications—ud899).
- Mike Riethmuller has on offline page on his site that shows articles you’ve previously visited (https://madebymike.com.au/writing/service-workers/).
- Ethan Marcotte has a similar offline page, but he also shows metadata for each article (https://ethanmarcotte.com/wrote/going-offline/).
- Una Kravets allows you to choose which pages on her site you want to save for reading offline (https://una.im/save-offline/).
Progressive web apps
- Alex Russell answers the question “What, Exactly, Makes Something A Progressive Web App?” (https://infrequently.org/2016/09/what-exactly-makes-something-a-progressive-web-app/).
- Ada Rose Cannon goes into the details of “The Building Blocks Of Progressive Web Apps” (https://www.smashingmagazine.com/2016/09/the-building-blocks-of-progressive-web-apps/).
- Aaron Gustafson quite rightly points out that “Yes, That Web Project Should Be a PWA” (https://alistapart.com/article/yes-that-web-project-should-be-a-pwa).
- Jason Grigsby outlines “The Business Case for Progressive Web Apps” (https://cloudfour.com/thinks/the-business-case-for-progressive-web-apps/).
- Google released a collection of scripts and tools for going offline called Workbox (https://developers.google.com/web/tools/workbox/).
- To get started with your manifest and service worker, you can paste your website’s URL into PWA Builder (http://preview.pwabuilder.com/).
- Lighthouse is a great testing tool for progressive web apps that’s now bundled into Chrome’s Developer Tools under the Audits panel (https://developers.google.com/web/tools/lighthouse/).
Monday, March 26th, 2018
Saturday, March 10th, 2018
Friday, January 26th, 2018
Chris has set up a whole site dedicated to someone-else’s-server sites with links to resources and services (APIs), along with ideas of what you could build in this way.
Friday, January 5th, 2018
Monday, October 23rd, 2017
I love what Ben is doing with this single-serving site (similar to my design principles collection)—it’s a collection of handy links and resources around voice UI:
Designing a voice interface? Here’s a useful list of lists: as many guiding principles as we could find, all in one place. List compiled and edited by Ben Sauer @bensauer.
BONUS ITEM: Have him run a voice workshop for you!
Thursday, September 7th, 2017
We’re getting rid of advertisers and digging back to our roots: community-based, community-built, and determinedly non-commercial.
A List Apart has given me so, so much over the years that becoming a supporter is quite literally the least I can do.
Monday, July 31st, 2017
Tuesday, April 18th, 2017
A step-by-step guide to building progressive web apps. It covers promises, service workers, fetch, and cache, but seeing as it’s from Google, it also pushes the app-shell model.
This is a handy resource but I strongly disagree with some of the advice in the section on architectures (the same bit that gets all swoonsome for app shells):
Start by forgetting everything you know about conventional web design, and instead imagine designing a native app.
Avoid overly “web-like” design.
What a horribly limiting vision for the web! After all that talk about being progressive and responsive, we’re told to pretend we’re imitating native apps on one device type.
What’s really disgusting is the way that the Chrome team are withholding the “add to home screen” prompt from anyone who dares to make progressive web apps that are actually, y’know …webby.
Monday, November 28th, 2016
I particularly enjoy teaching people who have zero previous experience of making a web page. There’s something about explaining HTML and CSS from first principles that appeals to me. I especially love it when people ask lots of questions. “What does this element do?”, “Why do some elements have closing tags and others don’t?”, “Why is it
textarea and not
input type="textarea"?” The answer usually involves me going down a rabbit-hole of web archeology, so I’m in my happy place.
But there’s only so much time at Codebar each week, so it’s nice to be able to point people to other resources that they can peruse at their leisure. It turns out that’s it’s actually kind of tricky to find resources at that level. There are lots of great articles and tutorials out there for professional web developers—Smashing Magazine, A List Apart, CSS Tricks, etc.—but no so much for complete beginners.
Here are some of the resources I’ve found:
- MarkSheet by Jeremy Thomas is a free HTML and CSS tutorial. It starts with an explanation of the internet, then the World Wide Web, and then web browsers, before diving into HTML syntax. Jeremy is the same guy who recently made CSS Reference.
- Learn to Code HTML & CSS by Shay Howe is another free online book. You can buy a paper copy too. It’s filled with good, clear explanations.
- Zero to Hero Coding by Vera Deák is an ongoing series. She’s starting out on her career as a front-end developer, so her perspective is particularly valuable.
If I find any more handy resources, I’ll link to them and tag them with “learning”.
A whole lotta CSS properties and values gathered together in one place. The one-page view is a bit overwhelming, but search and collections can get you to the right bit lickety-split.
Wednesday, June 29th, 2016
This looks like a great resource for beginners looking to learn HTML and CSS.
Friday, April 15th, 2016
If you want to keep up to date with all the coolest stuff landing in CSS, I recommend bookmarking this ever-changing page.
Friday, April 1st, 2016
Monday, March 7th, 2016
The Buckminster Fuller Institute has put together this collection of resources which explain the ideas behind “comprehensive anticipatory design science.”
Seems especially relevant in light of the first issue of the Journal of Design and Science from MIT.
The legacy of the Black Mountain College lives on.