chsmc.org Open in urlscan Pro
2a06:98c1:3121::3  Public Scan

Form analysis
0 forms found in the DOM

Text Content

CHSMC.ORG


A WEBLOG BY CHASE MCCOY ABOUT EXPLORING AND BUILDING THE WORLD WIDE WEB.

 * Email
 * RSS
 * Library
 * Lab


ABOUT THE EDITOR

Chase is a professional designer and amateur human currently working on design
systems at Stripe.


ELSEWHERE

 * GitHub
 * Instagram
 * Mastodon
 * Spotify
 * Twitter


NOW PLAYING


Slow Dancing in a Burning Room - Live at the Nokia Theatre, Los Angeles, CA -
December 2007 by John Mayer


LINKED LIST

Things that caught my eye on the web, updated sporadically.

 * GitHub - dhowe/ritajs: RiTa for JavaScript
 * Portfolio — Kelly Chong
 * Learning Log, July 2024
 * Directed Edges / Design systems coaching and consulting
 * Plain Vanilla
 * ertdfgcvb
 * Tulip Creative Computer. Now available
 * GitHub Next | Vitale
 * Why I Finally Quit Spotify
 * JTD Type Foundry and Design Studio


BLOGROLL

 * Alexander Obenauer
 * Amy Hupe
 * anhvn
 * arcana dot computer
 * Audacious Fox
 * Chen Hui Jing
 * Chris Coyier
 * Frank Chimero
 * Interconnected
 * James Little
 * Jim Nielsen
 * Jonnie Hallman
 * Jules Forrest
 * Kicks Condor
 * Maggie Appleton
 * Matt Ström
 * maya.land
 * Mu-An Chiou
 * Piper Haywood
 * pketh
 * Robin Rendle
 * Robin Sloan
 * Soroush Khanlou
 * thesephist
 * Tom Critchlow
 * Zach Leatherman

Museo.app

An open source web interface that helps you find free-to-use images from some of
the world’s best museums and libraries:

 * The Art Institute of Chicago
 * The Rijksmuseum
 * The Harvard Art Museums
 * And more...

--------------------------------------------------------------------------------

Typeset in good old Verdana and Wallau Unzial. Built with Eleventy and hosted on
Netlify. Thanks for stopping by ♥

Aug 11

I stumbled upon a great site which acts as an explainer for vanilla web
development techniques called, well, Plain Vanilla.

When I was starting out as a developer I had a hard time learning the basics of
the web platform because so many resources and examples used a framework. It was
mostly jQuery at the time, and today I’d assume React and Tailwind are the most
common starting points for new developers.

But the web has come a long way! A framework might not be necessary for lots of
projects, and going as far as you can with the grain of the web comes with lots
of benefits. I’m happy to see a high quality resource like this that can help
folks avoid complexity and start simple.

From 🌻 Internet Archive by Jasmine Sun:

> If you don’t tell the story of your life, someone else will do it for you.
> Google, Instagram, and the sketchy recollections of strangers can offer
> fragments of a mirrored self. You can dress up in the identities that others
> draw; you can outsource your memory and legacy to the highest corporate
> bidder. You can look back through your Oura ring, your credit score, your
> likes. From Charlie Squire again: “There is museum upon museum dedicated to
> myself within the geography of my phone, and like all museums they are
> fallible to misrepresentation and selective curation, and like most
> museum-goers I choose to believe they are peddling me an objective truth.”

Aug 8

I’m fascinated by the way that CSS, as it becomes more powerful, can be used as
a visual language for representing the physical world. Combined with the
longevity of the web, which strives to never break backwards compatibility, it’s
a powerful tool for sending information into the future.

Here’s another example I stumbled on: Orbit is a CSS framework for radial
constructs. It provides an easy way to arrange elements around and within a
circular area.

I grew up dreaming about the esoteric user interfaces seen in science fiction
films, many of which featured circular screens, control panels, and UIs. Now we
can achieve those with CSS!

I also love the whimsical nature of Orbit’s API, which requires a single “big
bang” element on the page, and uses a “gravity-spot” class for creating an area
with a radial layout. The library comes with support for adding orbits, slices,
satellites, capsules, and more around user-defined gravity spots.

Read the docs for Orbit and check out the examples to learn more.

From Mini-Cure for Doomscrolling by meghna rao:

> Most importantly, a mountain’s currency is physical labor. I need to hike a
> lot to get to the vast part. Social media’s currency is time. I don’t need to
> do much to get there.


CHSMC.ORG

August 4, 2024

Programming note: the domain for this website has changed! chasem.co is out, and
chsmc.org is in.

All existing links and feeds should redirect automatically, because good URIs
don’t change, but please let me know if you see otherwise.

Why the switch? A few things:

 * Pronouncing my email address (@chasem.co) always resulted in spelling it out
   anyway, and “do you mean .com?” was a frequent response.
 * chsmc is increasingly the handle I’m using online whenever chase is not
   available (so, most of the time).
 * The equivalent .com was too expensive, and the .net is taken.
 * I was inspired by some of the great blogs I read that use .org domains.
   kottke.org, marco.org, waxy.org, macwright.org, pketh.org all come to mind.

My hope is that this is a move to my forever domain, but if someone at JPMorgan
Chase wants to chat about donating a better domain, they can find me (and so can
you) at hi@chsmc.org


BROWSE THE ARCHIVES


FEATURED

 * Boku no Natsuyasumi
 * How blogs shaped the web
 * Ambient internet
 * Crayons, craft paper, and CSS
 * Design systems as knowledge graphs
 * Measuring the health of a design system
 * Building Sprout Social’s component library


BY YEAR

 * 2024
 * 2023
 * 2022
 * 2021
 * 2020
 * 2019
 * 2018
 * 2017
 * 2016
 * 2013


IN AN ATTITUDE OF DEFIANCE

August 3, 2024

I recently showed a few friends around Chicago, and as we passed by the Art
Institute and the two lions guarding the entrance, I wondered if they had names
like the lion sculptures outside the New York Public Library.

Those lions are named Patience and Fortitude, and were modeled by Edward Clark
Potter in time for the library’s dedication in 1911.

New York’s lions have had several nicknames throughout their lives, but received
their current names from Mayor LaGuardia in the 1930s based on the qualities he
thought New Yorkers would need to have to survive the depression.

So what about the lions in the second city? Strangely enough, they were also
created by a sculptor named Edward.

Edward Kemeys didn’t names to these lions, which took their places in 1894, but
did assign them unofficial designations based on their poses. The lion on the
north pedestal is “on the prowl,” while the one to the south is “in an attitude
of defiance.”

We don’t seem to assign names to the objects around us as much as we used to,
but I think it’s an important part of creating meaning and connecting to our
environment and our history.

Next time you’re in downtown Chicago, don’t forget to say hi to Prowl and
Defiance.

From The Internet Wants to Be Fragmented by Noah Smith:

> This is how we restore the old internet — not in its original form, but in its
> glorious, fragmented essence. People call Twitter an indispensable public
> space because it’s the “town square”, but in the real world there isn’t just
> one town square, because there isn’t just one town. There are many.

From Women in Hypertext: On Judy Malloy and Cathy Marshall’s Forward Anywhere by
Are.na:

> The task of hypertext is not to manufacture connections, but to discover where
> they have always been.

From Why I Finally Quit Spotify by By Kyle Chayka:

> Listeners become alienated from their own tastes; when you never encounter
> things you don’t like, it’s harder to know what you really do.

> Rather than optimizing for the user’s experience, it optimizes for the
> extraction of profit. If Spotify succeeds at turning us all into passive
> listeners, then it doesn’t really matter which content the platform licenses.
> As Fuller put it, “It’s about ‘How do you get through as much music as you can
> so you keep paying for it?’ ”

From Entry Points by Ava:

> Life is not something you perform for the benefit of other people. When you
> perform for other people, you rob yourself of the chance to relate to them in
> a real way. Everything collapses inwards, becomes solipsistic: you and the
> camera, you and the mirror, you and the void. But we need the Other in order
> to feel real. People are doorways out of solipsism.

From Don't Trust the (Design) Process by Jenny Wen:

> The way I’ve seen great work made isn’t using any sort of design process. It’s
> skipping steps when we deem them unnecessary. It’s doing them out of order
> just for the heck of it. It’s backtracking when we’re unsatisfied. It’s
> changing things after we’ve handed off the design. It’s starting from the
> solution first. It’s operating on vibes and intuition. It’s making something
> just for the sake of making people smile. It’s a feeling that we nailed it.


FIGMA AI

June 29, 2024

Figma announced a host of new AI-powered features this week at their annual
conference, and they have been received by designers with both cheer and dismay.

Tools like the ones that were announced are showing up across the industry, but
as the most popular tool for modern product design, Figma will make them
commonplace, and we’ll soon be taking them for granted just like any other
advancement in design tools over the past several decades.

Some folks are panicked, some are excited, and some are indifferent. I’m
somewhere in the middle, but I do have concerns that are exacerbated by these
new tools and capabilities.

To explain those concerns, I’ll draw a distinction between two types of
AI-powered features that Figma announced this week:

 1. Using AI to eliminate or reduce the time spent on constructing designs and
    prototypes in Figma.
 2. Generating UI designs from scratch, based on a text prompt, using models
    trained on common product interfaces (and, in the future, the work created
    by Figma users, unless they opt out).

I’m excited for and have very few concerns about type #1, because the job of
product designers is not to create Figma mockups—it’s to solve problems and ship
software.

To the degree that new features allow us to spend less time creating ephemeral
artifacts that are merely a stop on the way to a final destination, I’m sold.

Those features involve things like automatically wiring up prototypes, filling
in a mockup with fake data, translating strings into other languages, automatic
layer naming, generating placeholder images, etc. These are all good and
helpful, and are geared towards saving designers time to spend on things that
they are uniquely positioned poised to do.

But what about type #2, the feature that Figma labels in its UI as “Make
designs”? This allows anyone to enter a prompt and have Figma create a mockup
from scratch. In the future, the company plans to train their models on designs
created by users.

Some are concerned that this type of feature might take jobs away from product
designers, and some see it as simply another way to automate away the tedious
parts of a designer’s job in order to give them more time to do what they do
best.

I think it’s both, and/but I don’t think it’s because of AI.

There are many companies, and the number seems to be increasing, that are more
than happy to turn the jobs of designers over to folks who are able to wield
tools to produce a facsimile of what a designer is actually capable of.

For those that see the primary value of designers as producing interface
mockups, the advent of new AI tools in the vein of Figma’s “make designs” button
will absolutely seem like a viable replacement for the work of a designer. And
this isn’t limited to AI—as design tools become more accessible and approachable
to everyone (which I consider a net positive on the whole), the barrier to
creating something that looks, on the surface, like the work of a designer is
lowered.

Canva is an excellent example of how this is not strictly because of AI, but
might certainly be accelerated by it. The commodification of design as a
practice began long before the widespread availability of generative AI.

Product managers, engineers, and others are now able to produce designerly
artifacts easier than ever before, and too many companies are willing to accept
the sub-par solutions that result in order to cut costs and move faster.

Machines will not make our jobs obsolete, but corporations will, and they’ll use
smarter and smarter machines as an excuse to do so.

From The Anthropoid Condition by Brían Hanrahan:

> It would take a lot of thought to detail my research techniques but they
> include the following imperatives: write early in the morning, cultivate
> memory, reread core books, take detailed reading notes, work on several
> projects at once, maintain a thick archive, rotate crops, take a weekly
> Sabbath, go to bed at the same time, exercise so hard you can’t think during
> it, talk to different kinds of people including the very young and very old,
> take words and their histories seriously (i.e., read dictionaries), step
> outside of the empire of the English language regularly, look for vocabulary
> from other fields, love the basic, keep your antennae tuned, and seek out
> contexts of understanding quickly (i.e., use guides, encyclopedias, and
> Wikipedia without guilt).

Jun 24

Here’s a thing I never would have imagined possible: an LLM embedded into a
font.

Many applications (including Chrome and Firefox) use a font rendering engine
called HarfBuzz, and HarfBuzz recently added support for running arbitrary
WebAssemply code in order to “shape” the pixels that are drawn onscreen when
rendering a font.

You can see the font, llama.ttf, in action in this video.

Over the past several decades we’ve seen computers be embedded into more and
more contexts. Today, computers are everywhere, from our cars to the locks on
our doors. Computers have even been built and embedded into the digital worlds
of video games.

I wonder if, in the years to come, it might be LLMs that get embedded into all
the things.

A smart refrigerator that can reason about what’s inside and maintain a grocery
list for you? A font that completes your sentences? A doorbell that answers in
your voice and tone when you’re not at home? In-flight entertainment that
generate content based on your preferences?

Strange times ahead.

From The Future Is Built on Solid Foundations by Brad Frost:

> Just so it’s said: creating a design system’s assets has never been the end
> game, but rather an important foundational layer for other important work to
> stand on. What you do with the design system is where the excitement and focus
> should be. Whether it’s the ability to blast out higher-quality work faster
> than ever, explore new technologies, or spend more time building
> relationships, the opportunities are many.

Jun 20

One of my favorite forms of online content is when someone finds an interesting,
obscure story from the past and manages to extract a lesson that’s widely
applicable today.

I like to think of it as something like fan fiction: we, as individuals, retcon
and re-tell stories from the past to help us make sense of the present.

Elan Ullendorff published a great example of this recently in a piece called
Should this be a map or 500 maps?

It features the story of a king in 18th century Spain who ordered a geographer
to create a map. The geographer attempted to delegate this work by asking the
priests of towns across the country to create maps of their own provinces.

The idea was to put all of the maps together in the end, but because there was
no standardization, all of the maps were created in entirely different forms.
Those forms are beautiful! But ultimately not useful as an actual map.

Rather than seeing this as a failure, Elan asks us to consider the things we
might be losing when we impose structure, standardization, and process. We might
have gained a useful map, but we would have lost the creative perspective that
each of the pieces represents.

> I’m obsessed with this story because it gets at a dynamic embedded within
> everything designed that we rarely think about. Once you notice it, it is
> present in almost every conversation, at every aperture and zoom level:
> modularity is inversely correlated to expressiveness.

This hit me like a rock, in no small part because of my career focus of choice:
design systems.

Fortunately, Elan goes on to reassure me:

> I am someone that preaches expressiveness to a fault, but the truth is that I
> make decisions to scale all the time. I don’t necessarily see this as a
> compromise of values. There is beauty in trying to express something specific;
> there is beauty too in finding compromises to create something epic and
> collective.

Hear hear.

From In This Essay I Will: On Distraction by David Schurman Wallace:

> In order to succeed in a hypercapitalist society, we must focus. And to focus
> usually means to specialize: acquiring a skill, becoming a special version of
> ourselves—a person with a “bit” that distinguishes us from the cross section
> of people who otherwise share our Google AdSense data metrics. It can be hard
> work to become this particular, outward-facing self.

From Magic for English Majors by Ethan Mollick:

> To get the AI to do unique things, you need to understand parts of culture
> more deeply than everyone else using the same AI systems. So now, in many
> ways, humanities majors can produce some of the most interesting “code.”

From The art of working in public / Robin by Robin:

> When you let people inside your head, they come away smarter. When you work in
> public, you create an emissary (media cyborg style) that then walks the earth,
> teaching others to do your kind of work as well. And that is transcendently
> cool.

From Work on What Matters. by lethain.com:

> Teaching a company to value something it doesn’t care about is considerably
> the hardest sort of work you can do, and it often fails, so you should do as
> little of it as you can, but no less.


A VISUAL LANGUAGE FOR MUSIC AND TIME

June 14, 2024

I’ve remarked before on my gratefulness for CSS as the ubiquitous and expressive
visual language of our times, a sort of design Esperanto (that is actually
widely spoken).

One would struggle to find a more perfect example of this than Scribe, by
Stephen Band. Scribe is a custom element (<scribe-music>) which renders
responsive music notation in HTML and CSS grid.

Here’s an example, rendered inline via Scribe:

0 meter 4 1 0 chord D maj 4 0 note F#5 0.2 2 1 note A4 0.2 1 4 note D4 0.2 1

To really understand the magic happening here, you must read Stephen’s excellent
blog post about how it all works.

It’s remarkable that this is possible using CSS, and even more remarkable that
the language itself morphs to become a syntax not for describing elements on a
web page, but to describe pitch over time. CSS as interface for the natural
world.

Under the hood, Scribe uses markup like this to represent music in time:

<div class="stave bar">
  <svg class="clef" data-pitch="B4">…</svg>
  <svg class="flat" data-beat="1" data-pitch="Bb4">…</svg>
  <svg class="head" data-beat="1" data-pitch="Bb4">…</svg>
  <svg class="head" data-beat="2" data-pitch="D4">…</svg>
  <svg class="head" data-beat="3" data-pitch="G5">…</svg>
  <svg class="rest" data-beat="4" data-pitch="B4">…</svg>
</div>

Elegant, useful, and thanks to the hard-won stability of the web platform:
durable for generations to come.

One might wonder, what other natural or mathematical systems might we be able to
represent in CSS? Another example that crossed my feeds recently is time-based
CSS animations by Yuan Chuan.

Yuan creates a variable in CSS representing time, and uses keyframe animations
to increment the value of the variable by 1 every millisecond. Suddenly CSS has
a timer, something powerful for generative art and animation where time itself
is used as an input variable.

Need to adjust the frame rate? Easy:

/* 8 fps */
animation-timing-function: step(calc(86400000 / (1000 / 8)));

Yuan has some great examples of how this can be combined with functions in CSS
like min(), round(), and newly added trigonometric functioned like sin(), cos(),
etc. to create all sorts of useful effects. My favorite example is using all of
this to create a clock with a perfectly ticking second hand.

In terms of representing natural systems in CSS, this reminds me of how often
I’ve wanted to be able to generate and use random numbers in CSS at runtime. To
my delight, it looks like that’s in the works.

From Should This Be a Map or 500 Maps? by Elan Ullendorff:

> I am someone that preaches expressiveness to a fault, but the truth is that I
> make decisions to scale all the time. I don’t necessarily see this as a
> compromise of values. There is beauty in trying to express something specific;
> there is beauty too in finding compromises to create something epic and
> collective.


