Tags: ai

498

sparkline

Monday, January 14th, 2019

Sunday, January 13th, 2019

The Flexbox Holy Albatross | HeydonWorks

Er …I think Heydon might’ve cracked it. And by “it”, I mean container queries.

This is some seriously clever thinking involving CSS custom properties, calc, and flexbox. The end result is a component that can respond to its container …and nary a media query in sight!

Monday, January 7th, 2019

Angular, Autoprefixer, IE11, and CSS Grid Walk into a Bar… - daverupert.com

Dave on the opaqueness of toolchains:

As toolchains grow and become more complex, unless you are expertly familiar with them, it’s very unclear what transformations are happening in our code. Tracking the differences between the input and output and the processes that code underwent can be overwhelming. When there’s a problem, it’s increasingly difficult to hop into the assembly line and diagnose the issue.

There’s a connection here to one of the biggest issues with what’s currently being labelled “AI”:

In the same way AI needs some design to show its work in how it came to its final answer, I feel that our automated build tools could use some help as well.

I really like this suggestion for making the invisble visible:

I sometimes wonder if Webpack or Gulp or [Insert Your Build Tool Here] could benefit from a Scratch-like interface for buildchains.

Thursday, January 3rd, 2019

Elemental haiku

An ode for every element in the periodic table, in the form of a haiku.

Saturday, December 29th, 2018

A New Mailing List, Goodbye Instagram?, Future Book Hello Again — Roden Explorers Archive

Craig’s slow walk away from Instagram:

I want to have a place very far apart from that, where I can post photos on my own terms. Not have an algorithm decide which of my posts is best (have you noticed Instagram making the second photo in series appear first in the carousel?). And I don’t want to be rewarded for being anodyne, which is what these general algorithms seem to optimize for: things that are easily digestible, firmly on the scale of “fine, just fine.” It becomes a self-fulfilling prophecy, as the more boring stuff we shove into our eyeballs, the more boring our taste becomes.

Friday, December 28th, 2018

Malicious AI Report

Well, this an interesting format experiment—the latest Black Mirror just dropped, and it’s a PDF.

Tumble log xyz

Kevin made this handy catch-all service for hosting Tumblr blogs on their own domain (which can bypass Tumblr’s annoying Oath interstital). Here’s mine.

Saturday, December 22nd, 2018

The ‘Future Book’ Is Here, but It’s Not What We Expected | WIRED

Craig writes about reading and publishing, from the memex and the dynabook to the Kindle, the iPhone, and the iPad, all the way back around to plain ol’ email and good old-fashioned physical books.

We were looking for the Future Book in the wrong place. It’s not the form, necessarily, that needed to evolve—I think we can agree that, in an age of infinite distraction, one of the strongest assets of a “book” as a book is its singular, sustained, distraction-free, blissfully immutable voice. Instead, technology changed everything that enables a book, fomenting a quiet revolution. Funding, printing, fulfillment, community-building—everything leading up to and supporting a book has shifted meaningfully, even if the containers haven’t. Perhaps the form and interactivity of what we consider a “standard book” will change in the future, as screens become as cheap and durable as paper. But the books made today, held in our hands, digital or print, are Future Books, unfuturistic and inert may they seem.

Friday, December 7th, 2018

Design process for the messy in-between » cog & sprocket

Designing your design process:

  1. Know your strengths and focus resources on your weaknesses.
  2. Learn to identify the immovable objects.
  3. What has to be perfect now and what can be fixed later?

Thursday, December 6th, 2018

Four Days Trapped at Sea With Crypto’s Nouveau Riche

A brilliantly written piece by Laurie Penny. Devestating, funny, and sad, featuring journalistic gold like this:

John McAfee has never been convicted of rape and murder, but—crucially—not in the same way that you or I have never been convicted of rape or murder.

Tuesday, December 4th, 2018

Rams — Gary Hustwit

