Three years ago, I wrote a post about how our family plans meals each week on Google Calendar where I used a data export to surface and share some of our favorite weeknight dinners.

Until this month, that was still our planning process. Each week, we’d drop recipes into calendar events, duplicating past meals that worked, adding new recipes that included current sale items and ingredients we needed to use up. It was simple, flexible, and it kept our weekly plan accessible everywhere.

Recipes can be shared publicly from SkilletSched, and get a nice link preview when sent via text message or on social.

After over 8 years of adding and duplicating recipes, I started asking myself questions that a calendar search couldn’t answer, like:

• How many times have we actually cooked each meal?
• Are there any old gold recipes that we made a few times and forgot about?
• What can we make right now with what we already have?
• Can we make grocery planning faster without scanning every recipe?
• How to get our middle-schoolers to eat more leafy green things?

What we really needed was a database, and that’s what I initially set out to build when I exported our shared calendar data again and started tinkering with Claude Code. After cleaning out a lot of noise and resolving duplicates, I realized we had over 70 unique recipes, several of which we’d made over 40 times. I didn’t want to replace our calendar-based process. I wanted to augment it.

As I dug in and started shaping my plan for a progressive web app, I realized I was building something that any household could pick up and use. I purchased the skilletsched.com domain on April 8th and iterated my way to a lightweight, useful, and accessible application. Using my own household as the primary alpha tester, it’s already been a big time saver for managing recipes, planning weekly meals, and creating a shopping list. It also supports 2-way sync with Google Calendar (Outlook and iCal coming soon), so we can still access our meal plans anywhere our family calendar is available. My favorite part of this project has been adding features like a full-screen recipe cook view, public recipe sharing, dark/light mode theming, and even an MCP server for recipe management and meal planning in your favorite LLM.

Time for a taste test!

While it’s shaped around how our family plans, I hope that it’ll make recipe management and meal planning easier for anyone. If you already have some kind of meal planning system (or even if you don’t), I’d love for you to give SkilletSched a try and let me know what works for you, what doesn’t, and what’s missing. Bon appétit!

The post Introducing SkilletSched appeared first on Jasongraphix.

A few weeks ago, I wrote about how I used Claude Code to convert a deprecated Nest thermostat into a photo gallery. That post finished with a happily-ever-after ending and a video demo of the working device installed on a wall. It would have been nice to call it done and just enjoy seeing family memories on the circular screen every time I walked in the door, but I wanted to enable others to create their own mini photo frame.

I started working on an installer to transform any old Gen2 Nest Thermostat into an interactive gallery. Building and actually releasing an executable installer ended up being much harder than the original proof of concept build.

Yes, I bricked it

I’m not a doctor, but…

My first mistake was assuming I could just package up what I’d built with Claude Code and call it done. The gallery worked great on my Nest, so how hard could it be to make that repeatable?

Turns out: pretty hard

Most of the gallery code on the proof of concept was iterated on within the device, over SSH. While I was able to whip up an installer pretty quickly with Claude Code, it was clear with each firmware test flash that some assets were left in place from the original POC.

I spent a while trying to verify that it would work with a stock thermostat and managed to send the device into a boot loop that prevented it from connecting to wifi (no more SSH access) and eventually even charging. Claude kept suggesting ways to troubleshoot, resisting my assertion that we’d fully bricked it. After a weekend of rebuilds and firmware flashes, we finally pronounced it dead. Together, we had turned a functional photo gallery into exactly what Google wanted it to be when they dropped support, a beautiful little hockey puck of ewaste.

After grieving the untimely loss of my original thermostat gallery, I doubled down and replaced it with a set of two more Gen2s from eBay which I nicknamed Bender and Clank. The idea was to use Bender to get the installer working consistently, and then confirm everything worked as expected with a clean, end-to-end firmware and gallery install on Clank.

View on Threads

Getting it right (this time)

For the original gallery, I manually formatted the images to the required BGRA .raw file format myself and hosted them on an HTTP subdomain that the Nest checked for updates whenever it was activated. It did the job, but wasn’t a very approachable solution to gallery maintenance.

I kept that advanced flow around, but simplified the default setup with an Electron app (based on the no longer evil installer) that handles the entire process: USB DFU flashing, image conversion, and SSH transfer. You plug in your Nest, click a few buttons, select photos, and end up with a working photo gallery.

The Nest Gallery installer release is now available on GitHub for ARM-based Macs (M1 or later). It’s MIT licensed, fully open source, and you don’t have to understand anything about cross-compiling ARM binaries or NAND partitions to use it.

Here’s what you get:

• One-time USB flash – No need to reflash the device when you want to update photos
• WiFi photo updates – Add jpg or png images via SSH transfer through the Electron app
• Carousel navigation – Turn the ring to scrub through photos
• Auto-advance – 10-second intervals with smooth transitions
• Motion wake – The display wakes when it detects motion
• Thermostat toggle – Double-click to switch back to thermostat mode if you want