NEW MAGIC FOR ANIMATIONS IN CSS

May 25, 2024

There are two new features coming to CSS that will make it much easier to
further avoid JavaScript when implementing animations:

 1. Animating to and from display: none; for the sake of enter/exit animations.
 2. Animating to and from the intrinsic size of an element (such as height:
    auto;).

Traditionally, animating something into or out of the screen (as opposed to just
hiding it visually) required JavaScript to remove the element from the page
after waiting for the animation or transition to complete. No longer!

When these new features land in browsers, you’ll be able to animate to display:
none like any other property using a keyframe animation:

.item {
  animation: fade-out 0.5s forwards;
}

@keyframes fade-out {
  100% {
    opacity: 0;
    display: none;
  }
}

Neat!

You can also do the same thing with a CSS transition, but you’ll need to set the
new transition-behavior property to allow-discrete for that to work. I can see
something like * {transition-behavior: allow-discrete} becoming a part of my CSS
reset in the future to enable this behavior by default.

But what about the opposite case? You have an element that’s currently not
displayed and you want to animate it as it appears. Again, we typically use
JavaScript for this today to ensure the initial styles are set properly and our
element doesn’t display visually on the page before it has animated.

Now, we can specify the starting style like this:

.item {
	@starting-style {
    opacity: 0;
	}
	
	opacity: 1;
  transition: opacity 0.5s;
}

Elegant and useful. If you want to learn more about these new powers, I
recommend checking out this post on the Chrome for Developers blog.

The second new feature coming to CSS is the ability to animate to and from an
element’s intrinsic size. The most common use case for this is collapsible
areas: we want them to be height: 0px when closed, and when opened their height
should be automatic based on the contents.

Because CSS has historically not allowed for animating to height: auto;, we’ve
had to use JavaScript to measure the height of the contents and animate to that
pixel value.

When this feature lands in browsers, we’ll instead be able achieve this like so:

.item { 
  height: 0; 
}

.item.open { 
  height: calc-size(auto);
}

The magic comes from the calc-size function, which is a curious API choice—why
not just use the existing calc() function? Here’s a comment on the CSS working
group’s draft for this feature that explains why.

--------------------------------------------------------------------------------

These features are just a few of the many ways that CSS is growing and becoming
more powerful and expressive. To learn about all of the other great new things
coming, check out this excellent video by Una Kravets from Google I/O.

Una says that we’re in the golden era for web UI, and I couldn’t agree more.

From The Rise of Emotional Divestment by Heather Havrilesky:

> This state of affairs goes beyond compassion fatigue. Our around-the-clock
> overexposure to global human suffering, our daily feed of what we once
> considered catastrophic events — political, ecological, cultural — when
> combined with diminished attention spans, smaller and smaller chunks of
> content, and baked-in cross-platform imperatives to remain emotionally removed
> from any given person, place, or event, adds up to a kind of merciless
> sterility and an impatience with meatspace that we’ve never known before.

From More People Should Write by James Somers:

> That’s the promise: you will live more curiously if you write. You will become
> a scientist, if not of the natural world than of whatever world you care
> about. More of that world will pop alive. You will see more when you look at
> it.

From To Own the Future, Read Shakespeare by Paul Ford:

> The interdisciplinarian is essentially an exile. Someone who respects no
> borders enjoys no citizenship.

May 5

I really appreciated this write up from Jeremy Keith about his personal approach
and best practices for HTML web components.

Judging by the discourse, web components seem to be gaining in popularity
lately, and I’m very here for it.

Trying to build on the web using a component model was what led me (and others
I’m sure) into the arms of React many years ago. While I’m grateful for that
journey, and still believe React is the right choice for many projects, it gives
me a lot of comfort to know there’s a native tool I can reach for.

The tricky thing with web components, like the web platform in general, is the
flexibility. What makes it so powerful can also make it hard to learn, and even
harder to know if what you’re learning is the right or recommended path. It
takes time for best practices to form and percolate.


THE MOON TREES OF MISSISSIPPI

May 4, 2024

Many of my online acquaintances know that I live in Chicago, but I suspect they
might not know that I’m from a small university town in Mississippi called
Starkville.

Starkville is home to Mississippi State University, where I attended college and
studied Computer Science. In 2017 I graduated and moved to Chicago to start my
career.

At the time I was excited to escape the place where I spent so many of my
formative years, a place which was the symbol of mundanity for me and my
youthful ambitions.

Seven years later and I’m having coffee and catching up on my inbox when I
happened to find the latest issue of Claire Evans’ newsletter: a delightful
story about moon trees—that is, trees grown from seeds that traveled to space
and around the moon 34 times during the Apollo 14 mission.