The newest Gary Hustwit film is a documentary about Dieter Rams, featuring plinkity music by Brian Eno.

Rams is a design documentary, but it’s also a rumination on consumerism, materialism, and sustainability.

Saturday, November 24th, 2018

This is the story of the ZX81…

This could’a, should’a, would’a been a great blog post.

March 1981: Shakin’ Stevens was top of the charts, Tom Baker was leaving Doctor Who and Clive Sinclair was bringing computers to the masses. Britain was moving into a new age, and one object above all would herald its coming.

Tuesday, November 13th, 2018

Tweeting for 10,000 Years: An Experiment in Autonomous Software — Brandur Leach

Taking the idea of the Clock of the Long Now and applying it to a twitterbot:

Software may not be as well suited as a finely engineered clock to operate on these sorts of geological scales, but that doesn’t mean we can’t try to put some of the 10,000 year clock’s design principles to work.

The bot will almost certainly fall foul of Twitter’s API changes long before the next tweet-chime is due, but it’s still fascinating to see the clock’s principles applied to software: longevity, maintainability, transparency, evolvability, and scalability.

Software tends to stay in operation longer than we think it will when we first wrote it, and the wearing effects of entropy within it and its ecosystem often take their toll more quickly and more destructively than we could imagine. You don’t need to be thinking on a scale of 10,000 years to make applying these principles a good idea.

Sunday, November 4th, 2018

When your design system fails — HeyDesigner

You could create components that strike the perfect balance between reuse and context sensitivity. But defining the components of your design system is just the first step. It has to make its way into the product. If it doesn’t, a design system is like a language with no extant literature or seminal texts.

Marissa Christy outlines the reasons why your design system might struggle:

  1. The redesign isn’t prioritized
  2. The tech stack is changing
  3. Maintenance takes discipline

But she also offers advice for counteracting these forces:

  1. Get buy-in from the whole team
  2. Prioritize a lightweight re-skin on older parts of the product
  3. Treat a design system like any other product project: start small
  4. Don’t wait for others. Lead by example.
  5. Finally, don’t compare yourself to others on the internet

Tuesday, October 9th, 2018

» Baikonur, Earth

A new impressionistic documentary about Space City.

Monday, October 8th, 2018

Sass Selectors: To Nest Or Not To Nest? | Brad Frost

The fascinating results of Brad’s survey.

Personally, I’m not a fan of nesting. I feel it obfuscates more than helps. And it makes searching for a specific selector tricky.

That said, Danielle feels quite strongly that nesting is the way to go, so on Clearleft projects, that’s how we write Sass + BEM.

I, Maintainer

Maintaining an open source project is a rollercoaster ride with high peaks and very low troughs.

Release frequency is down. Questions increasingly go unanswered. Issues remain in a triage, unresolved state. Uncertainty and frustration brew within the community room.

Brian’s experience with Pattern Lab very much mirrors Mark’s experience with Fractal. The pressure. The stress. But there’s also the community.

A maintainer must keep the needs of their project, their community, and their own needs in constant harmony.

This is hard!

Thursday, October 4th, 2018

Infovore » Pouring one out for the Boxmakers

This is a rather beautiful piece of writing by Tom (especially the William Gibson bit at the end). This got me right in the feels:

Web 2.0 really, truly, is over. The public APIs, feeds to be consumed in a platform of your choice, services that had value beyond their own walls, mashups that merged content and services into new things… have all been replaced with heavyweight websites to ensure a consistent, single experience, no out-of-context content, and maximising the views of advertising. That’s it: back to single-serving websites for single-serving use cases.

A shame. A thing I had always loved about the internet was its juxtapositions, the way it supported so many use-cases all at once. At its heart, a fundamental one: it was a medium which you could both read and write to. From that flow others: it’s not only work and play that coexisted on it, but the real and the fictional; the useful and the useless; the human and the machine.

Friday, September 28th, 2018

What is Modular CSS?