Should you actually build one?

If you have a deprecated Gen 2 Nest sitting in a drawer and you’re comfortable with the possibility that you might brick it, yes. The installer makes it as straightforward as this kind of hardware hack can be, and there’s something genuinely satisfying about bringing a discarded piece of hardware back to life with a new purpose.

If you don’t have a Nest but you’re curious about the code, it’s all there. Feel free to pick it apart, modify it, or use it as a jumping off point for doing something completely different. Claude Code wrote most of what’s there and I had fun keeping it on task and learning way more than I ever expected about 2010s Linux hardware. You can find the full project, installer, and source code at: https://github.com/jasongraphix/nest-gallery

The post Create your own Nest Photo Gallery appeared first on Jasongraphix.

Before we dive in, I should let you know that I’m a designer. I have no business hacking firmware to make devices perform jobs they were never intended for, but I do love tinkering with physical hardware. A few years ago, I wrote about building an Arduino LED strip game and followed that post up with another about a Simon clone built with arcade buttons and a 3D printed case. I’ve also taken on some Raspberry Pi projects, a few simpler Arduino builds, and some home automation. All of those were based on existing code and project plans—no compiled binaries or firmware modifications. So, yes, I was way outside my skill set and comfort zone on this project, but that’s how we learn new things, right?

Photo of my Nest booting up with the No Longer Evil firmware installed.

On October 25th, Google officially ended support for 1st and 2nd generation Nest thermostats. I’ve long been a fan of the original Nest hardware, so after replacing our gen2 with a newer smart thermostat, I decided to hang on to that beautiful hunk of e-waste. A few months later, I came across Cody Kociemba’s No Longer Evil project. It’s an open-source firmware that brings deprecated gen1 and 2 Nests back to life by redirecting the device’s traffic away from Google’s servers and providing a web interface for remote HVAC control and scheduling.

While I never intended to use my old Nest as a thermostat again, I figured it might be fun to see if I could modify the custom firmware to do something interesting. Installing the NLE firmware involves putting the Nest into DFU (Device Firmware Update) mode and running an installer script over USB. That sounds complicated, but the installation process is well-documented and straightforward.

As soon as I saw the NLE logo, I was curious what else I could put on that little circular screen. It’s just a 320×320 IPS display, but the pixel density certainly looked like it might handle a photo reasonably well. For my first experiment, I set out to try finding the NLE logo image and replacing it with a photo. After digging around in the open source project a bit, I worried this was going to absorb more time than I was willing to spend on a silly side project.

Diving into Claude Code

This seemed like a perfect challenge to pair with Anthropic’s Claude Code on, so I re-upped to Claude Pro, opened a Terminal window, and started prompting.  With the help of my handy robot assistant, I learned that the display is accessible as a standard framebuffer device at /dev/fb0, which means if you have some raw pixel data, you can just write it directly to the screen. It helped me track down where the .ppm logo file was located in the open source code, convinced me that a BGRA .raw file was a better format for displaying photos on the device, and walked me through gaining root access to upload and display a proof of concept photo that I formatted and resized down to 320px with ImageMagick.

A family photo with Makey from Maker Faire Orlando seemed like an appropriate proof of concept.

Even though it was tiny, the photo looked great in that circular glass frame, so from there, I decided to try making it work as a photo gallery that cycled through images automatically (and yes, Tynan) allowed for manual scrubbing via ring turn. While I may have been able to figure out how to get the POC photo to display on my own, the rest wouldn’t have been possible without Claude Code. It wrote all of the gallery functionality and helped me set up Docker to compile and reflash the Nest with test builds.

I worked with Claude as if I were a product manager—providing feature requirements, validating incremental changes, and giving direction when we encountered technical constraints. And boy, did we encounter some constraints. The Nest Gen 2 runs a Texas Instruments ARM Cortex-A8 processor with a Linux 2.6.37 kernel from 2011. Just figuring out how to get a turn of the ring to swipe photos across the screen took some trial and error, device crashes, and several moments where I was sure we’d permanently bricked it.

The first major hurdle was convincing the Nest to give up control of the screen. A process called nlclient continuously redraws the thermostat interface, and a watchdog process prevents you from killing it without forcing a reboot. I was getting frustrated with frequent gallery flickers and crashes when Claude eventually figured out that it could use SIGSTOP to keep the watchdog process alive and prevent the Nest from redrawing. With each successful milestone, I’d remind Claude of another missing aspect of the project. Here’s a sample of what our interactions looked like:

The solution to the issue Claude was working through above also required a few iterations. I wanted to be able to add and remove gallery images without having to reflash the device. To do that, I uploaded them to a folder on my site, but there was no DNS resolution, and it also couldn’t pull files over HTTPS. Instead of letting Claude write its own musl-based wget/curl service with HTTPS support, I suggested that I could set up a subdomain without an HTTPS cert to store the photos on. There were several moments like this over the course of the project, where Claude Code was spiraling through a series of Rube Goldberg solutions to the technical constraints we encountered. Sometimes I redirected, and sometimes I let it cook. I’m pretty happy with how it turned out. Here’s a summary of what we built together:

• Auto-advance gallery – Once the Nest completes its boot sequence, it starts cycling through photos, displaying a new one every 10 seconds.
• Display sleep – After 5 minutes of inactivity, the screen dims to conserve power. You can tap the button or turn the ring to wake it.
• Horizontal carousel – Turn the ring and photos slide left or right in real-time, matching the feel of scrubbing through settings on the original Nest UI.
• Motion wake – When the gallery is not active, the Nest UI is running in the background. When we detect a motion event (AKA, Farsight), we take over the display with a random image from the gallery. If no additional action is taken within 10 seconds, the display goes back to sleep.
• Snap easing – If you stop turning the ring past the midpoint,  the image slides into place with an ease-out animation.
• Lazy Loading – I initially let the gallery cache up to 40 images (~16MB) in memory at once. While troubleshooting periodic reboots, I learned that we were exceeding the device’s 41MB RAM limit. Now, we store 7 images in memory (3 ahead and 3 before the current image), to keep the scrubbing snappy, loading additional images on demand.
• Web Update – On each non-motion wake action, the gallery checks an online playlist file, downloads missing images, and removes photos that are no longer on the list.
• Click sound – The Nest has a tiny piezo buzzer, so with every ring-turn photo transition, you get a satisfying little 8-bit beep.
• Gallery pause – A double-click on the button switches between the photo gallery and the original thermostat UI. This allowed me to get into settings to check things like wifi connection and device wiring status.

To mount the Nest back on a wall, I needed a power source. I learned that a standard 24VAC doorbell transformer (which I found for about $12 on Amazon) plugged into the R and C ports of the base could keep the zombie thermostat Nest alive. I found an ideal display location near an entry door next to the library ladder room. There’s a closet on the other side of the wall with an outlet close enough to run a cord up, through the wall, and straight into the Nest backplate for a clean look.

The one issue I didn’t solve

There’s a tiny flat spot at the very top of the display (maybe 1-3 pixels) that’s visible on lighter-colored photos. You can barely see it in the video, and even the NLE logo photo above from the original firmware flash. Claude tried to convince me that it was a hardware notch, but in the white background of some of the Nest UI screens, all the pixels are lit up to form a perfect circle. I spent an embarrassing amount of time prompting and reprompting Claude to try different pixel offsets and framebuffer pan settings to round out that glitch. While nobody who checks out the gallery will ever even notice the tiny top divit, it makes my eye twitch every time, so I may eventually try again to troubleshoot it. Until then, I’m calling this project done.

The post Converting a Deprecated Nest Thermostat into a Photo Gallery appeared first on Jasongraphix.

As I kick off into the new year, I’ve been thinking about a panel discussion we hosted recently at Downtown Orlando UX with our friends from ProductTank Orlando. The conversation was a deep dive into how AI is redefining product and user experience roles and had an energy that made me optimistic about where our industry is headed. The consensus among our four amazing panelists was that while AI is a powerful thought partner, it’s just another tool that augments our existing skills rather than serving as a replacement for professional expertise. Elliott Politte, UX Principal at The Home Depot mentioned that, “the actual craft of pushing pixels is changing, but the way we solve the problems and how we collaborate and make things human isn’t.”

Group photo from the November DOUX+ProductTank meetup

Kim Morrow, Head of UX at Alegeus and UX Professor at Full Sail University echoed this sentiment in what was my favorite quote of the evening:

“Figma does not make a designer. Word does not make a writer. A hammer does not make a carpenter, and AI doesn’t make anybody anything.”

The panel also explored how AI is blurring the lines between disciplines and turning us into generalists who must lean into tasks that would normally be outside our wheelhouse to stay competitive. Here’s the full recording if you’d like to check it out (panelists start at ~6:45):

While I enjoy exploring new ways to integrate AI into my own work and leveraging agentic workflows to make software more delightful, optimism without a healthy dose of skepticism is just hype. I’m equally interested in understanding AI’s task-specific viability and whether these tools actually help us craft software that’s better for humans, or if they’re simply aiming to replace humans altogether.

My friend and former colleague Gregg Bernstein explored those topics last month in a lightning-rod of a post titled “The only winning move is not to play.” Gregg argues that when user researchers offload core parts of their craft to generative AI, they debase their own expertise and make themselves interchangeable with the tools marketed to replace them. It’s a thought-provoking read that wraps up with the question, “What is your red line?

“My red line is trading in the parts of the job I am both an expert in and enjoy for tasks that make the job something else entirely.” – Gregg Bernstein

The thread I see through both the stories of our industry panelists and Gregg’s post is that for all of us working in tech, the job is becoming something else entirely. It doesn’t matter if you’re a researcher, product manager, designer, or engineer – the hard-earned skills that define our professional value continue being delegated to, or at least augmented by AI.

Call me a masochist, but I once enjoyed and was an expert in slicing up Photoshop comps and hand-coding them into complex, table-based website layouts. Learning to design with CSS and semantic markup, especially during the dawn of the web standards movement when cross-browser support was so wildly inconsistent, wasn’t just a minor pivot. Web designers had to throw out everything they knew about translating pixels to code. In many ways, it feels like we’re in the midst of the “Browser Wars” era of AI development. Periods of technological transformation like this (and we’ve experiences many over the course of web history) are never easy. They require us to learn, experiment, and adapt. The unique skills we pick up along the way don’t disappear though. Just as my ancient table-coding knowledge still comes in handy occasionally when updating HTML email templates, our specialized skills and subject-matter expertise remain valuable as we grow.

As helpful as AI tools already are, they’re also as slow, incompetent, and inaccurate as they’ll ever be. The designers who stayed in the web industry through the CSS revolution weren’t the ones who clung to table layouts and spacer GIFs. They were the tinkerers who created CSS Zen Garden entries, who read every A List Apart post, who experimented with the latest CSS developments, and carried what they knew into the next chapter. To stay relevant in the age of AI, we have to maintain a sense of wonder, continuing to push into the unknown and uncomfortable.

A T-shaped skill set is having deep expertise in one area while maintaining broad knowledge across many domains. Being a broken comb means building deep expertise in multiple areas, creating a more versatile but specialized profile. In order for AI to be a force multiplier, we must understand the work we’re asking it to do, with an increasing level of depth.

I respect Gregg’s position, and think we all need to have our red lines, but I’d draw mine a little differently. His is refusing to use AI for the core research tasks that define his role. I get it, and there’s integrity in that position. I worry that holding certain tasks sacred though, puts us in the same position as the web designers who continued to build with tables or Flash until those practices became obsolete. The biggest risk isn’t in exploring these tools, it’s in refusing to at least try to test out their value. AI is blurring the lines between our disciplines whether we like it or not, requiring more from all of us and making everyone a deeper generalist. Or, as Jared Spool calls them, “broken comb shaped” individuals. That curiosity, and openness to experimenting with AI tools will determine whether we’re going to help shape what comes next or let the industry evolve around us.

My red line isn’t about the work I refuse to let AI take from my hands; It’s about refusing to let AI tools replace my judgment. It’s up to each of us to ensure quality, maintain user empathy, and apply critical thinking to the experiences we’re creating with these tools. I want to know, and will continue to explore, which tedious tasks (especially those I’m an expert in) can be sped up or eliminated so I can focus on work that requires my perspective or helps me expand my own craft.

Which AI tools and prompts make you super?

Perhaps most importantly, I want to continue modeling curiosity and sharing what I’m learning along the way with the next generation of UX professionals, because they’re inheriting a software industry that’s already changed. So yeah, stay curious, friends. Experiment and discover where these things fail spectacularly. Figure out for yourself what AI workflows give you a power up and which ones are just wasting time and turns. Think about where your red line is and what uniquely human value you bring to the table. The UX field will continue evolving in 2026. The professionals who thrive won’t be the ones who adopt every AI tool, and they won’t be the ones who refuse to engage at all. It’ll be the individuals who tinker and continually deepen their expertise that will shape what comes next.

The post Stay Curious, Friends appeared first on Jasongraphix.

In August, Ames and I did something we never thought we’d do – we finally bought a move-in-ready home. Since our first house renovation project in 2005, we’ve gutted kitchens, updated bathrooms, replaced fixtures, tiled, and even added on to the neglected homes we’ve purchased.

While our new place is amazing, there’s one DIY project we’ve been talking about since our first walk-through. The house has a large formal dining room with 12′ ceilings, high windows, and a beautiful modern chandelier, making it a blank canvas of a space. Here’s the listing photo:

There’s plenty of space between the kitchen and living room for a table already, so we didn’t need a dedicated dining room. What we wanted was a warm, inviting den for reading, homework, and board games.

Library ladder wall we built in the pulley house.

When we saw that tall, blank wall – the one with the wooden fish in the listing photo above – we immediately thought about the built-in shelves and the rolling library ladder we installed in a loft space at our house in Decatur, Georgia (AKA, The Pulley House). I wanted a similar rolling ladder for the den, and I knew the shelf design would hinge on the ladder rail placement. Before planning anything else, I started searching for a 10′ ladder that would work with the space. All the new library ladders (and most of the used ones I could find) were very expensive, so I set up some alerts on Facebook Marketplace. I ended up finding an old Putnam rolling wood ladder for $100, including the rail. It made my Xennial heart happy that the ladder had a manufacturer date stamp of 1980 and came from the stockroom of a store in the old Lake Square Mall in Leesburg.

With a ladder acquired, Ames and I started thinking about the design of the built-in. We wanted some practical, hidden storage, so we decided to go with IKEA kitchen base cabinets at the bottom. After experimenting a bit in the kitchen planner tool, we found that a set of 24″ wide cabinets flanked by 30″ drawer units was the best use of the room width.

We liked the variety of tones in the Acacia butcher block.

For the countertops, we considered engineered quartz to match the kitchen, but thought butcher block would look better in the room when paired with the wooden ladder. We first looked at IKEA’s Vrena countertop, but learned that all of IKEA’s butcher block countertops are now just veneer over MDF. For the exact same price as the Vrena, we chose a solid-wood Acacia Butcher Block from Floor & Decor.

The next step was the bookshelves. We needed at least 7′ of height to give us something to attach the ladder rail brackets to. Initially, we planned to fill the wall with shelving, but didn’t want to build them from scratch, and the width of the options we found left a lot of wasted space on either side. We simplified the plan to use just 2 columns of bookshelves, leaving space in the middle for a small TV. Two sets of the standard, 31.5″ wide Billy bookcases with a height extension ended up working great.

That was as far as we planned before deciding to take on all of this over our winter “break” and pulling the trigger on both the Floor & Decor and IKEA orders. I picked up the countertops myself, and we had the IKEA order delivered for $59. IKEA’s delivery options have drastically improved over the last couple of years, and for that price, it was a scheduled delivery to the room. Having hauled home many kitchen cabinet orders from IKEA over the years, that was sixty bucks well-spent.

Amy assembling a base cabinet and the boxes in place with butcher block installed.

We started assembling cabinets at the start of Christmas week and had the entire base unit (including drawer hardware and doors) finished before Santa arrived. Even though we don’t plan to prep food on the countertop, we decided to keep it food-safe and finish it with mineral oil, which really brought out the wood’s vibrant colors.

Upside Down Billy bookcases, and me nailing trim pieces onto the cabinet fronts.

A couple of days after Christmas, we got started again on the bookcases, and Amy discovered a genius hack – flipping the Billys upside down. We didn’t like the 3+ inches of footer on top of the countertop, so we assembled the bookcases with top extension as usual, but turned each unit over. To make it look more built-in, we installed strips of 1×2 trim over each vertical beam, and then a 4″ strip of trim across the top. Those covered up the joint where the cabinets butted together, giving a consistent width across the cabinet fronts.

To make the ~4′ space between the shelves where the TV would be mounted a focal point and to hide the TV power cord, we wanted some kind of textured panel. Amy found a 4′ × 8′ oak slat wall panel from Home Depot that worked perfectly. We used 4 of the 1×2 strips attached to the wall studs as furring strips to support the panel. Here it is with the trimmed panel dropped in for a test fit.

Above the panel, we installed a decorative shelf to provide a continuous top for the built-in. That also offered a platform to nail the header trim against across the top. While I was working out the trim details, Amy was prepping the ladder. It was a bit of a mess, with 45 years of stockroom grease and grime. After a good scrub with hot water and Dawn, she applied a coat of Howard Feed-N-Wax. If you have any old wooden furniture, this stuff works magic. We had a partial bottle that we’d used on a coffee table a couple of months ago, and wow, did it make that old wooden ladder look like new.

Sanding and polishing the tarnished, rusty metal rails made them look great, too! I had a couple ~8′ sections of rail from the old mall and a 14.75′ wide wall to cover, so I trimmed the rails to equal widths and hammered a 3/4″ hardwood dowel into the rail to join the two sections at the center. Getting a rail exactly the width of the room into the room and attaching it to the wall was a logistical challenge. First, I predrilled the top screw holes in each of the 4 mounting brackets into the cabinets. Then, with the brackets and detached ladder rollers hung on the rail, Amy and I carefully parallel parked it through the door and into the den with Mavrie helping out as a spotter. Finally, Amy used a broom to lift one side into position, while I screwed in the other from our folding ladder. It wasn’t an elegant process, but we all let out a cheer once it was safely attached to the wall.

Our fearless climber, Adelyn, testing out the ladder and the den at night with top light strip on.

Once the ladder was attached to the track rollers, I used it instead of my folding ladder to finish the touch-up painting. We also securely attached the mount and TV to the wall and added a finishing touch to the top – a 32′ GE Cync Dynamic Effects Smart Light Strip, which looped perfectly around the header of the unit to add a colorful glow to the white room in the evenings. We still need to add more of our books and mementos to the shelves and figure out where things go in the base cabinets, but we’re really happy with how it turned out.

All in, our winter break project came in at just over $3k, with most of that going to the base cabinets. Like I did with our office shed from 2020, I put together a rough budget breakdown for our Library Ladder Wall project. I didn’t include the TV and wall mount which we had and I made a bunch of trips to Ace Hardware and Home Depot over the course of the project for minor things like screws, caulk, and a quart of paint that I’m missing here, but this most of it.

The post Library Ladder Wall appeared first on Jasongraphix.

I knew as soon as I registered the teamdesign.team domain and started building the site that I wanted to automatically share new posts across several social channels. Currently, new design team stories get cross-posted to LinkedIn, Threads, Bluesky, and Mastodon.

In case anyone is interested in automating posts to one or more of those channels, I thought I’d share how I set that up. Thanks to WP RSS Aggregator, I was able to set up a custom RSS feed to use as the source. From there, I ended up creating a 10-step Zapier Zap to handle the posting. It’s not perfect, but it works. Here’s the breakdown of each step. (Note: Some of these steps require a Pro Zapier plan.)

RSS by Zapier step settings

1. New Item in Feed

RSS by Zapier

URL: https://teamdesign.team/feed/teams/
What Triggers a New Feed Item?: Different Guid/URL

2. Get current Date/Time

Formatter by Zapier

Action event: Date / Time
Transform: Add/Subtract Time
Input: Current time
Express: -2 days
To Format: MM/DD/YYYY

3. Ensure recency

Filter by Zapier

Only continue if Published Date is after the step 2 output date. I did this to prevent changes to the feed posting a bunch of older posts at once or updates to older posts on the external sites from triggering a new social post.

4. Post to Mastodon

Webhooks by Zapier

To post to Mastodon, you have to set up an app token. Go to settings > development in your account and create a new application. Be sure to check the box for write:statuses.

URL: https://mastodon.design/api/v1/statuses?access_token=APPTOKEN
Payload Type: Form
Data:
Status: “New Post from [1. Raw Source Title]: [1. Link]”

5. Get Link Metadata

Webhooks by Zapier

LinkedIn requires an image, title, and description for attached link previews, so I created a free account on urlmeta.org to fetch the opengraph data for each blog post URL.

Method: GET
URL: https://api.urlmeta.org/meta?url=[1. Link]
Headers: Authorization: Basic URLMETAKEY

6. Post to LinkedIn

LinkedIn – Create Company Update

With the attached link preview metadata, I had all the values I needed for Zapier’s LinkedIn Create Company Update action.

Update content: “New Post from [1. Raw Source Title]: [1. Link]”
Preview: [1. Link]
Preview – Thumbnail Image: [5. Article thumbnail URL]
Preview – Title: [5. Article title]
Preview – Description: [5. Article summary]

Zapier settings for creating a post on Bluesky.

7. Format Image Preview URL for Bluesky

Formatter by Zapier

Bluesky limits image uploads to 1MB, so I changed the query string value from urlmeta to get a smaller image. Even at 800px, I still occasionally get a notification from Zapier that a post didn’t go through because the image was too large.

Action Event: Text
Input: [5. Article thumbnail URL]
Find: “resize:fit:1200”
Replace: “resize:fit:800”

8. Post to Bluesky

Bluesky – Create Post

When I first added Bluesky posting, there was no native Zapier/Bluesky connection. There was a 3rd party integration from Unshape, but they charged $6/mo. To avoid that fee, I half-vibe-coded a Code by Zapier step. I’m so glad they built an integration. Now, if only Threads would do the same…

Text: “New Post from [1. Raw Source Title]: [1. Link]”
Reply to: False
Embed Type: External Link
URL: [1. Link]
Title: [5. Article title]
Description: [5. Article summary]
Thumbnail URL: [7. Output URL]

9. Create Threads Container

Code by Zapier

The code for these last two steps are a bit messy, but it could’ve been worse if I didn’t use AI. To post to Threads, you’ll have to create a Meta App that’s connected to the Threads profile you want to post to. Once you have that set up, you only need 2 strings: a Threads token and your Threads user id.

Be sure when you set up the token that you exchange it for a long-lived access token. The initial token you get back is only good for an hour.

This script creates the post, but it won’t be live yet. Threads returns a container ID for the post in the success response that we’ll use to publish in the final step.

Action Event: Run Javascript
Input Data:
message: “New Post from [1. Raw Source Title]: [1. Link]”
linkAttachment: [5. Meta Site Canonical]
accessToken: THREADSTOKEN
userID: THEADSID

Code:

const accessToken = inputData.accessToken;
const message = inputData.message; 
const linkAttachment = inputData.linkAttachment; 
const threadsUserID = inputData.userID;
const url = `https://graph.threads.net/v1.0/${threadsUserID}/threads`;

const headers = {
  'Authorization': `Bearer ${accessToken}`,
  'Content-Type': 'application/json'
};

const postBody = {
  text: message,
  link_attachment: linkAttachment,
  media_type: 'TEXT',
};

try {
  const response = await fetch(url, {
    method: 'POST',
    headers: headers,
    body: JSON.stringify(postBody)
  });

  const responseBody = await response.json();

  if (!response.ok) {
    throw new Error(`Error: ${responseBody.error.message}`);
  }

  // Success response
  return {
    success: true,
    message: 'Post created successfully',
    postId: responseBody.id,
    postDetails: responseBody
  };
} catch (error) {
  return {
    success: false,
    message: `Failed to create post: ${error.message}`,
  };
}

10. Post to Threads

Code by Zapier

Last step! With the container ID, we use the user ID and the token again to publish to Threads.

Action Event: Run Javascript
Input Data:
containerID: [9. Post Id]
userID: THEADSID
accessToken: THREADSTOKEN
Code:

const MEDIA_CONTAINER_ID = inputData.containerID;
const THREADS_USER_ID = inputData.userID;
const ACCESS_TOKEN = inputData.accessToken;

// Threads API endpoint for publishing a post
const API_ENDPOINT = `https://graph.threads.net/v1.0/${THREADS_USER_ID}/threads_publish`;

// Function to publish a post
const publishThreadPost = async (userId, creationId, accessToken) => {
  try {
    const response = await fetch(`${API_ENDPOINT}?creation_id=${creationId}&access_token=${accessToken}`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json', // Optional, can be omitted for some APIs
      },
    });

    if (!response.ok) {
      const errorDetails = await response.json();
      throw new Error(`Error: ${response.status} - ${errorDetails.message}`);
    }

    const result = await response.json();
    return result;
  } catch (error) {
    console.error('Failed to publish post on Threads:', error.message);
    return {
      error: error.message
    };
  }
};

// Execute the function
return publishThreadPost(THREADS_USER_ID, MEDIA_CONTAINER_ID, ACCESS_TOKEN).then(result => result);

The post TeamDesign.Team Social Posts appeared first on Jasongraphix.

Model image from poptrot’s Lumon Board Speaker 3D model from Printables.com

I really enjoyed the second season of Severance, so when I saw that someone created a printable 3D model of the board speaker from the show, I couldn’t resist making one, but had no idea what I would use it for.

Screenshot of Alexa routine, showing the start of the prompt details.

It wasn’t until I printed it out, that I realized the size would make it a perfect housing for my 1st-gen Amazon Echo Dot. I simply drilled a hole in the back just big enough for the speaker’s USB cord and mounted it inside. I took things a step further by creating an Alexa routine that starts with the prompt, “Alexa, I request an audience with the board.”

Once I had my Echo Dot in the board speaker enclosure and a silly Alexa routine set up, I decided to make a fun little video to share on Bluesky, Mastodon, and Threads. Now, back to finishing Cold Harbor.

The post Lumon Board Speaker appeared first on Jasongraphix.

The iconic and innacurate Nike+iPod run tracking sensor.

Does anyone remember the little Nike+iPod sensor that you could clip to your shoe? I’ve always enjoyed running but first started tracking my running data after getting one of those sensors for Christmas in 2009. It was laughably inaccurate, and within a few months, I ditched the chip and started using the RunKeeper app on my iPhone 3GS.

I’ve kept track of my miles ever since and at the end of 2022, I posted about how I ran much farther than any year before. I knew that I ran ever farther in 2023, but never took time to review the data, so it seemed like a good time to take a fresh look at my progress.

As it turns out, I ran about 87 more miles in 2023 than I did in 2022, and I kept pushing this year. In 2024 I logged 626.1 miles over 105 workouts. I typically run every 2-3 days, usually in the morning after the kids leave for school or before they’re up on the weekends. My most common route is a 6.5 mile loop but there were times throughout the year when I tacked on a bit extra and quite a few where I cut it shorter when I wasn’t feeling well, or didn’t have an hour to spend running.

In past years, I registered for a few races to stay motivated but the only race I signed up for in 2024 was a February 5k at my kids’ school. I didn’t feel like I ran more that month, but February ended up being my 3rd highest number of miles. It was interesting to see how much my mileage fluctuated each month, but looking back at my monthly data for the past 3 years, I noticed I went through similar ups and downs in 2023.

Will this upward trend continue in 2025? The only way I see that happening is if I increase my usual distance or frequency. I ran a 10 mile route in early December and could try for longer runs like that on the weekends. I don’t have much interest in running more often though. I’ve found I keep a much better pace when I give myself at least 2 days between runs, so we’ll see!

The post My 2024 Running Review appeared first on Jasongraphix.

That’s it. That’s the takeaway I’ve been trying to distill from my trip to Chicago last week. I was there for a Q4 onsite, working with and meeting new teammates from an additional product zone I’m now leading design for at Sprout Social.

As I’ve been onboarding into the team, it’s been tempting to apply all the same meetings and processes that are currently working well for design on my other 2 product zones. At the same time, I’ve been reluctant to make any changes as that might imply I thought things were wrong or needed fixing. Instead, I had mostly been listening for the last month, feeling a little stuck.

Being there was a breakthrough. Jessie Bohannon and I facilitated a UX empathy activity together, I got to introduce a new group to the Spaghetti Marshmallow Challenge, and getting to know all the amazing engineers in the zone was a blast.

In the middle of the onsite week, my wife texted an article she found insightful titled, Why We Need To Shift From Righting To Guiding by Dr. Renee Lertzman. While the target audience of that short Substack read is changemakers in the environmental sustainability space, I highly recommend it as the lesson within is universally applicable.

What is righting? As Dr. Lertzman explains it:

This is when we focus on telling people, earnestly, what the problems are, and why it’s the “right” thing to do to change. It is also called the “righting reflex” … This well-intended yet often ineffective tendency only brings up resistance, as a natural response to being “told.”

Caitlin presenting her talk to a packed meeting room at the Amazon’s Chicago Loop office.

As people leaders, it’s easy to fall into a pattern of righting instead of truly listening to and guiding positive change within our organizations. While I was in Chicago, I learned that Caitlin Grogan, the group product manager for our UI Foundations zone at Sprout Social was speaking at a Figma/AWS Meetup, which I quickly RSVPd for. I wasn’t expecting a reinforcement of the guiding vs. righting approach, but that was exactly what I walked away with from that event.

In her lightning talk, Caitlin explained how actively listening to the needs of our design system users—specifically engineering leaders and product managers—helped create unexpected efficiencies in growing and maturing our Seeds design system. While design systems teams at many organizations struggle with adoption and governance, Caitlin shared how the partnership and proactive conversations about systems at Sprout have led to cross-department shoutouts, component contributions, and enhancements from several product zones.

As I press forward in finding my rhythm and process for leading design within my new zone, I have a week’s worth of in-person observations, insights, and conversations to help me guide, instead of blindly righting, my way forward.

The post More Guiding, Less Righting appeared first on Jasongraphix.

Do you want separate chronological feeds for specific sets of profiles on Threads? You’re not alone! If you have a Mastodon account and follow Threads users who have Fediverse sharing turned on, you can use the lists feature on Mastodon to achieve this. Back in April, I imported my Threads follows into Mastodon and posted a video showing my list columns there.

 

Post by @jasongraphix

View on Threads

To achieve that, I exported my Threads data and attempted to import all of my follows into Mastodon. At the time, only ~20% of the accounts (which had Fediverse sharing enabled) imported successfully.

I’ve seen a recent increase in accounts enabling Fediverse sharing, and encouraging others to turn it on as well, so I thought I’d run my import again. I figured I’d write down the steps in case anyone else wants to give it a try, and to save myself some formatting woes for the next time.

Exporting your Threads Follows

Threads data export settings

The first thing you need to do is request your Threads data:

1. Visit Meta’s download your information page
2. Click “Download or transfer information”
3. Check the box next to your Instagram account, then click Next
4. Click “Some of your information…”
5. Scroll down and check only the “Threads” box, then click Next
6. Make sure the “Download to device” radio option is checked, and click Next
7. Choose All time as the Date Range, JSON as the format, Low for the Media Quality, and click “Create files”

It took about 20 minutes before I got the email that my download was available, but be patient, as I’m sure it could take longer. Once it’s ready and you’ve downloaded the zip file, you’ll want to find the following.json file in your_instagram_activity/threads.

Formatting for Mastodon Import

This is the most challenging part. We have to get all of the usernames out of the JSON file and formatted into a CSV that can be imported into Mastodon. This would take a long time to do manually, but only requires a few steps in an editor like VS Code, or any text editing tool with a regular expression find and replace. Just open following.json in your editor of choice and start a find and replace action, ensuring that RegEx search (usually represented as .*) is enabled.

1. Find: "value":\s*"([^"]+)"
2. Replace all with: \n$1@threads.net,true,false,\n
3. Find: ^((?!@threads\.net).)*$\n?
4. Replace all with: (leave this blank)

The result should be a file where the username for each of your follows is on a new line, followed by @threads.net,true,false,. That’s the format for importing a following list into Mastodon, with the true value indicating that you want to show boosts for that user, and the false confirming that you do not want to be notified on new posts. Save this somewhere handy as threads-follows.csv.

Importing Into Mastodon

Screenshot of Mastodon’s following list import form.

The next step is to navigate to Preferences from your Mastodon account and look for the Import page. When you import your threads-follows.csv file, Mastodon will attempt to follow each user. Once processing is complete, it’ll show how many imported successfully, and how many failed. This time, ~31% of my list imported, which means quite a few more folks have turned on Fediverse sharing since my attempt in April.

Screenshot from Mastodon List Manager with profile names blurred out.

Managing Mastodon Lists

Now, the fun part! Because Mastodon is such a large, open-source project, there are many third-party client apps and tools available. My favorite resource for maintaining follow lists is Andrew Beers’ Mastodon List Manager.

Once you’ve connected List Manager to your Mastodon account, you can search, sort, and filter your follows in many different ways to quickly add users to lists. The sample screenshot here of the Mastodon List Manager UI only shows about half of my lists. I’ll often create new lists around events I’m attending, topics I want to follow, or other interests.

I really hope Meta prioritizes a lists feature like this for Threads eventually. More importantly, I hope that expanding their ActivityPub integration makes enabling Fediverse sharing more mainstream. An open social web creates so many fascinating opportunities, but not if the vast majority of posts stay locked inside a walled garden.

The post Following Threads on Mastodon appeared first on Jasongraphix.