Claire traces the history of the seeds, which were germinated into seedlings and
given out to foresters across the country before being largely forgotten about
and then eventually rediscovered and catalogued by NASA.

(By the way, don’t miss out on the wonderful website created to track the trees
by a NASA archivist.)

Today less than 100 moon trees remain, but as Claire goes on to describe, there
is a second generation of moon trees (so called “half-moons”) grown from the
seeds of original trees that remain today.

The location of one of these mother-trees, though, is what caught my attention:
it’s on the campus of Mississippi State University, my campus. All the times I
walked past this humble tree I had no idea it had been to space.

It’s such a pleasant surprise to have this story appear in my inbox and show me
something new about a place where I spent so much time.

While I lived there, I often felt suffocated by the mundanity of my home town.
This has reminded me that there are things to appreciate and interesting stories
(of perhaps cosmic proportion!) to discover in even the most mundane of places.
We just have to keep our eyes open and remember not to take anything for
granted.

If you’d like, you can buy a seedling Sycamore moon tree online descended from
the one on the MSU campus.


THE CASCADE

April 22, 2024

Hearty congrats to Robin Rendle who has turned his wonderful CSS-focused
newsletter into a good, old fashioned blog. The Cascade is beautiful, and is
already full of great content for CSS nerds like me.

The site is, generously, free to read, but member supported for $10/year.
Subscribing, for me, was an absolute no brainer.

I liked this bit from an issue of Robin’s personal newsletter that he sent after
the launch:

> There’s not enough words in the English language to describe how cool it is to
> build a little publishing machine. That rare, lightning-in-a-bottle feeling of
> throwing a few services together and building something greater than the sum
> of its parts.

It’s never been easier to create a website (a publishing machine!) for yourself
or your interests. The feeling of ownership you’ll have compared to publishing
on someone else’s platform is a powerful force in and of itself.

From Product Design Is Lost by Rune Madsen:

> Many designers and design teams now find themselves in a place between
> strategy and implementation, yet they are not fully empowered to influence
> either. As soon as a digital product takes its initial step towards becoming
> real, designers are relegated to the role of advisors without the necessary
> tools to challenge assumptions at the C-suite level.

> However, driven by a desire from businesses to turn design into a
> process-heavy, measurable function, we’re filling our time with checklists
> instead of focusing on the very thing that makes designers relevant: our
> ability to propose new points of view and delight users with meaningful
> experiences. These core competences that were inherited from graphic design
> have been replaced with a poor man’s version of an anthropology major where
> the act of design is mostly based on averaging user opinions.

From Software Is a Medium of Setbacks, but a Medium’s Limitations Don’t Define
the Artist by Baldur Bjarnason:

> Software is a creative industry with more in common with media production
> industries than housebuilding.
> 
> As such, a baseline intrinsically-motivated curiosity about the form is one of
> the most powerful assets you can have when doing your job. It helps you solve
> problems and come up with new ideas.

All the best designers and engineers I've worked with have this "curiosity about
the form"
From Making Films and Making Websites by Jim Nielsen:

> Similarly, in making websites, the only source of truth is the website people
> access and use. Everything else — from design system components to Figma mocks
> to Miro boards to research data et. al. — is merely a tool in service of the
> final form.

From Making the Internet Alive Again by Gaby Goldberg:

> Algorithms are informational gatekeepers. AI search tools, in an effort to
> show us the most relevant content in the most efficient format, may actually
> make obsolete our ability to have an Internet that feels uniquely our own.
> “Surfing the web” very well may be a thing of the past. Already, my sources of
> information and trust online have splintered. I read about current events on
> Twitter. I listen to music on Spotify. I shop on Amazon. The browser is a
> navigation engine to reach these places, but the search experience itself is
> fragmented across these highly specialized platforms.


BOKU NO NATSUYASUMI

March 24, 2024

Several months ago, in an issue of Spencer Chang’s newsletter, I discovered the
6 hour video review of a game called Boku no Natsuyasumi by Tim Rogers (known as
Action Button).

To call this a review is surely stretching the limits of the word’s meaning as
we know it.

Boku no Natsuyasumi, henceforth shortened as Bokunatsu, is a game for the
original PlayStation released 24 years ago in Japan. And only in Japan. It
centers on a young boy, Boku, spending a month of his summer vacation with his
aunt, uncle, and their family in the countryside of Japan in August of 1975.

Players can explore the countryside as Boku, collect bugs, fish, fly kites, and
other low-stakes activities you might expect from a child on summer break.

Slowly, you learn about the people around you and their stories.

Sounds simple, but watch Tim’s review and you’ll see that the game is a subtle
masterclass in storytelling, menu design, cinematography, typography,
skeuomorphism, Japanese culture, sound design, memory, and even mortality.

I became determined to experience the game myself, which is easier said than
done given that it was never released outside of Japan. I managed to find an
English patch, translated by a fan, for the game’s sequel Boku no Natsuyasumi 2:
Umi no Bouken-hen (My Summer Vacation 2: Sea Adventure Chapter). The sequel,
released two years after the original, also follows a boy named Boku vacationing
in the countryside in August of 1975.

Armed with the patch file, I needed 3 more items to complete my quest: a PS2
emulator, a PS2 BIOS (the software pre-installed on the console’s chipset), and
a copy of Boku no Natsuyasumi 2.

Luckily, the emulator is easy to come by. I downloaded the excellent PCSX2,
which is an open source PS2 emulator that works quite well on my MacBook Air.

Unfortunately, for Legal Reasons™ I cannot provide a link to the PS2 BIOS or the
the game itself, but a cursory Google search should turn up the files you need
without too much trouble.

With these 4 talismans in hand I was able to perform the necessary ritual of
resurrection: apply the English patch to the game, boot up the PS2 emulator,
load the game.

After a few clicks… paydirt.





An experienced gamer might find this process mundane, but to me it feels like
the internet equivalent of breaking open an ancient, hidden tomb. At this point
I could only imagine what treasures may lie within.

What I discovered is undoubtedly a work of art, made clear by my time playing
this iteration and from Tim’s review of the original. The games also happen to
be an example of the billions of bytes of lost media that are just waiting to be
rediscovered by someone who will appreciate them.

Here is a game, published 22 years ago, that has managed to evoke feelings of
nostalgia and wistfulness in me today, in 2024. This must be the closest thing
to time travel I’ll ever experience.

I knew lots about the game before playing due to Tim’s review (which, again, is
a 6 hour masterpiece), but there are two aspects I couldn’t fully appreciate
until playing: the game’s backgrounds and soundscapes.

First, the backgrounds. Bokunatsu makes use of a fixed perspective, where the
camera only changes angles when the character moves to another scene. Each area
that the user can move through is set upon a gorgeous hand-painted background.
If you’ve ever seen a Miyazaki film you have a sense for the feelings that these
backdrops create. A 3D modeled scene would never have evoked such a strong sense
of place, time, and character, and the creative decision to use hand drawn
backgrounds makes all the difference.

There’s a narrative purpose to the backgrounds as well, signaling the time of
day as they change throughout between different paintings for day, afternoon,
and night.

The backgrounds were done by artists at an animation studio called Kusanagi.
Here are the backgrounds they made for Bokunatsu 2, but I heartily encourage you
to browse through all of the art on their site.

Kazuo Oga is a famous background painter and the person responsible for many of
the backgrounds in your favorite Miyazaki films. Animation Obsessive had this to
say about him:

> That’s really the heart of it. Oga notices things — little things. He gets a
> feel for them. When he sits down to work, he brings with him all the
> unimportant details that matter the most. Then, with his paint, he creates an
> artwork that centers those details, elevates them. It’s more a way of seeing
> and feeling than it is a technique.

All the unimportant details that matter the most—paying attention to these
details are precisely what make Bokunatsu, from its backgrounds to the narrative
itself, so plainly striking.

The backgrounds are complimented by the soundscapes. These are, in my opinion,
the best part of the game.

Of all the characteristics of summer, it may be the sounds which I most
associate with the season. I grew up in the rural south, and Bokunatsu manages
to capture the droning sounds of summer in a way I’ve never experienced before
in media.

At times, I’ve let the game run in the background just to listen to the
soundscapes.

According to an interview with the creator and director Bokunatsu, Kaz Ayabe,
Sony sent a team into the mountains to capture sounds for the game.

Dear reader, I’m here to tell you that the effort paid off.

The game’s environment is alive with the sounds of insects chirping, the wind
blowing through a nearby chime, the trickling of a nearby stream. As Boku
explores the countryside time advances and, like the background art, the sounds
change to evoke the feeling of morning, afternoon, and night.

Animal Crossing, which debuted the year after the original Boku no Natsuyasumi
game, is held up as the shining example of cozy, relaxing video games. I am a
true fan of the Animal Crossing franchise, but with its gameplay literally
focused on grinding in order to pay your landlord they stand in stark comparison
to a game like Bokunatsu. Animal Crossing rewards completionism, and in doing so
makes the game about grinding instead of actually relaxing.

In comparison, the only thing you’ll get for collecting all of the bugs or
catching all of the fish in Boku is a diary entry written by the boy at night
before bed. And, like in real life, maybe that’s enough?

--------------------------------------------------------------------------------

Discovering and playing Bokunatsu (and watching Tim’s 6 hour magnum opus of a
review) has given me a deep appreciation for the timelessness of art and media.

A game from 24 years ago, deeply steeped in a culture that isn’t my own, has
managed to create in me a sense of warm nostalgia. Its soundscapes remind me of
home, but also make me long for a place I’ve never been.

It’s also worth appreciating the meta aspect of the journey I went on to
discover and experience this game, all because of a link in a newsletter. This
is why the web is so special, and it’s what an AI will never do: unearth a lost
gem.

When writing in his diary at the end of each in-game day, Boku reflects on “the
most wonderful day in which nothing happened.” Let this be a reminder that there
is magic waiting to be found in the mundane.

From The Magic of Acorns by Alex Komoroske:

> When you look out around you, all you see are rocks. Rocks have no agency;
> they cannot change themselves. They need the effort of others to make them
> into something beautiful. A living thing has its own agency: a kind of
> internal magic. It is something that grows under its own power. When I look
> around me, I see that some of those ‘pebbles’ have the potential to be alive.
> Some of those ‘pebbles’ are acorns.

From ‘Enshittification’ Is Coming for Absolutely Everything by Cory Doctorow:

> IP isn’t just short for intellectual property. It’s a euphemism for “a law
> that lets me reach beyond the walls of my company and control the conduct of
> my critics, competitors and customers”. And “app” is just a euphemism for “a
> web page wrapped in enough IP to make it a felony to mod it, to protect the
> labour, consumer and privacy rights of its user”.

Mar 9

Here’s something unexpected: Keanu Reeves and China Miéville (one of my favorite
science fiction authors) are writing a book together that’s dropping in July.
The Book of Elsewhere is described as a “genre-bending epic of ancient powers,
modern war, and an outcast who cannot die.” Sign me up.

Speaking of books being released this year, Robin Sloan’s new novel Moonbound
will land in June. Preorder a copy and let Robin know to receive a limited
edition zine.

Summer beckons!

Mar 5

A small programming note—I’ve updated my homepage to include highlights from
articles and books I’ve read in addition to blog posts. The highlights are
synced from my Readwise account.

If you haven’t used Readwise Reader, I highly recommend it. It’s my modern
replacement for Instapaper, and has a wonderful browser extension which allows
for in-place highlighting of passages (including comments!) I am a very happy
subscriber in part because of their excellent API.

The Readwise API combined with Eleventy’s fetch API made it a breeze to
implement this new feature ✨

 * Older


A WEBLOG BY CHASE MCCOY ABOUT EXPLORING AND BUILDING THE WORLD WIDE WEB.

 * Email
 * RSS
 * Library
 * Lab


ABOUT THE EDITOR

Chase is a professional designer and amateur human currently working on design
systems at Stripe.


ELSEWHERE

 * GitHub
 * Instagram
 * Mastodon
 * Spotify
 * Twitter


NOW PLAYING


Slow Dancing in a Burning Room - Live at the Nokia Theatre, Los Angeles, CA -
December 2007 by John Mayer


LINKED LIST

Things that caught my eye on the web, updated sporadically.

 * GitHub - dhowe/ritajs: RiTa for JavaScript
 * Portfolio — Kelly Chong
 * Learning Log, July 2024
 * Directed Edges / Design systems coaching and consulting
 * Plain Vanilla
 * ertdfgcvb
 * Tulip Creative Computer. Now available
 * GitHub Next | Vitale
 * Why I Finally Quit Spotify
 * JTD Type Foundry and Design Studio


BLOGROLL

 * Alexander Obenauer
 * Amy Hupe
 * anhvn
 * arcana dot computer
 * Audacious Fox
 * Chen Hui Jing
 * Chris Coyier
 * Frank Chimero
 * Interconnected
 * James Little
 * Jim Nielsen
 * Jonnie Hallman
 * Jules Forrest
 * Kicks Condor
 * Maggie Appleton
 * Matt Ström
 * maya.land
 * Mu-An Chiou
 * Piper Haywood
 * pketh
 * Robin Rendle
 * Robin Sloan
 * Soroush Khanlou
 * thesephist
 * Tom Critchlow
 * Zach Leatherman

Museo.app

An open source web interface that helps you find free-to-use images from some of
the world’s best museums and libraries:

 * The Art Institute of Chicago
 * The Rijksmuseum
 * The Harvard Art Museums
 * And more...

--------------------------------------------------------------------------------

Typeset in good old Verdana and Wallau Unzial. Built with Eleventy and hosted on
Netlify. Thanks for stopping by ♥