A walk down memory lane, looking at the history modular CSS methodologies (and the people behind them):

Sunday, September 23rd, 2018

Service workers in Samsung Internet browser

I was getting reports of some odd behaviour with the service worker on thesession.org, the Irish music website I run. Someone emailed me to say that they kept getting the offline page, even when their internet connection was perfectly fine and the site was up and running.

They didn’t mind answering my pestering follow-on questions to isolate the problem. They told me that they were using the Samsung Internet browser on Android. After a little searching, I found this message on a Github thread about using waitUntil. It’s from someone who works on the Samsung Internet team:

Sadly, the asynchronos waitUntil() is not implemented yet in our browser. Yes, we will implement it but our release cycle is so far. So, for a long time, we might not resolve the issue.

A-ha! That explains the problem. See, here’s the pattern I was using:

  1. When someone requests a file,
  2. fetch that file from the network,
  3. create a copy of the file and cache it,
  4. return the contents.

Step 1 is the event listener:

// 1. When someone requests a file
addEventListener('fetch', fetchEvent => {
  let request = fetchEvent.request;
  fetchEvent.respondWith(

Steps 2, 3, and 4 are inside that respondWith:

// 2. fetch that file from the network
fetch(request)
.then( responseFromFetch => {
  // 3. create a copy of the file and cache it
  let copy = responseFromFetch.clone();
  caches.open(cacheName)
  .then( cache => {
    cache.put(request, copy);
  })
  // 4. return the contents.
  return responseFromFetch;
})

Step 4 might well complete while step 3 is still running (remember, everything in a service worker script is asynchronous so even though I’ve written out the steps sequentially, you never know what order the steps will finish in). That’s why I’m wrapping that third step inside fetchEvent.waitUntil:

// 2. fetch that file from the network
fetch(request)
.then( responseFromFetch => {
  // 3. create a copy of the file and cache it
  let copy = responseFromFetch.clone();
  fetchEvent.waitUntil(
    caches.open(cacheName)
    .then( cache => {
      cache.put(request, copy);
    })
  );
  // 4. return the contents.
  return responseFromFetch;
})

If a browser (like Samsung Internet) doesn’t understand the bit where I say fetchEvent.waitUntil, then it will throw an error and execute the catch clause. That’s where I have my fifth and final step: “try looking in the cache instead, but if that fails, show the offline page”:

.catch( fetchError => {
  console.log(fetchError);
  return caches.match(request)
  .then( responseFromCache => {
    return responseFromCache || caches.match('/offline');
  });
})

Normally in this kind of situation, I’d use feature detection to check whether a browser understands a particular API method. But it’s a bit tricky to test for support for asynchronous waitUntil. That’s okay. I can use a try/catch statement instead. Here’s what my revised code looks like:

fetch(request)
.then( responseFromFetch => {
  let copy = responseFromFetch.clone();
  try {
    fetchEvent.waitUntil(
      caches.open(cacheName)
      .then( cache => {
        cache.put(request, copy);
      })
    );
  } catch (error) {
    console.log(error);
  }
  return responseFromFetch;
})

Now I’ve managed to localise the error. If a browser doesn’t understand the bit where I say fetchEvent.waitUntil, it will execute the code in the catch clause, and then carry on as usual. (I realise it’s a bit confusing that there are two different kinds of catch clauses going on here: on the outside there’s a .then()/.catch() combination; inside is a try{}/catch{} combination.)

At some point, when support for async waitUntil statements is universal, this precautionary measure won’t be needed, but for now wrapping them inside try doesn’t do any harm.

There are a few places in chapter five of Going Offline—the chapter about service worker strategies—where I show examples using async waitUntil. There’s nothing wrong with the code in those examples, but if you want to play it safe (especially while Samsung Internet doesn’t support async waitUntil), feel free to wrap those examples in try/catch statements. But I’m not going to make those changes part of the errata for the book. In this case, the issue isn’t with the code itself, but with browser support.