Illustration courtesy Matt McLaughlin.

It is 9:18 AM on August 21, 2021. You have just finished eating your space-breakfast, and you're ready to get back to work maintaining the web presence for Omni Consumer Products. After about an hour, you find your latest change fails an acceptance test. It turns out to be a bug in "RedactSelect", an open source "multiselect" web component you've been using. Looks like it hasn't been updated in years, owing largely to its maturity and stability. "No problem," you think, "I'll just fix the bug and fork it."

Tagged:

Starting today, my long time collaborator Jory Burson becomes Bocoup’s new CEO. I am moving into a Research Director role to explore long-term open and inclusive technology development at Bocoup.

Jory and Boaz in front of the Bocoup billboard, Spring 2014. Jory and Boaz in front of the Bocoup billboard, Spring 2014.

Tagged:

Building an Open Source interactive with the Coral Project

Tagged:

Ready your easels – we're getting ready to paint a beautiful sales picture with our new VP of Sales, Mary Monat!

Mary joins us from B-Stock Solutions and brings years of sales leadership and deep love of process to her new role here at Bocoup. We are thrilled to have her at the helm of our sales strategy and development.

Tagged:

In the last two posts we talked about laying the foundation for an accessible website and making sure keyboard users can navigate your site—this week we're gonna dive into the visual and talk about color. As it turns out, color is a more complex topic than it might seem. We'll start with a quick run-through of some thing designers and developers should be looking for as they create their sites.

Tagged:

animating lines with missing data

While working on visualizing the results of internet speed test data for Measurement Lab, it became clear that there wouldn't always be data for every geographic location on every single day. We might go several days without meeting a minimum threshold of tests, meaning there would be gaps in our data. This is a pretty common problem when working with time series data, and one that is easily ignored by connecting the points that have data-- but it feels wrong and it can be misleading at best.

Tagged:

The modern workforce is going digital. Teams are taking advantage of new communication tools in order to meet people where they are and allowing them to work from wherever they are most fulfilled and inspired, be it a home office in Montana, a coffee shop in Toronto, or a War Room at WeWork. While this remote-friendly attitude has been quickly adopted by organizational functions like engineering, marketing, and sales, design groups have lagged behind, stuck with the idea that teams need to be in the same physical room in order to create great designs.

Tagged:

Smooth path interpolation with d3-interpolate-path

D3 provides us with many of the basic building blocks needed to make charts in browsers while also making it extremely easy to animate them. One of the most common charts created with D3 is a line chart, often consisting of a series of SVG <path> elements to visualize the data. In this post, I dissect how the animation of paths work in D3 and how they can be improved. The final result has been packed and released as a plugin d3-interpolate-path that you can use in your own line charts.

How do paths work?

Tagged:

Our last article about BoxArt showed how to use BoxArt's Animated component to animate a tile-dropping game built in React. This time, we are going to look at some features of how Animated optimizes animations for performance.

The Beastliness of Layout Thrash

There's a performance nightmare constantly threatening when you're animating in the browser.

Tagged:

Have you ever tried writing animations into a website? It's complicated. There's lots of room for error, and no tool seems to fill every animation need. Recently, while writing some DOM-based games, the Bocoup team realized there wasn't existing software for all of the projects' animation needs. To help fill the gaps, Bocoup created BoxArt, a collection of tools for creating DOM-based games with React.

Tagged: