daverupert.com The personal blog of Dave Rupert, web developer and podcaster from Austin, TX. https://daverupert.com Tag, you're it <p>I’m a bit behind in my RSS feeds and I didn’t realize <a href="https://www.susanjeanrobertson.com/writing/tag-youre-it/">Susan tagged me</a> to answer a series of questions about my blog. I’ve read dozens of these and to be honest was feeling a little left out, so thanks Susan for including me! (Susan’s one of my favorite bloggers and crafters, be sure to like and subscribe.)</p> <h2>Why did you start blogging in the first place?</h2> <p>I published a zine in high school with my best friend Mike. Our zine Wimpkiller was a creative outlet for all the composition notebooks we filled up over a bottomless cups of coffee at IHOP. We’d print out stories on Mike’s computer, chop ‘em up, glue ‘em together, and then scam copies after midnight with the help of the friendly late-shift worker at Kinko’s. I enjoyed that thrill of self-publishing then as much as I do now. It felt like the garage band of writing. You may not be good or ever get famous, but you can brute force some art into the world.</p> <p>In college blogs became a trend. I created a blog as I graduated from college to chronicle my entry into the corporate world and ended up chronicling my move and life in Japan. It served as a form of catharsis and outward processing as well as keeping my friends and family up to date on my adventures. That blog died after I came back from Japan and had to get a job and start a career.</p> <p>Meeting Jeffery Zeldman at SXSW was the inspiration for this edition of the blog, if you can believe it. A brief encounter but my key takeaway on how I could become more like my web development heroes was to write more. They write, and writing begets books, and books begets conference talks. It seemed like a template I could follow and I started self-publishing again. Over time, I wrote enough to where I got to write on <a href="https://alistapart.com/">Jeffrey’s blog</a> and speak at his conference a handful of times. I guess the plan worked out.</p> <h2>What platform are you using to manage your blog and why did you choose it?</h2> <p>I started on WordPress but <a href="https://daverupert.com/2012/11/brander-newer/">I moved my blog to Jekyll in 2012</a>. I chose Jekyll because I was into Ruby at the time and fighting with WordPress for good performance was exhausting me. I wanted a simpler authoring and development experience. The simplicity of building with markdown files on <code>localhost</code> still resonates with me.</p> <h2>Have you blogged on other platforms before?</h2> <p>I’ve used Blogger, MovableType, WordPress, and Jekyll. There’s also an ill-fated Eleventy branch on my site that never made it to production. I’m sure Jekyll will implode and I’ll need to find something else, but switching platforms would be a distraction for me at this point without some obvious benefit or process improvement.</p> <h2>How do you write your posts? For example, in a local editing tool, or in a panel/dashboard that’s part of your blog?</h2> <p><a href="https://daverupert.com/2021/09/my-notion-blogging-kanban/">I write my posts in a giant Notion kanban</a>. It’s overkill but it’s my overkill. The organization capabilities and “markdown-like” aspects of Notion made it a good fit over a folder-o’-files. Before publishing, my posts go through a series of <a href="https://daverupert.com/2021/10/pre-publish-blogging-rituals/">pre-publishing rituals</a>. With those processes combined I maintain a level of quality and throughput that I’m happy with.</p> <h2>When do you feel most inspired to write?</h2> <p>I find time to write after the kids go to bed. If there’s time during the workday, I may spend a lunch break jotting some thoughts too. My blogging is very work-dependent to the extent that sometimes <a href="https://daverupert.com/2020/09/boredom-begets-boredom/">when I’m productive at work, I’m most productive at blogging</a>. But often, I’m too tired or focusing on other tasks to craft a well-reasoned blog post.</p> <h2>Do you publish immediately after writing, or do you let it simmer a bit as a draft?</h2> <p>Most of my drafts simmer for weeks if not months or years. From time to time I’ll do a one day turnaround on a post and that’s rewarding, but it’s inconsistent. At the time of writing I have 22 active drafts where ”active” means I’ve updated them at least once in the last six months. If I increase the scope to one year, there’s 41 drafts in my kanban.</p> <h2>What are you generally interested in writing about?</h2> <p>I’m a generalist at heart and enjoy writing about technology generally. If you look at my archive it’s pretty rare that two consecutive posts will be thematically similar. I write about specific technologies like CSS but also about game development or the capital-W Web. And of course prototypes, which I’m convinced are the not-so-secret sauce for building great technologies.</p> <p>One direction I’m slipping towards in my mind is futurism and speculative fiction (e.g. <a href="https://daverupert.com/stories/">sci-fi</a>). Writing about current technology limits you to existing capitalist and corporate structures. Imagining the future <a href="https://daverupert.com/2017/10/a-good-science-fiction-story/">and the potential fallout</a> allows you to think without the confines of “Good because make money” which so much of our discourse is today.</p> <h2>Who are you writing for?</h2> <p>Woof. Good question. 90% of the time I’m writing to get ideas out of my head. Transfiguring ideas into text works wonders for me. I also tend to write for an abstract audience, people who are curious about the web and technology yet crave more from it; a person who considers themselves a technologist, but also factors in morality and other <a href="http://localhost:4000/2024/04/thoughts-on-cosmotechnics/">cosmotechnics</a>.</p> <h2>What’s your favorite post on your blog?</h2> <p><a href="https://daverupert.com/2023/08/quick-thoughts-on-chips/">Quick Thoughts on Chips</a> (2023) is up there but I feel like <a href="https://daverupert.com/2013/04/responsive-deliverables/">Responsive Deliverables</a> (2013) aka, the “tiny bootstraps” post, is a level of quality, thoughtfulness, and timelessness that I don’t achieve often. I’d like more “timeless” pieces like that, but I don’t exactly know how or if it’s worth trying to bottle that magic.</p> <h2>Any future plans for your blog? Maybe a redesign, a move to another platform, or adding a new feature?</h2> <p>I’m pretty comfortable with my site, but I have a couple changes in mind:</p> <ul> <li><a href="https://www.youtube.com/watch?v=c13gpBrnGEw&amp;t=225s">Use named grid lines</a></li> <li>Blowout my tag pages with custom art direction</li> <li>Make my mobile layout perfect</li> <li>Write more <a href="https://daverupert.com/stories/">shitty sci-fi</a></li> <li>Switch from Notion to Obsidian</li> </ul> <p>Some of those will happen over the course of a year, some in the dark of night, some never.</p> <h2>Tag ‘em.</h2> <p>What a responsibility to add people to this chain letter! Susan told me if I don’t forward this to 10 people, my grandparents will die! That seems extreme but okay. I’ll tag the following people who I think haven’t written one yet:</p> <ul> <li><a href="https://zeldman.com/">Jeffrey Zeldman</a> - it feels fitting to pass the mic back to Jeffrey.</li> <li><a href="https://meyerweb.com/eric/thoughts/">Eric Meyer</a> - another blogger that inspired me in my early days</li> <li><a href="https://melanie-richards.com/">Melanie Richards</a> - a multi-talented person and another one of my favorite crafters.</li> <li><a href="https://livelaugh.blog/">Jenn Schiffer</a> - talented artist and consistently way funnier than everyone else in the room.</li> <li><a href="https://ericwbailey.website/">Eric Bailey</a> - one of my favorite web thinkers and also has <a href="https://buttondown.com/ericwbailey">the most interesting newsletter</a> out there.</li> <li><a href="https://blakewatson.com/">Blake Watson</a> - deliverer of home-cooked applications</li> <li><a href="https://joshcollinsworth.com/">Josh Collinsworth</a> - thoughtful blogger and word puzzle game developer</li> </ul> <p>Shoot. Only seven. Sorry, memaw and pepaw. Hopefully some unnamed individuals will answer the call.</p> Sun, 09 Mar 2025 22:34:00 +0000 https://daverupert.com/2025/03/tag-you-re-it/ https://daverupert.com/2025/03/tag-you-re-it/ Unnecessary <p><tt>It’s a secret to everyone! This post is for RSS subscribers only. <a href="https://daverupert.com/rss-club/">Read more about RSS Club</a>. </tt></p> <p>Yesterday, my daughter was in Dallas for the NCA Cheer Competition. My wife sent me a text letting me know her team won! Yay! My daughter is a national champion at age 9. Ten minutes later, the next text I get is that there’s an active shooter and they’re in lockdown. Panic consumed the 30,000 people in the convention center. Kids trampled in the stampede to get out. Families and teams separated. Youth running across a 10 lane freeway to escape, traffic screeching to a halt. Horrifying.</p> <p>The actual cause of the incident was some cheer parents getting into a fight which knocked down some metal poles. The whole situation is sad. Unnecessary trauma because some dumb parents lost their ability to be civil. Unnecessary trauma created through our lax gun laws and inability to stop this uniquely American horror. An unnecessary situation. Thankfully no one was critically injured and the shooter wasn’t real… this time. We’re living inside a lit powder keg at all times and its exhausting.</p> Sun, 02 Mar 2025 15:07:00 +0000 https://daverupert.com/2025/03/unnecessary/ https://daverupert.com/2025/03/unnecessary/ I don't like sand <p>Happened upon a good example of the problem with AI generated <code>alt</code> text. It’s a gif of the infamous scene from Star Wars Episode II where Hayden Christensen playing Anakin Skywalker tells Natalie Portman’s character Queen Amadala, “I don’t like sand.” It’s the first phrase in the worst lines of dialogue in cinematic history. And here’s how the computer interpreted the gif…</p> <p><img src="https://cdn.daverupert.com/posts/2025/sand.jpg" alt="Screenshot of the image upload interface of Bluesky that autocompletes alt-text. As described in the post there’s a gif from Star Wars Episode II where Anakin tells Queen Amadala “I don’t like sand”, but the alt text says “a man and a woman are sitting next to each other and the woman is saying I don’t like sand”" /></p> <p>The AI said “a man and a woman are sitting next to each other and the woman is saying I don’t like sand.” Not only does this miss the context that it’s from the world famous movie Star Wars, it gets the speaker entirely wrong. It OCR’d the text fine, but missed relaying the entire context.</p> <p>Context. That’s what <code>alt</code> text is. I’d hypothesize that <em>context</em> is probably one of the biggest reasons why language evolved. A caveman could yell “AHHH!H” to alert others of dangers, but I imagine after a couple rounds of those others would begin asking, “Ok, Grog, I understand you think there’s an AHHH!H out there, but what <em>kiiiiiiind</em> of AHHH!H?”</p> <p>My ears are starting to perk up when I hear the word context. I hear all the time that “<em>You have to give the AI more context and it will give you a better answer.”</em> AI has a lot of vectorized text and image processing nodes, but it’s short on context I guess. Will AI one day have every frame of the expensive-to-license Star Wars franchise indexed in its brain like I do? Or are we the gatherers and keepers of context? Does our capacity for empathy (which allows us to project and inhabit other contexts we don’t necessary have) set humans apart?</p> <p>I hate to leave on such an open-ended question, but I think we can all agree… that woman doesn’t like sand.</p> Sat, 01 Mar 2025 18:03:00 +0000 https://daverupert.com/2025/03/i-don-t-like-sand/ https://daverupert.com/2025/03/i-don-t-like-sand/ The only way to know for sure... is to build a prototype <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/0m60QbT85Tc" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> <p>I’ve mentioned Mark Brown’s channel Game Makers Tool Kit <a href="https://daverupert.com/2018/10/how-mega-man-11-s-levels-do-more-with-less-game-maker-s-toolkit/">many</a> <a href="https://daverupert.com/2020/09/follow-the-fun/">times</a> <a href="https://daverupert.com/2021/10/the-mistake-every-new-game-developer-makes/">before</a>. Well, I’m back with another banger about “<a href="https://www.youtube.com/?v=0m60QbT85Tc">How to find amazing game ideas</a>”. The whole video is great but I specifically want to highlight something Mark said during the last ten seconds of the video as the credits and video thumbnails started to roll…</p> <blockquote> <p>And then the final question to answer is… is the game idea actually fun? Because the truth is… our brains are terrible video game simulators. Almost every idea seems fun in our heads. But once we actually make it we’ll realise  that it’s boring, that it’s too complicated, and that it has disastrous  unforeseen design problems. So the only way to know for sure… is to build a prototype.</p> </blockquote> <p>The answer again –and I cannot stress this enough– is prototypes.</p> <p>“Our brains are terrible video game simulators.” Woof. This is a powerful sentiment and I regularly encounter this. I feel this is true with websites as well. I can make the best fantasy website – so beautiful, so perfect in pixels, so incredibly evocative people will throw their wallets at me – but if I haven’t put prototypes into people’s hands, I’m introducing a huge amount of risk.</p> <p>That’s all. Prototypes. I think the rest of the video applies to where you can find ideas for amazing websites:</p> <ul> <li>Other websites - <del>Stealing</del> Borrowing good UX is a great start for an idea</li> <li>Genres - Follow the rules or offering an interesting twist on an existing genre (like ecommerce)</li> <li>Mechanics - Adding interesting iteractions or gimmicks can add distinction</li> <li>Experience - Go hard on experience and ambiance!</li> </ul> <p>Mark also raises some important questions at the end and I wanted to highlight two of those because I think they’re important.</p> <ul> <li>“Can you make it?” - Be honest with yourself, do you in your personal capacity have the capability to deliver the idea? I often succumb to making ideas in my head that are so big and complex that it becomes impossible to build and maintain.</li> <li>“Will it stand out?” - In the sea of websites or podcast people come across each day, will it be unique or will it join the cacophony?<sup class="footnote-ref"><a href="#fn1" id="fnref1">1</a></sup></li> </ul> <p>And wouldn’t you know it, those are the types of questions that prototypes help to answer.</p> <section class="footnotes"> <ol> <li id="fn1"> <p>Personal websites are exempt from this question. I think “It won’t stand out” is one reason people avoid making one. The world (more than ever) needs your unique perspective. Don’t let uniqueness be a reason <em>not to try</em> and make something. Get to the first checkpoint, make your idea, get the first draft in people’s hands. Then over time find what makes your idea unique and breakaway from the default template. <a href="#fnref1" class="footnote-backref">↩</a></p> </li> </ol> </section> Sat, 01 Mar 2025 17:30:00 +0000 https://daverupert.com/2025/03/the-only-way-to-know-for-sure-is-to-build-a-prototype/ https://daverupert.com/2025/03/the-only-way-to-know-for-sure-is-to-build-a-prototype/ Vibe Check №37 <p>As the weather in Texas flip-flops weekly between sunny Spring and snowy Winter, I’ve been dealing with a bit of personal health this last quarter. From my ADHD diagnosis, to trying meds for the first time, to back-to-back sicknesses, then constant migraines, and then I think I got the Norovirus on New Years. A debilitating time for me, but in January it started to turn around when I got some good news…</p> <h2>“It’s not a tumor, it’s a deformity”</h2> <p>In December I saw my primary care physician about a pain in my ankle that was causing me to hobble and at times preventing me from walking in November. It caused a lot of other issues as well; a fire-like pain in my thigh and a bump on my heel.</p> <p>My doctor thought it might be <a href="https://en.wikipedia.org/wiki/Chondroma">Chondroma</a>, which is a bit scary to look up, but is like a tumor made of cartilage. That tumor can either be on the surface of the bone or inside the bone. Yikes. I got an x-ray and followed up with an orthopedic surgeon who gave me some good news that it’s not a tumor, but <a href="https://en.wikipedia.org/wiki/Haglund%27s_syndrome">Haglund’s Deformity</a> also known as “pump bump” because a lot of women who wear heels often get it. The pain comes and goes based on how the tendon rubs against the bone spur.</p> <p>Because I’m not in pain right now, the plan now is to take a non-surgical path and use anti-inflammatories to keep it at bay, saving surgery as a Plan B.</p> <h2>The side effects of ADHD meds</h2> <p>Last time I said I started on Qelbree, a non-stimulant ADHD medication. Non-stimulants take about five days to build up, so there’s no lightning bolt moment of clarity with non-stimulants that others describe when taking Adderall or Ritalin. It’s hard to know if it’s working, but in time I started to feel the effects.</p> <p>The most notable one was that I was almost immune to environmental triggers like clutter and noise that overwhelm me. Whenever I encountered a mundane task like take out the trash or wash the dishes, I found it a lot easier to pick up and do without a 30-minute prep talk with my brain. That part was great… the side effects though… not so great…</p> <p>One of Qelbree’s listed side effects is insomnia. Sure enough, I’d wake up every night at 2 AM and be awake for hours. Not quite night-brain anxiety, but just… fully awake. To combat this I read the first four books of the Murderbot Diaries back-to-back. If life hands you lemons, make emo robot lemonade.</p> <p>The insomnia wasn’t great and I was having horrific headaches, so I switched to <a href="https://en.wikipedia.org/wiki/Atomoxetine">Atomoxetine</a>, another non-stimulant SNRI that’s more common. My insurance also said they weren’t going to pay for Qelbree, so that worked out. The also don’t pay for atomoxetine, but it’s 10x cheaper so… I guess that’s a good deal? Lol.</p> <p>I’d say “the mox” –that’s what we, the moxxers, call it– is working evident by the fact that I’ve been able to focus on some long mundane tasks at work. That’s been helpful. But it’s not without its side effects either. Weight loss is a welcomed side effect (-5 lbs) but another side effect is extreme dry mouth. My mouth is dry, y’all –how dry is it?– my mouth is so dry I’m putting lotion on my gums. My dentist said I need to buy that gel old people use to keep my mouth moisturized.</p> <p>I guess I’ve been lucky in my life thus far because this is my first time navigating meds and side effects. What I’d like to avoid is taking more meds to counter meds, although my gum lotion already crosses that line.</p> <h2>The rest of the story</h2> <p>This has been a candid personal health issue of Vibe Check magazine. Behind the scenes it’s been less adventurous. A busy new year at work as my team sprints to deliver an “intra-source” design systems project. It –and the 1,000 token sidecar project– have consumed a lot of my brain and time.</p> <p>My daughter’s mid-way through her competitive cheer season. I’m not the most extreme cheer dad, but I’m a proud one. Cheer has a lot of cross-over with child beauty pageants, but it’s a team sport where kids do flips. And it costs about 5-figures a year.</p> <p>Hoping this bad health spat is over for now –he says as an ominous storm cloud appears above my head– and I can start employing my hands and brain to do more interesting tasks.</p> <h2>Stats</h2> <h3>💪 Wellness</h3> <ul> <li>Navigating new medications</li> </ul> <h2>📖 <strong>Reading</strong></h2> <p>My book consumption is becoming athematic and uninspired (except for emo robot). I’m feeling the urge to double down on sci-fi and manga.</p> <p><strong>Finished</strong></p> <ul> <li><a href="https://amzn.to/3VEyxXv">Rogue Protocol</a> - Emo robot</li> <li><a href="https://amzn.to/3Dq70mj">Exit Strategy</a> - Emo robot</li> <li><a href="https://amzn.to/4jc9Zz4">Being Wrong</a> - Super recommend. We’re all wrong. A lot. It’s how our brains work.</li> <li><a href="https://amzn.to/3PAmc3a">Feel Good Productivity</a> - A productivity book I’d maybe recommend.</li> <li><a href="https://amzn.to/40pbf9j">Super Mario</a> - The history of Nintendo and how it grew its video game business. I loved the inside look at important moments like shifting strategy to react to Sega, Sony, and Xbox.</li> <li><a href="https://amzn.to/3WzXRyl">The Power of Habit</a> - A bit like Malcom Gladwell on steroids focusing on the singular issue of habit formation. One good takeaway around harnessing, hijacking, and leveraging the Cue → Response → Reward loop that habits depend on.</li> <li><a href="https://amzn.to/4k8qlsZ">Disrupting the Game</a> - Reggie Fils-Amié’s autobiography, more Nintendo.</li> <li><a href="https://amzn.to/3D4wDcm">The Customer Is Always Wrong</a> - A humorous’ish critique of work, capitalism, customer service, and bullshit jobs.</li> <li><a href="https://amzn.to/3QuZjOQ">The Startup of You</a> - Self-help in “entrepreneur of your own life” form.</li> </ul> <p><strong>Started</strong></p> <ul> <li><a href="https://amzn.to/40hX2ek">Network Effect</a> - Emo robot</li> <li><a href="https://amzn.to/437HuNd">Exhalation</a> - Off to an interesting start with time travelling Iraqis.</li> </ul> <h3>📝 <strong>Blogging</strong></h3> <p>An okay blogging era…</p> <ul> <li><a href="https://daverupert.com/2024/12/twenty-twenty-four/">Twenty Twenty-Four</a> - Year in review</li> <li><a href="https://daverupert.com/2025/01/like-this-and-like-that-and-like-this-and-uh/">Making “this” less annoying</a> - A silly editor experiement</li> <li><a href="https://daverupert.com/2025/01/color-hue-rotating-gaslight/">My website has been gaslighting you</a> - I’ve been playing a big ol’ goof on you for some time.</li> <li><a href="https://daverupert.com/2025/01/american-hearts/">American Hearts</a> - A new American anthem.</li> <li><a href="https://daverupert.com/2025/01/raycast-focus/">Raycast Focus works really well</a> - A great product</li> <li><a href="https://daverupert.com/2025/01/pans/">A story about pans</a> - A metaphor that a lot of folks didn’t pick up on and they wanted to mansplain pans to me.</li> <li><a href="https://daverupert.com/2025/01/15-minutes/">15 Minutes</a> - A punchy anti-capitalist song.</li> </ul> <h3>📺 Media</h3> <p><strong>TV</strong></p> <ul> <li><a href="https://www.youtube.com/playlist?list=PLRcB4n4CGcy93lSV4yy1ntptlhOHo0HPF">The Earliest Show</a> (YouTube) - Ben Schwartz’s improv morning show. Perfect in every way. Watched hours of bloopers and cut scenes too.</li> <li>Very Important People S2 (Dropout) - This season is a little rough, not gonna lie.</li> <li>Make Some Noise S3 (Dropout) - Always makes me smile.</li> <li><a href="https://www.youtube.com/@thisagedgreat">This Aged Great</a> (YouTube) - Ruining my childhood’s favorite movies one video at a time.</li> <li><a href="https://www.hulu.com/series/the-mentalist-edad347e-de7d-45f5-bbce-b5dbf7485382">The Mentalist</a> (Hulu) - My entire family has decided we all like this B-rate CSI clone.</li> <li><a href="https://www.youtube.com/watch?v=2UDXdqqJQPE">Mantracks</a> (YouTube) - Creationism, lies, and doubling down on lies.</li> </ul> <p><strong>Anime</strong></p> <ul> <li><a href="https://www.netflix.com/title/81736884">DAN DA DAN</a> (Netflix, Crunchyroll) - Classic nerdy boy meets cool girl high school romance wrapped up in a warm tortilla of magic demons vs weird aliens. The mother’s flashback mini-sode in Ep7 deserves whatever the anime Oscar is, I’ve never been more moved by a piece of television.</li> </ul> <p><strong>Podcasts</strong></p> <ul> <li><a href="https://www.iheart.com/podcast/105-the-end-of-the-world-with-30006093/">The End of the World with Josh Clark</a> - Are we alone? Why explore the universe? How can it end?</li> </ul> <h3>🎙 <strong>Recording</strong></h3> <p><strong>ShopTalk</strong></p> <ul> <li><a href="https://shoptalkshow.com/647/">Slash Pages vs Wikis vs Posts, RSS, Living with an ADHD Diagnosis, and M4 Upgrades</a></li> <li><a href="https://shoptalkshow.com/648/">Speculating on Funding Open Source</a></li> <li><a href="https://shoptalkshow.com/649/">Chrome 133, Attribute Update, and Standardized Async CSS</a></li> <li><a href="https://shoptalkshow.com/650/">Layout in CSS, Balatro Q&amp;A, Chrome Biz, &amp; Forkin VS Code</a></li> <li><a href="https://shoptalkshow.com/651/">Jason Lengstorf on CodeTV.dev, DevRel Panic, and Spicy Gear</a></li> <li><a href="https://shoptalkshow.com/652/">Talking to Bots, Building Browser Games, and Political LLMs</a></li> </ul> <h3>🧶 Crafts and Models</h3> <p>Too busy to sit down and hobby, but made one fun piece…</p> <ul> <li><a href="https://www.rokronline.com/products/rokr-ak-47-assault-rifle-gun-toy-3d-wooden-puzzle-lq901">AK-47 rubber band gun</a> - My brother got me a balsa wood AK-47 fully automatic rubber band gun. It’s a thoughtful gift and mixes three of my favorites: modeling, soviet history, and trolling my kids and their friends.</li> </ul> <h3>⌨️ <strong>Open source</strong></h3> <ul> <li><a href="https://github.com/davatron5000/awesome-standalones">Awesome Standalones</a> is becoming more valuable thanks to David Darnes’ involvement and 11ty-ification.</li> <li><a href="https://web-components.fluentui.dev/?path=/docs/concepts-introduction--docs">Fluent Web Components V3</a> is close to RC1</li> <li>Intra-source design system</li> </ul> <h3>👾 <strong>Video games</strong></h3> <ul> <li><a href="https://www.playbalatro.com/">Balatro</a> (Steam, Switch, iOS) - Absolutely hooked on this thanks to the ShopTalk D-d-discord.</li> </ul> Sat, 22 Feb 2025 19:40:00 +0000 https://daverupert.com/2025/02/vibe-check-37/ https://daverupert.com/2025/02/vibe-check-37/ On government efficiency <p><tt>It’s a secret to everyone! This post is for RSS subscribers only. <a href="https://daverupert.com/rss-club/">Read more about RSS Club</a>. </tt></p> <p>I used to believe that the goal of the government should be efficiency. If the government was more efficient (waves hands broadly in the air), you could get rid of waste (again, waiving hands) and you’d need less taxes, and that would trickle down (more hands) as more money in people’s pockets, and you’d need less welfare (again, hands), less red tape (hands), and less bureaucracy (hands, hands, hands), et cetera.</p> <p>I’ve changed my thinking on the subject. I now think the goal of the government should be to absorb inefficiencies.</p> <p>As efficient as the fabled invisible hand of the market might be at lowering the costs of goods and services <sup class="footnote-ref"><a href="#fn1" id="fnref1">1</a></sup> and creating jobs<sup class="footnote-ref"><a href="#fn2" id="fnref2">2</a></sup> … there are often non-economic inefficiencies that arise from rapidly scaling to produce cheaper goods in the infinite money machine. Rather than ignore those inefficiencies, I think the government should understand the ways the system breaks and invest in longer term ideas than making the stock market go up during the next quarter.</p> <p>Here’s a short list of market inefficiencies where I think a government helps:</p> <p><strong>Social Security and Medicare.</strong> Unpopular opinion, but I sort of do see social security as a Ponzi scheme; younger people at the bottom fund older people at the top who “got in first”. But you know what’s a bigger problem? Elderly adults retiring with no retirement plan. In our “Buy the latest iPhone” society, <a href="https://usafacts.org/data-projects/retirement-savings">people are statistically bad at planning for their own future</a>.</p> <p><strong>The Environment.</strong> The free market doesn’t nudge companies towards making responsible environmental decisions. Even though <a href="https://rmi.org/wp-content/uploads/dlm_uploads/2024/07/RMI-Cleantech-Revolution-pdf-1.pdf">electrification is 3× more efficient than carbon</a>, the invisible hand is taking its sweet time moving over to it. Probably because the invisible hand gave too much money to the oil companies. We spend billions in aid for “once in a lifetime” acts of God that happen every year now. The “more efficient” act would be to kill carbon. We need a government to protect the non-monetizable resources that give us life like oceans, lakes, rivers, underground reservoirs, the air we breathe, and our forests.</p> <p><strong>Healthcare.</strong> I hate the American healthcare system. We pay too much for too little. We don’t pay for healthcare, we pay for insurance company lawyers to haggle about medical codes. Doctors hate it. Patients hate it. Insurance companies reek of greed and corruption. And each of us “doing our own research” isn’t a great because you end up with people turning themselves blue from colloidal silver. We probably need real doctors. And because most folks don’t need a doctor all the time, we probably need health insurance. The current system is a handful of state-by-state monopolies. But we know (according to Metcalfe’s law) that the value of a network is proportional to the number of connected users on the system. It would seem the best way to dodge insurance marketplace inefficiencies like rising costs and low quality care would be to have the biggest network possible (say, 330 million people?) to create the best safety net. The market is not getting us the best price.</p> <p><strong>Defense.</strong> Every American owning their own personal tank and missile system would be an inefficient stupid way to defend our country. It’s probably best to centralize the cost of Defense and hire trained armed service members for that purpose. I’m not advocating for more military –I’d personally prefer less– but security is a core need and it manifests at a nation-state level.</p> <p><strong>Transportation.</strong> I don’t think individuals should plan and build their own highways. I’d like a government to do that. I also think every American owning their own car that sits parked 95% of the time is a waste of money and space, even if it does make the GDP chart go up. You need a big extra room to store cars at home and a downtown filled with concrete ramps to store cars at work. Or an enormous parking lot to store cars at the store. Is this not a form of waste? There’s no way a train makes money and is a profitable business… but more trains equals less traffic. We know adding new <a href="https://www.strongtowns.org/journal/2020/1/27/how-much-does-a-mile-of-road-actually-cost">ten million dollar a mile</a> lanes to an already impossibly wide interstate creates more traffic, more road rage, and more traffic deaths. That is folly and an inefficiency governments can step in and solve.</p> <p><strong>Education.</strong> Education is a big expense. But you know what’s more expensive? Everyone being stupid. That’s a joke… partially. What is more expensive is everyone sourcing and paying for private schools; most parents would not do it. You’d end up with a future labor force with a lot less education. I think my biggest takeaway from school closures during COVID was how glad I am the public education system exists. Parents can work jobs, do commerce, and it allows kids to learn and play with other kids from a cross-section of incomes, ethnic groups, and special needs. The 1:20+ teacher-student ratio couldn’t be more efficient in regards to childcare. If anything we need more teachers and classrooms to keep that ratio as low as possible so education quality goes up. Oh, and school breakfasts and lunches are super efficient too. You can feed kids for like $1/kid, there’s no way I can hit those numbers at home. I can’t believe this is contentious. Let kids eat.</p> <p><strong>Scientific Research.</strong> Space is expensive to get to, only billionaires can afford it. Isn’t it nice that the government sometimes foots the bill for scientists to also go? Beyond space, efforts like curing cancer, computer research, or finding a new species of spider… these are not an ultra-efficient use of funds but those discoveries power innovation. The market doesn’t fund Science unless it makes money in an A/B test. We’d end up with more patent-pending boner pills instead of understanding of our universe. Real science is a bunch of inefficient question and answer seeking that changes the course of human history.</p> <p><strong>Human Rights.</strong> One way to drive down costs under Capitalism is to hire labor at the cheapest rate possible. Historically, our great nation has relied on slaves (yikes!) and children (yikes!) for cheap sources of labor. You’d have to work long hours for low pay and then a machine would cut off your arm and your employer would say “Well, you can’t work here anymore” and kick you out. Isn’t it great to have a government to correct this moral inefficiency? It didn’t happen overnight, of course. Countless churches and patriotic do-gooders were fine with justifying and upholding the old system. Even fought a war about it.</p> <hr /> <p>I could keep going, but there’s a billion and one jobs a government can do to improve the life and well-being of its citizens. Old habits die hard, I guess, because I’m still thinking about efficiency… but from the opposite angle. A government is perhaps best-situated to absorb inefficiencies at scale. Will there be inefficiency and waste and kingdom-building within a super-system like a government? For sure. Systems should always seek to improve. To begin fixing those problems you need data and transparency.</p> <p>The more you understand Capitalism, the more you understand it’s a game. It’s a game with an enormous exploit. I’m talking Blanka in the corner levels of bullshit. The government <em>should</em> exist to fix those systems and curb those bad actors. But the system continues to reward them and heap tax break after tax break as a reward to their fellow co-conspirators in exchange for campaign contributions and lavish trips. Talk about inefficiency. Dumping piles of money into the hands of people who already have money. Sheesh.</p> <section class="footnotes"> <ol> <li id="fn1"> <p>Except the hand stops working whenever a Democrat is the president? <a href="#fnref1" class="footnote-backref">↩</a></p> </li> <li id="fn2"> <p>Except when the Federal Reserve raises interest rates to combat inflation, bank buyouts, and economic collapses caused by Republican presidents <a href="#fnref2" class="footnote-backref">↩</a></p> </li> </ol> </section> Sun, 02 Feb 2025 14:16:00 +0000 https://daverupert.com/2025/02/on-government-efficiency/ https://daverupert.com/2025/02/on-government-efficiency/ 15 Minutes <iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/sMZdQaKcqs4" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> <p>This might be my favorite song of all time. It’s by a slightly obscure Chicago punk band called The Broadways, made up of a couple members from the more well-known ska band Slapstick. It’s got everything you want in a punk song. Palm mutes, open meedly-meedly parts, yelling, speed, a half-time breakdown, and impeccable synchronicity. I listen to this song when I’m sad, when I’m frustrated, when I’m in traffic, and when I need to inject high octane fuel into my veins. The soaring octave chords will always pick me back up again.</p> <div class="language-markdown highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="markdown">All on the streets, the signs read Cheaper and better technology This capitalist vision is my nightmare Put up a sign in my face What the fuck happened to this place? I think we made a wrong turn Look at the lovely concrete I drove to my stupid job today Got stopped at an intersection Fifteen minutes of my life just rolled away Looked at the guy next to me He didn't look too happy No one's happy, but everyone's too busy to see Let's go shopping today Drive our fancy cars to the fancy malls And for lunch we'll have Big Macs I wish I could turn the clock back Back to when I was ten When I wasn't scared of everything And everything wasn't so fucking crowded And I wonder if my kid will ever see the horizon Untouched by billboards and shopping malls And I wonder if this crazy world Thinks I'm the one that's crazy What if I'm the one who's crazy? What if I'm the one who's crazy? What if I'm the one who's crazy? What if I'm the one who's crazy? I'm not crazy, just frustrated </code></pre></div></div> <p>WIthout a doubt, this song from my teenage years subliminally shaped a lot of my views on what’s wrong with the world. Capitalist intrusions. Eyeball monetization. The always upgrade tech cycle. Why I hate crowds. And traffic. Life evaporating at a stop light seems like a criminal waste of humanity to me. This may subconsciously be part of why I work from home.</p> <p>I’ll never live up to my punk rock ideals or my teenage self, but this song takes me back to them. Not to “when I was ten”, but to “when I was seventeen” for sure. Driving through big city Houston at night. Going to Food Not Bombs near the abandoned hospital. All it takes is the first verse and BOOM! I’m transported through time and I can see the world through my old anarcho-tinted glasses. It makes you want to smash systems and break concrete.</p> Tue, 28 Jan 2025 14:40:00 +0000 https://daverupert.com/2025/01/15-minutes/ https://daverupert.com/2025/01/15-minutes/ A story about pans <p>The other day I sent my wife a link to <a href="https://madeincookware.com/products/ceramic-frying-pan/set">a new set of ceramic pans</a> and asked, “What do you think?” assuming she’d be as impressed as I was of the picture of eggs sliding off the pan. Her response: a grimace. Using my sixteen years of husbandly intuition, I surmised that we were not on the same page about kitchenware.</p> <p>For context, my wife has had the same stainless steel pans that her parents bought her since we met. They’ve outlasted the fancier non-stick pans we’ve auditioned. Her opinion of the pans is that they’re high-quality because they’ve lasted so long and still work. And from that perspective she’s right, they technically still work… but not without some downsides.</p> <p>When you use stainless steel pans instead of non-stick pans, you’re committing to stickiness and having a harder time cleaning your pans. I can accept that as an incurred cost. I think my bigger issue is that ALL our pans do this. Even our cast irons which we’ve made thousands of batches of bacon with but still aren’t seasoned. If you make scrambled eggs, about two eggs worth of material forms a brown sheet of crust on the bottom of the pan that I must scrape off but NOT using soap per the laws of properly seasoning a cast iron pan.</p> <p>Anyways, my wife and I aren’t seeing eye-to-eye on the pans and I’m kind of struggling to see why. I think there’s some frugalness afoot and possibly some sentimental attachment to items that were gifts. And then she –with her Deanna Troi, betazoid-levels of empathy– said “You probably think we need new ones because you do the dishes” and that was our ah-ha moment!</p> <p>In our house I’m the self-appointed dish-master because I can hyperfocus on them while listening to an audiobook, pairing something I don’t like with something I do like. My perspective on the pans is that they’re a lot of work to clean up every night. Scraping and scrubbing the charred chunky bits off so we can ruin them the next day. Essentially, I operate at a different end of the “stack” of dishes than she does so we see the situation differently. I have bigger feelings about the stickiness of the pans because that’s the part that I interface with the most. I would like to apply non-stick technology to improve the dish-washing process. Where she sees something that works okay and we’ve had for a long time, while I see a maintenance burden.</p> <p>Now we have an end-to-end/cross-team perspective of our pans and that is valuable. We understand each other’s needs on a micro-level (the pans are too sticky) and the macro-level (one side of the stack inherits more burden with our pan choice) and that’s helpful for framing future conversations about pans. That said, I don’t think we’re getting new pans any time soon. Such is life. Not all decisions are technical ones.</p> Sun, 26 Jan 2025 14:26:00 +0000 https://daverupert.com/2025/01/pans/ https://daverupert.com/2025/01/pans/ Raycast Focus works really well <img src="https://cdn.daverupert.com/posts/2025/raycastfocus.png" alt="My focus session called actually get some work done with gaming and social media blocked" width="1000" height="632"/> <p>This week Raycast released a new feature called <a href="https://www.raycast.com/core-features/focus">Raycast Focus</a>. This hyped up the Raycast superfans in my social sphere, so I tried it out and I must say that I’m impressed.</p> <p>The timing couldn’t have been more perfect. Earlier this week I tried out a handful of browser extensions that would add some friction to social media sites. I have a bit of a bad habit where I open a new tab and instinctively type my favorite social sites: <code>elk.zone</code>, <code>bsky.app</code>, and of course <code>youtube.com</code>. These are mega time-wasters for me. As someone with ADHD these sites are basically dopamine tar pits for my attention.</p> <p>Videos are an obvious stumbling block, but my biggest pain point is clicking on articles and filling up a couple browsers worth of tabs such that it occupies my brain RAM and I can’t focus on my next task until I clear out my tabs. Even with medication, when the attention ship turns, it can be difficult to steer it back on track. Self-control is great, but the easiest way to avoid distraction is to cut the dopamine off at the source; turn the faucet off at the wall and put child locks on the cabinet. You can still turn it back on, but adding friction to the process makes it a more intentional act of defiance.</p> <p>Raycast Focus adds the right amount of friction. When you enter a session you can choose what types of apps and websites you want to restrict. If you try to open a tab you’ll get a friendly roadblock. You can still enter the site if necessary but you have to click and hold a button for 3 seconds which is enough time for your brain to reassess if this visit is necessary.</p> <p>Another positive of Raycast Focus is that it’s an OS level tool. I don’t need different tools to limit apps and websites, it’s all under one roof. I already have muscle memory using Raycast to launch apps so it’s easy to add Raycast Focus to my workflow. And there’s something nice about my distraction launcher also being my distraction governor.</p> <p>Your mileage may vary, but Raycast Focus is working well for me (almost too well). I feel more productive and sometimes you need to feel productive for your own sake, <em>not your employer’s</em>. Whether it’s your process, your tooling, your calendar, or your own brain working against you, it’s worth finding new strategies to improve your workdays. I’m even using it right now to focus on finishing this blog post and… uh… it worked!</p> Sat, 25 Jan 2025 01:31:00 +0000 https://daverupert.com/2025/01/raycast-focus/ https://daverupert.com/2025/01/raycast-focus/ American Hearts <iframe style="border-radius:12px" src="https://open.spotify.com/embed/track/3EWJg0d2CMtst83tU5nZiq?utm_source=generator&theme=0" width="100%" height="152" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe> <p>Today I want to share with you a song that has stuck with me for a couple decades and has been a source of catharsis for shaking off that existential dread. I’m talking about Piebald’s 2002 single <em>American Hearts</em>. (<a href="https://www.youtube.com/watch?v=RlTEaWB3eeg">video</a>)</p> <div class="language-markdown highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="markdown">[Hook] HEY! You're part of it YEAH! You're part of it HEY! You're part of it YEAH! You're part of it [Verse 1] I walk the streets of a Carolina Watching people pushing shopping carts And there's a guy above me And he's washing windows Making ten bucks a pop And he says to me... [Hook] HEY! You're part of it YEAH! You're part of it HEY! You're part of it YEAH! You're part of it [Verse 2] And I say, "Sir, well have you heard that this country is unequal still?" History continues itself Continues itself History continues itself And I did not create the rules From all I've heard And all I've seen This place has broken My American heart From all I've heard And all I've seen This place has broken My American heart [Hook] HEY! You're part of it YEAH! You're part of it HEY! You're part of it YEAH! You're part of it </code></pre></div></div> <p>From the first snap of the snare to the final piano chord the song grips you for the whole ride. The staccato bass line powers the song and surrounds itself in an envelope of noise from the dual guitars and a cacophony of drum hits. The lyrics and chord progressions are simple but together they produce something bigger. The song only has two major parts, but the way they drop instruments in and out it feels like four. And best of all, it makes you want to punch a hole in the sky.</p> <p>Every so often – out of nowhere in the middle of my day when I’m feeling frustrated by a situation beyond my control – I’ll shout to myself “HEY! You’re part of it” as a little mantra to remind myself that, yes, I’m a participant in the democratic capitalist American experiment. I’m a participant in the prosperous parts as well as the unjust parts. I’m part of it. And due to America’s broad empire-like influence, you’re probably part of it or impacted by it too. And it breaks your heart at times.</p> Mon, 20 Jan 2025 19:54:00 +0000 https://daverupert.com/2025/01/american-hearts/ https://daverupert.com/2025/01/american-hearts/ My website has been gaslighting you <p>I have a confession to make. You probably sensed it, but weren’t able to articulate what was happening. Your loved ones think you’re losing your grasp on reality. For the last six months I’ve been incrementally changing the color scheme on my website every single day. I boiled you like a frog! Mu-wa-ha-ha. Don’t believe me? Try for yourself…</p> <aside> <div> <label for="postHue">Update hue</label><br/> <input id="postHue" type="range" min="0" max="360" step="1" style="width: 100%; accent-color: var(--accent);" /> <div style="position: relative; overflow: hidden;"> <img src="https://cdn.daverupert.com/posts/2025/colorwheel.jpg" loading="lazy" alt="color wheel" width="800" height="800" style="width: 100%; max-width: 100%; height: auto; display: block; background: white; border-radius: 50%;"/> <svg xmlns="http://www.w3.org/2000/svg" title="color indicator" viewBox="0 0 100 100" width="800" height="800" style="--magic-deg-for-chart: 150deg; position: absolute; inset: 0; rotate: calc(var(--hue-rotate-deg) + var(--magic-deg-for-chart)); max-width: 100%; height: auto;" > <g id="accent" transform="rotate(240 0 0)" transform-origin="center" style="stroke: #555"> <path d="M 50,50 50, 16.5" stroke-linecap="round"/> <circle r="5" cx="50" cy="11.5" fill="transparent"/> </g> <g id="bg" style="stroke: #555;"> <path d="M 50,50 50, 11.5" stroke-linecap="round"/> <circle r="5" cx="50" cy="6.5" fill="transparent"/> </g> </svg> </div> </div> </aside> <p>At the center of this CSS-trick is setting a <code>--hue</code> variable and rotating the hue about <code>1deg</code> each day to make it 360º around the color wheel over the year. Because I like blue, I set the default <code>--hue</code> to <code>196</code> and add the current day’s <code>--hue-rotate</code> value to calculate my final <code>--rotated-hue</code> value.</p> <div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="css"><span class="nt">--hue</span><span class="o">:</span> <span class="err">196</span><span class="o">;</span> <span class="nt">--hue-rotate</span><span class="o">:</span> <span class="o">&lt;</span><span class="nt">Floor</span> <span class="o">(</span> <span class="nt">CurrentDayOfYear</span> <span class="o">*</span> <span class="err">365</span> <span class="o">/</span> <span class="err">360</span> <span class="o">)&gt;;</span> <span class="c">/* Math goes here */</span> <span class="nt">--rotated-hue</span><span class="o">:</span> <span class="nt">calc</span><span class="o">(</span><span class="nt">var</span><span class="o">(</span><span class="nt">--hue</span><span class="o">)</span> <span class="o">+</span> <span class="nt">var</span><span class="o">(</span><span class="nt">--hue-rotate</span><span class="o">,</span> <span class="err">0</span><span class="o">));</span> <span class="c">/* Rotate it */</span> </code></pre></div></div> <p>The math for the <code>--hue-rotate</code> isn’t that complex, but since CSS doesn’t have a <code>Date()</code> function, I set the initial <code>--hue-rotate</code> value inside my Liquid template when I generate the site with Jekyll.</p> <div class="language-html highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="html">{% assign yearProgress = 'now' | date: '%j' %} <span class="nt">&lt;style&gt;</span> <span class="nd">:root</span> <span class="p">{</span> <span class="py">--hue-rotate</span><span class="p">:</span> <span class="err">{{</span> <span class="n">yearProgress</span> <span class="err">|</span> <span class="n">times</span><span class="p">:</span> <span class="m">360</span> <span class="err">|</span> <span class="n">divided_by</span><span class="p">:</span> <span class="m">365</span> <span class="p">}</span><span class="err">}</span><span class="o">;</span> <span class="err">}</span> <span class="nt">&lt;/style&gt;</span> </code></pre></div></div> <p>But I don’t post here every day, so I also update it with some JavaScript in the footer…</p> <div class="language-js highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="js"><span class="kd">const</span> <span class="nx">dayOfYear</span> <span class="o">=</span> <span class="nx">date</span> <span class="o">=&gt;</span> <span class="nb">Math</span><span class="p">.</span><span class="nf">floor</span><span class="p">(</span> <span class="p">(</span><span class="nx">date</span> <span class="o">-</span> <span class="k">new</span> <span class="nc">Date</span><span class="p">(</span><span class="nx">date</span><span class="p">.</span><span class="nf">getFullYear</span><span class="p">(),</span> <span class="mi">0</span><span class="p">,</span> <span class="mi">0</span><span class="p">))</span> <span class="o">/</span> <span class="p">(</span><span class="mi">1000</span> <span class="o">*</span> <span class="mi">60</span> <span class="o">*</span> <span class="mi">60</span> <span class="o">*</span> <span class="mi">24</span><span class="p">)</span> <span class="p">);</span> <span class="kd">const</span> <span class="nx">yearProgress</span> <span class="o">=</span> <span class="nf">dayOfYear</span><span class="p">(</span><span class="k">new</span> <span class="nc">Date</span><span class="p">())</span> <span class="o">/</span> <span class="mi">365</span><span class="p">;</span> <span class="nb">document</span><span class="p">.</span><span class="nx">documentElement</span><span class="p">.</span><span class="nx">style</span><span class="p">.</span><span class="nf">setProperty</span><span class="p">(</span> <span class="dl">'</span><span class="s1">--hue-rotate</span><span class="dl">'</span><span class="p">,</span> <span class="nb">Math</span><span class="p">.</span><span class="nf">floor</span><span class="p">(</span><span class="nx">yearProgress</span> <span class="o">*</span> <span class="mi">360</span><span class="p">)</span> <span class="p">);</span> </code></pre></div></div> <p>Now my <code>--rotated-hue</code> value nudges itself every day starting from the base hue.</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/bg-hue.svg" alt="X-axis labelled “days of the year” and a y-axis labelled “hue”. The hue value starts in the middle of the y-axis and goes all the way up to the limit of 360 at half way through the year. Then it drops down vertically to zero and continues up at the same prior to the drop." /></p> <figcaption>Background hue over time</figcaption> </figure> <p>I put <code>--rotated-hue</code> inside an <code>hsl()</code> and it worked okay, but was decidedly boring. I needed a way to make it more dynamic.</p> <p>The next bit of magic was to use a slightly more complicated <code>calc()</code> function for the saturation value. Using some of the new CSS math functions, I take the <code>cos()</code> of the <code>--rotated-hue</code> to get a value between <code>1</code> and <code>-1</code>, then multiply that by <code>45%</code> which is my “base saturation” for my light mode theme. That gives me a value between <code>-45%</code> and <code>+45%</code>, so I double it and add another <code>45%</code> to avoid the gray zone of negative saturation.</p> <div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="css"><span class="nd">:root</span> <span class="p">{</span> <span class="py">color-scheme</span><span class="p">:</span> <span class="n">light</span> <span class="n">dark</span><span class="p">;</span> <span class="py">--hue</span><span class="p">:</span> <span class="m">196</span><span class="p">;</span> <span class="py">--rotated-hue</span><span class="p">:</span> <span class="n">calc</span><span class="p">(</span><span class="n">var</span><span class="p">(</span><span class="n">--starting-hue</span><span class="p">)</span> <span class="err">+</span> <span class="n">var</span><span class="p">(</span><span class="n">--hue-rotate</span><span class="p">,</span> <span class="m">0</span><span class="p">));</span> <span class="py">--hue-rotate-deg</span><span class="p">:</span> <span class="n">calc</span><span class="p">(</span><span class="n">var</span><span class="p">(</span><span class="n">--hue-rotate</span> <span class="err">*</span> <span class="m">1deg</span><span class="p">));</span> <span class="c">/* Convert to degrees */</span> <span class="py">--hue-rotate-wave</span><span class="p">:</span> <span class="n">cos</span><span class="p">(</span><span class="n">var</span><span class="p">(</span><span class="n">--hue-rotate-deg</span><span class="p">))</span> <span class="c">/* Magic */</span> <span class="n">--bg</span><span class="p">:</span> <span class="n">hsl</span><span class="p">(</span> <span class="n">var</span><span class="p">(</span><span class="n">--rotated-hue</span><span class="p">)</span> <span class="n">calc</span><span class="p">(</span><span class="m">45%</span> <span class="err">*</span> <span class="n">var</span><span class="p">(</span><span class="n">--hue-rotate-wave</span><span class="p">)</span> <span class="err">+</span> <span class="m">45%</span><span class="p">)</span> <span class="m">96.5%</span> <span class="p">);</span> <span class="p">}</span> </code></pre></div></div> <p>That creates the following effect over time…</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/bg-sat.svg" alt="X-axis labelled days of the year and y-axis labelled saturation. An inverted parabola starts at 0.9 and dips down to zero in the middle of the year and then gently curves back up to 0.9" /></p> <figcaption>Background saturation over time</figcaption> </figure> <p>For my dark mode I wanted a darker website, so I lowered the base saturation to <code>25%</code> …</p> <div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="css"><span class="k">@media</span> <span class="p">(</span><span class="n">prefers-color-scheme</span><span class="p">:</span> <span class="n">dark</span><span class="p">)</span> <span class="p">{</span> <span class="nd">:root</span> <span class="p">{</span> <span class="py">--bg</span><span class="p">:</span> <span class="n">hsl</span><span class="p">(</span> <span class="n">var</span><span class="p">(</span><span class="n">--rotated-hue</span><span class="p">)</span> <span class="n">calc</span><span class="p">(</span><span class="m">25%</span> <span class="err">*</span> <span class="n">var</span><span class="p">(</span><span class="n">--hue-rotate-wave</span><span class="p">)</span> <span class="err">+</span> <span class="m">12.5%</span><span class="p">)</span> <span class="m">18.5%</span> <span class="p">);</span> <span class="p">}</span> <span class="p">}</span> </code></pre></div></div> <p>Astute readers will notice I don’t add the full base saturation back to the value. This was intentional because as I slid the <code>--hue</code> value around I came across an ugly “background radiation” zone when <code>--rotated-hue</code> enters the green color space (h=75-115). For a month or two my site looked like dogshit. I minimized the undesired effect by letting it dip down into the gray in dark mode.</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/dark-sat.svg" alt="A shallower inverted parabola starts at 0.375 and dips down to -0.125 in the middle of the year and slopes back up." /></p> <figcaption>Dark mode background saturation over time</figcaption> </figure> <p>As you can see in the chart above, lowering the base saturation creates a less dramatic wave function dipping below the <code>0%</code> saturation. The resulting effect is that my light and dark mode now share the same <code>--rotated-hue</code> but have pretty different vibes. When I plot the two background saturations next to each other, you can see the relationship.</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/light-dark-sat.svg" alt="The previous two inverted parabolas layered on top of each other. The dark mode saturation curve sits below the light mode." /></p> <figcaption>Light and dark mode background saturation over time</figcaption> </figure> <p>If someone asked me today “What color is your website?”, I sort of love the fact that I don’t know. In fact, I’d almost have to consult a chart on any given day…</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/bg-color.svg" alt="The hue graph and hte background saturation curves overlayed on the same graph." /></p> <figcaption>Hue, saturation, and lightness for light and dark mode over time.</figcaption> </figure> <p>Ah yeah. It makes perfect sense. It’s <a href="https://www.youtube.com/watch?v=r0I80hWOFS8">materialized color operating on the 49th vibration</a>, you would make that conclusion walking down the street or going to the store.</p> <h2>Updating my accent color</h2> <p>The final step was improving my accent color. Finding a static color that had proper color contrast and worked well with every background color was difficult. I was hoping to find a shortcut but all roads led to making my accent color dynamic as well. How do I pick a color that works with every color? After <a href="https://codepen.io/davatron5000/pen/BaXpKOb?editors=0010">some experiments</a>, I leaned heavily on some <a href="https://razposlanse7dblearning.z21.web.core.windows.net/color-wheel-color-theory-calculator.html">third-grade art class color theory</a>.</p> <p>I found that rotating the <code>--rotated-hue</code> another 240º to get a triadic tone on the color wheel gave the accent color the best chance at standing out in both light and dark mode. You can see the relation to the background and accent hue when I plot them next to each other.</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/bg-accent-hue.svg" alt="The previous background hue chart overlayed with the accent color hue that has the same curve but starts 120 points lower on the y-axis and follows the same zig zag diagonal pattern, but offset about 33%" /></p> <figcaption>Background and accent hue over time.</figcaption> </figure> <p>I decided to use <code>oklch()</code> instead of <code>hsl()</code> for my accent color because I wanted the vibrancy that can only come from the <code>p3</code> color space.</p> <div class="language-jsx highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="jsx"><span class="o">--</span><span class="nx">accent</span><span class="p">:</span> <span class="nf">oklch</span><span class="p">(</span> <span class="mi">75</span><span class="o">%</span> <span class="mf">0.18</span> <span class="nf">calc</span><span class="p">(</span><span class="nf">var</span><span class="p">(</span><span class="o">--</span><span class="nx">rotated</span><span class="o">-</span><span class="nx">hue</span><span class="p">)</span> <span class="o">+</span> <span class="mi">240</span><span class="p">)</span> <span class="o">/</span> <span class="mi">1</span> <span class="p">);</span> </code></pre></div></div> <p>I tinkered with picking the color by hand so that I could try and maximize the number of days my accent color punches up into the <code>p3</code> space.</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/oklch.png" alt="Two color space representations next to each other. The first is the chroma value of 0.18 depicted by a rainbow gradient with red on left and violet on right but with a curving jagged peaks. A faint white line shows the boundary between rgb and p3 color space. Next is the hue of 196 representation but the slider has missing values where p3 is unable to render the color." /></p> <figcaption> <p>The <code>oklch</code> color graph from <a href="https://oklch.com/#75,0.18,196,100">oklch.com</a> for the accent color hue and chroma values</p> </figcaption> </figure> <p>It’s more art than science here but I feel good about the results.</p> <figure> <p><img src="https://cdn.daverupert.com/posts/2025/accent-color.svg" alt="The accent color hue zig-zag graph with static chroma and lightness values forming horizontal lines near the bottom and top (respectively)" /></p> <figcaption>Accent Color (OKLCH)</figcaption> </figure> <h2>Rotating colors is fun but not without its challenges</h2> <p>As far as challenges go, accessibility and proper color contrast is a concern. Contrast checkers don’t work the best with <code>p3</code>, but I’m sure that’s solvable. One challenge was my button text which I set in <code>#FFFFFF</code> in attempt to maximize contrast. It’s not perfect but it’s right more than its wrong. This is one place where Safari’s CSS <a href="https://css-tricks.com/exploring-color-contrast-for-the-first-time/"><code>color-contrast()</code></a> would be welcome to have in all browsers.</p> <p>I’ve also scoped my theme to two dynamic colors; adding more is difficult. I re-did my syntax highlighting theme and it’s doing okay (I used the other triadic tone), but more colors is more problems and the complexity balloons quick. Having some shades of gray in the style of <a href="https://open-props.style/">Open Props</a> would be helpful, so I may pursue that.</p> <p>I’m happy with how it turned out but there’s plenty of room for improvement. I doubt I will ever stop obsessively tweaking the color formulas to get it juuuust right. One thing that bothers me now are the puke yellows in my accent color (like today’s) and the greens in the background color aren’t my favorite. I’m embracing the randomness, but I’d love <a href="https://piccalil.li/blog/redesigning-piccalilli-the-first-part-of-the-design-process/">a yellow like Piccalilli’s website</a>. It might be possible to bump up the <code>oklch()</code> brightness in certain parts of the color journey, but requires more math.</p> <p>It would also be awesome to figure out how to change colors over a custom gradient as opposed to the hue wheel. Could I use a step-frame animation but grab a point on a conic gradient? Hm…</p> <p>Was it worth it? Did anyone notice? Yes, one person noticed. <a href="https://john.kreitlow.rocks/">My coworker John</a> is the only person who said anything. Good eye, John.</p> <p>All said and done, I like my little rotating color scheme. It’s fun waking up and wondering what color my website is today. If you’re having fun with color on your website I’d love to see it. I want all the <code>p3</code> inspiration I can get.</p> Mon, 20 Jan 2025 16:35:00 +0000 https://daverupert.com/2025/01/color-hue-rotating-gaslight/ https://daverupert.com/2025/01/color-hue-rotating-gaslight/ Making "this" less annoying <p>Now that I have a job where I’m writing web components full time, I see the <code>this</code> keyword more than I ever have in my whole life. It’s not a problem, per se, but you can see how it’s a little repetitive. I started wondering what my options were to fix this minor annoyance and the ShopTalk Discord helped me find a simple way and an over-the-top way to fix my issue.</p> <h2>Simple way: Overriding VS Code theme color tokens</h2> <p>By default my Github Light theme makes <code>this</code> a bold dark blue color. I didn’t want to roll my own theme though to scratch this niche itch, so I dug in and found out you can override single tokens in VS Code. Handy. The documentation is a bit opaque but here’s what you need to do:</p> <div class="language-jsx highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="jsx"><span class="c1">// settings.json</span> <span class="dl">"</span><span class="s2">editor.tokenColorCustomizations</span><span class="dl">"</span><span class="p">:</span> <span class="p">{</span> <span class="dl">"</span><span class="s2">textMateRules</span><span class="dl">"</span><span class="p">:</span> <span class="p">[</span> <span class="p">{</span> <span class="dl">"</span><span class="s2">scope</span><span class="dl">"</span><span class="p">:</span> <span class="dl">"</span><span class="s2">variable.language.this</span><span class="dl">"</span><span class="p">,</span> <span class="dl">"</span><span class="s2">settings</span><span class="dl">"</span><span class="p">:</span> <span class="p">{</span> <span class="dl">"</span><span class="s2">foreground</span><span class="dl">"</span><span class="p">:</span> <span class="dl">"</span><span class="s2">#b0b0b0</span><span class="dl">"</span> <span class="p">}</span> <span class="p">}</span> <span class="p">]</span> <span class="p">},</span> </code></pre></div></div> <p>Now my <code>this</code> looks like this…</p> <p><img src="https://cdn.daverupert.com/posts/2025/dimmed.jpg" alt="the keyword this in code set in a light gray, almost illegible font color" /></p> <p>It’s a calming sensation for me to have repetitive noise dimmed. I liked it so much I dimmed comments to match as well. I may even dim TypeScript because sometimes I wish I could hide the syntax, but keep the squiggles.</p> <h2>Over the top way: Replace <code>this</code> with a custom glyph</h2> <p>Changing colors is cool… but what if you could go one step further and replace <code>this</code> with an icon? What would an icon for <code>this</code> even look like?</p> <p>I asked the ShopTalk Discord and got some interesting ideas like the “☝️” emoji, which I think is funny in an “I’m with stupid” t-shirt sort of way. <a href="https://andrewwalpole.com/">Andrew Walpole</a> took it to the next level and <a href="https://www.redbubble.com/i/sticker/This-Logo-Yellow-by-walpolea/162159874.EJUG5">designed a custom glyph</a>:</p> <img src="https://cdn.daverupert.com/posts/2025/this.png" alt="the letter of the word this arranged in a diamond pattern" width="150" height="152"> <p><a href="https://www.alanwsmith.com/">Alan Smith</a> then figured out <a href="https://youtu.be/x1heJdtQapI">how to use Glyphs Mini to add a custom ligature to an open source coding font</a>. Andrew riffed on Alan’s work and exported a custom version of Fira Code with his custom glyph as a ligature. The last step was to install the font update my VS Code settings:</p> <div class="language-jsx highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="jsx"> <span class="dl">"</span><span class="s2">editor.fontFamily</span><span class="dl">"</span><span class="p">:</span> <span class="dl">"</span><span class="s2">'Fira Code Ligged', monospace</span><span class="dl">"</span><span class="p">,</span> <span class="dl">"</span><span class="s2">editor.fontLigatures</span><span class="dl">"</span><span class="p">:</span> <span class="kc">true</span> </code></pre></div></div> <p>Now my code looks incredibly futuristic…</p> <p><img src="https://cdn.daverupert.com/posts/2025/glyph.jpg" alt="the this glyph replacing instances of the glyph keyword in code" /></p> <p>Abusing typefaces to remove the repetitiveness of programming languages is fun. After seeing the icon <em>in situ</em>, the idea might be a smidge too wild for me due to reduced legibility. While I don’t use the custom glyph on the daily, this experiment does spark a deep desire in me to create a bunch of custom glyphs for common keywords so I can make JavaScript an entirely rune-based programming language.</p> <h2>Custom ligatures with CSS?</h2> <p>A wild idea, but it would be neat if you could create your own custom ligatures in CSS to avoid the need to re-bake custom fonts each time you have a niche typographic need. Here’s a pseudo-syntax of how that might work:</p> <div class="language-css highlighter-rouge"><div class="highlight"><pre class="highlight"><code data-lang="css"><span class="k">@font-face</span> <span class="s1">"Dave Hijinks"</span> <span class="p">{</span> <span class="py">match</span><span class="p">:</span> <span class="s1">"this."</span><span class="p">;</span> <span class="py">replace</span><span class="p">:</span> <span class="s1">"☝️."</span><span class="p">;</span> <span class="p">}</span> <span class="k">@font-face</span> <span class="s1">"Cloud2Butts"</span> <span class="p">{</span> <span class="py">match</span><span class="p">:</span> <span class="s1">"cloud"</span><span class="p">,</span> <span class="s1">"AI"</span><span class="p">;</span> <span class="py">replace</span><span class="p">:</span> <span class="s1">"butt"</span><span class="p">,</span> <span class="sx">url(fart.svg)</span><span class="p">;</span> <span class="p">}</span> <span class="nt">body</span> <span class="p">{</span> <span class="py">font-face</span><span class="p">:</span> <span class="s1">"Dave Hijinks"</span><span class="p">,</span> <span class="s1">"Cloud2Butt"</span><span class="p">,</span> <span class="nb">sans-serif</span><span class="p">;</span> <span class="p">}</span> </code></pre></div></div> <p>Anyways, it’s a thought. Not a serious proposal. This was a fun rabbit hole to travel down with some friends.</p> Wed, 15 Jan 2025 01:41:00 +0000 https://daverupert.com/2025/01/like-this-and-like-that-and-like-this-and-uh/ https://daverupert.com/2025/01/like-this-and-like-that-and-like-this-and-uh/ Twenty Twenty-Four <p>For <a href="https://daverupert.com/2024/01/twenty-twenty-three/">last year’s check-in</a>, I foreshadowed a year of changes for ol’ Dave Rupert and boy was I not kidding. New job, new car, new pets. But before we get into all that – for accountability’s sake – let’s check in on my resolutions from last year and see how I did…</p> <ul> <li><strong>Activate an active lifestyle</strong> - Nope.</li> <li><strong>Write more shitty sci-fi</strong> - Nope.</li> <li><strong>Draw more</strong> - Nope.</li> <li><strong>Write for other publications</strong> - Yes, I wrote for <a href="https://frontendmasters.com/blog/">Frontend Masters’ Boost blog</a> and <a href="https://multipa.ge/">Wilto’s Multipage Version</a> zine.</li> <li><strong>Survive the 2024 US Election</strong> - Yes, but what a disappointment.</li> <li><strong>Make a video game?</strong> - Yes, <a href="https://daverupert.com/2024/12/my-little-games-workshop/">I made and released a few</a> but also went beyond video games a bit.</li> </ul> <p>Final score: 50%-ish. That’s better than I expected. What did I do with the other 50% of my time if I wasn’t crushing it on my SMART goals? Let’s see…</p> <h2>A month-by-month recap</h2> <ul> <li><strong>Jan-April</strong> - Unemployed, interviewing for jobs 👎</li> <li><strong>April</strong> - Saw the solar eclipse 👍</li> <li><strong>May</strong> - Went to South Dakota for my nephew’s graduation 👍</li> <li><strong>May</strong> - Started my new job at Microsoft 👍</li> <li><strong>July</strong> - Went to San Diego - first week 👍, second week whole family got sick 👎</li> <li><strong>Aug</strong> - Adopted two dogs 👍, they are a handful and I’m allergic 👎</li> <li><strong>Aug</strong> - <a href="https://daverupert.com/2024/08/vibe-check-34/">Frostapalooza</a> 👍</li> <li><strong>Sept</strong> - Wife had knee surgery 👎</li> <li><strong>Oct</strong> - Deleted my Twitter account 👍</li> <li><strong>Nov</strong> - Went to Redmond and met my coworkers IRL for the first time 👍</li> <li><strong>Nov</strong> - Bought a new car 👍</li> <li><strong>Nov</strong> - <a href="https://daverupert.com/2024/11/goodbye-moogs/">Moogs passed away</a> 👎</li> <li><strong>Nov</strong> - <a href="https://daverupert.com/2024/12/adhd/">Diagnosed with ADHD</a> 👌</li> </ul> <p>Finding a job dominated the first half of my year. After some ups and downs I ended up in a good place at Microsoft. There’s a lot of positives going from self-employment to the corporate world (hey! actual benefits! stocks even!) but also a lot of organizational bureaucracy that I’m not used to navigating. I’m happy with the work I’m doing and feel lucky to get to work on web components each day.</p> <p>My wife and I’s trip to Pittsburgh for Frostapalooza was a big crescendo for the year. Months and months of practicing culminating in one big night. It’s hard to describe it other than some kind of nerd-flavored camp reunion but with guitars instead of computers. We had such a good time and the amount of music filling our house on a daily basis has increased ten-fold this year. For that I’m thankful.</p> <p>I often judge years based on if we hit our health insurance deductible and we hit it again this year. A lot of medium grade background stress: job hunt stress, new job stress, healthcare stress, election stress, etc. Thankfully – and I could be basking in the limelight of a good Christmas holiday and a week off from work – I hardly remember that stress anymore. It feels like I’ve shedded those layers of anxiety.</p> <h2>Stats for 2024</h2> <p>With all the qualitative out of the way, let’s get more quantitative about what we did this year…</p> <ul> <li><a href="https://daverupert.com/bookshelf/">52 books</a> - Still in the book-a-week club. I’m comfortable here but need to mix it up. I’m becoming cynical when I hear the same ten facts and sociological studies regurgitated to meet some new popular science zeitgeist. Political biographies are all the same five liberal or conservative party tent poles supported by some personal anecdote. I think I’m going to lean hard into sci-fi “snacks” – short, easy books – for the next year while supplementing with beefier book recommendations from trusted peers.</li> <li><a href="https://daverupert.com/archive/">61 blog posts</a> - Not a record but I’m happy with that number. Over a post a week is a good pace for me, doubly so if you consider that I fell off a blogging cliff since going corporate.</li> <li>9 gunpla - Way down from my 2023 peak.</li> <li>3 releases - <a href="https://mundango.daverupert.com/">Mundango</a>, <a href="https://pentablaster.daverupert.com/">Pentablaster</a>, and <a href="https://hardcodesoftskills.daverupert.com/">Hard Code &amp; Soft Skills</a>. My previous record was one, so this is stellar.</li> <li><a href="https://shoptalkshow.com/">49 episodes of ShopTalk</a> - I love hanging out with <a href="https://chriscoyier.net/">my friend Chris</a>.</li> <li>3 guest appearances - <a href="https://www.youtube.com/watch?v=azUEOy8_GHo">Bad @ CSS</a>, <a href="https://www.youtube.com/watch?v=-hXmRkM7dsQ">Smashing Hour</a>, and <a href="https://changelog.com/friends/72">Changelog &amp; Friends</a>.</li> </ul> <p>A pretty good year for me and it’d be great to maintain that pace next year. To be totally honest, my actual goal would be to do less next year. Sounds crazy, I know, numbers should only go up and to the right. But hear me out… what if they didn’t? Have we considered that option?</p> <p>I didn’t play video games as much as I would have liked to this year, so I’ll need to remedy that. I’ve got a backlog brewing but I’m having a good time <em>making</em> games and that’s a time tradeoff I’m okay with. But from a “great writers read” perspective, I should play more games. Related, I had to quit late night gaming with the boys because it effected my sleep and stress levels, but I want to get back to that. AAA gaming is in a rough state though.</p> <h2>Hopes for 2025</h2> <p>There’s five focus areas I’d like to pursue next year and I already have traction on most of these feel achievable, But I’ve been wrong about that in the past.</p> <p><strong>Seize work opportunities -</strong> It’s been a great first 7 months at Microsoft but I have some big projects shipping in the next quarter so I need to shift out of my “learning the ropes” mode into a more melee combat ready position.</p> <p><strong>Hunker down and be creative</strong> - I’m not excited about the state of the union right now, so I’m going to trust my instinct to burrow. I’ve got some apps, games, and shitty sci-fi ideas that I’d be happy to work on instead of doomscrolling the news. I feel okay about pursuing those ideas rather than getting mired in political headlines.</p> <p><strong>Slow down to 1x mode</strong> - The ability to consume books, podcasts, and videos at 2x is a super power but I feel a nudge to take life slower. Slowing down would hopefully increase the time-cost and make me more discerning about what I choose to consume. The fact that I view listening at 1x as a challenge tells me I should probably pursue it.</p> <p><strong>Join a club</strong> - Inspired by the documentary <a href="https://www.joinordiefilm.com/">Join or Die</a>, I think I need to join a club and participate in IRL more. Clubs give me an opportunity to burst my personal/internet bubble and meet people who don’t share my background, income, or political beliefs. But I can’t even think of what I’d want to do. Perhaps something hobby-related? Join a lodge? Volunteer at a food bank? I feel woefully unprepared that I don’t even have the beginning of an answer here.</p> <p><strong>Understand myself</strong> - Beyond work and side projects, the biggest project I’ll be undertaking in 2025 is going to be… me. Since the Summer, I’ve been on a mission to understand myself at a clinical level. Last year I lost a lot of weight, more than half of it has come back without much change in diet. I want to know what’s in this mountain of flesh and bones and brains that God gave me. I want to begin to untangle the Gordian Knot of Anxiety, Weight, and ADHD. This has meant seeing a new doctor, getting blood work done, seeing a therapist, evaluating medication, and a whole lot more. I even made it a “Project” in Notion so I’d actually follow through on it. My ideal outcome is to come up with a plan to get through the next five, ten, fifteen, thirty years and beyond. In the immediate future an unexpected medical malady has presented itself and I’ll probably have to undergo surgery next year.</p> <h2>We’ll take a cup of kindness yet, for auld lang syne</h2> <p>I know some had an awful 2024. I’d say mine was hard but good over the long haul. 2025 seems primed to bring its own existential challenges and I hope you find shelter. Tech is still in shambles right now but I’m starting to see hints of the icy job market thawing, but I’m unsure if it will ever go back to “normal”. And politics… oof. We’re already seeing the outputs of the self-inflicted chaos machine. Keep in mind that chaos is the goal; chaos to exhaust and disarm us, to <a href="https://www.vox.com/policy-and-politics/2020/1/16/20991816/impeachment-trial-trump-bannon-misinformation">flood the zone with shit</a>. So hold fast to your principles and conserve energy for the long haul. Keep your hand on the plow and keep your eyes on the prize. Hold on.</p> Mon, 30 Dec 2024 15:20:00 +0000 https://daverupert.com/2024/12/twenty-twenty-four/ https://daverupert.com/2024/12/twenty-twenty-four/ Vibe Check №36 <p><a href="https://www.kut.org/energy-environment/2024-11-01/this-octobers-heat-blows-away-the-previous-record-set-77-years-ago">Hottest October on record</a>. November weather was much nicer, but lacked the much needed rain. We now pass the solstice and crash into the new year without so much as a sneeze from the gods of winter. My son’s team took second in the Fall baseball championship game. My daughter’s cheer team won their first competition gaining them a bid to nationals in the spring. Exciting times in Rupert family sports, I tell ya.</p> <p>Three major holidays have passed since the last update so I’m sure it’s going to be too much to distill, but I’ve tried to blog through the bigger vibes like <a href="https://daverupert.com/2024/11/goodbye-moogs/">my cat passing away</a>, <a href="https://daverupert.com/2024/12/adhd/">my ADHD diagnosis</a>, and <a href="https://daverupert.com/2024/12/my-little-games-workshop/">releasing some games</a>. So with those abstracted out, let’s reminisce on the recent past…</p> <h2>A trip to the mothership</h2> <p>The biggest event was my trip to Microsoft in November. It’s been nearly a decade since I’ve been to the Microsoft campus, but notably this is the first time I’ve met my new coworkers in person! I’m happy to report that my coworkers are all great people. Thankfully my small engineering team as well as the larger design organization is high functioning when it comes to hybrid/remote work, so I don’t feel left out of the on-premise centralized loop that I’ve felt in previous Microsoft engagements. My team made it easy to <code>&lt;slot&gt;</code> (!!!) in and feel welcome.</p> <img src="https://cdn.daverupert.com/posts/2024/opinions.jpg" alt="A printout of my avatar with a speech bubble that says I'm here with opinions" height="600" width="600" style="width: 100%; max-width: 400px"> <p>An example, my sweet coworkers hung up a print out of my avatar in one of the conference rooms with a little speech bubble that says “I‘m here with OPINIONS” which I find endearing. The side bonus is that Teams the app sees the avatar and thinks its a person and will zoom-in on it in every meeting. My avatar is an ever-present participant in a lot of meetings to the extent that five different people walked up to me said “Oh, it’s the guy from the conference room!” which is probably the biggest payoff to a long running gag that I’ve seen in my lifetime.</p> <p>We spent most days strategizing in conference rooms but also did morale building events. One highlight for me was our studio’s tour of the Microsoft Inclusive Tech Lab where I got to talk with Dave Dame. I’ve been a fan of his for awhile now, he has a way of communicating the need to reject “other-ism” that sticks with you. He shared with us some of the challenges he faces as a person with limited mobility and <a href="https://www.youtube.com/watch?v=IFYCVWm4K4A">how AI is impacting his life for the better</a>. One night a group of us remote and local employees went out for dinner and ate grasshoppers. Another highlight was sneaking into a demo day event where designers at Edge were prototyping in the browser with web components. This grinch’s heart grew three times that day.</p> <p>Everyone apologized for the rain while I was there but I loved the soggy weather coming from six months of Texas heat. I found it nothing but charming. Redmond has grown up considerably in the decade since my last visit, and the Microsoft campus is almost unrecognizable to me. Redmond used to be a bunch of small one or two story buildings but now it’s all enormous five story buildings. Redmond was wooing me pretty hard though I won’t lie; next to my hotel was an outdoor mall that had an <em>izakaya</em>, a games shop, a guitar center, and an upscale Hobbytown with Gunpla! It felt like my own personal Disneyland generated from my search history.</p> <p>Spent a lot of time with work folks, but I caught up with a couple old friends while I was there. One night I met up with Kyle who was the other engineer at Luro who now works at Amazon. We were long overdue to celebrate in person together and close a chapter on the two years of intense sprinting we did together at Luro. Then I got to see Kelly and Charles who I worked with through multi-year engagements on microsoft.com, it’s great to know other people at such a big place like Microsoft. And one night I snuck over to Fremont for a memorable night of playing vintage and indie arcade and pinball games with Adam Argyle. It’s good to have good friends from the internet.</p> <p>All said, I think the main purpose of my trip – firm handshakes and letting my coworkers know I’m a real person – was a success. Hopefully, I’ll find myself in Redmond more often.</p> <h2>Other major happenings</h2> <p>A speed run of other notable events but in the interest of time we’ll keep it brief:</p> <ul> <li>In October I deleted my X account. I call it X because that’s it’s new name and it’s a stupid name for a stupid website. I put 14 years into that site and it’s surprising how easy deleting my account was. Over time logging in felt icky and the “heartbeat of the internet” parts have been co-opted by Russian bot farms. I don’t thrive on the self-created chaos Elon brings and I don’t want to support whatever flavor of white male supremacy is flourishing there. Bluer and calmer skies over on Bluesky and (my favorite) Mastodon.</li> <li>Halloween was a hit. My block does it pretty big and we’re lucky to have hundreds of kids roaming on my street.</li> <li>I only drive about 20 miles a week and I wanted those 20 miles to be fun, so we bought a Jeep. It’s a whole vibe to be honest. You can even make “Jeep” your entire personality if you want. I’m not there yet, but having fun exploring the space.</li> <li>Thanksgiving was low key and bought the Whole Foods pre-made dinner for four. That made prep-day simple and no one got overwhelmed.</li> <li>The last weekend in November <a href="https://daverupert.com/2024/11/goodbye-moogs/">our elderly cat Moogs passed away</a>.</li> <li><a href="https://daverupert.com/2024/12/adhd/">I got diagnosed with ADHD</a> and started taking meds.</li> <li>We stayed in town for Christmas and that was pretty wonderful. Mrs. Claus did a great job getting presents for the kids.</li> </ul> <p>Recapping three whole months isn’t fun, but spinning off some of the major events into their own posts was pretty efficient so I should do that more.</p> <h2>The more quantifiable parts</h2> <h3>🧠 <strong>Learning</strong></h3> <p>I’m sure this list is incomplete, but went down some rabbit trails researching health issues like my ADHD but a couple non-health issues as well.</p> <ul> <li>ADHD and the different medication options</li> <li>Intermittent fasting and the effects of glucose spikes and insulin resistance.</li> <li>Tone.js - In my side projects I got to play with Tone.js a bit and I love it.</li> <li>Soviet Central Planning - I’m curious why soviet central planning failed. This overlaps with to Stalinist communism, World War II, Russian cosmonauts, and Kremlinology.</li> </ul> <h3>🚀 Releases</h3> <p>I got hellbent on releasing some projects this quarter and feel accomplished even if they are small in scope.</p> <ul> <li><a href="https://mundango.daverupert.com/">Mundango</a> - A game about noticing life’s small things</li> <li><a href="https://pentablaster.daverupert.com/">Pentablaster</a> - An instrument with no wrong notes</li> <li><a href="https://hardcodesoftskills.daverupert.com/">Hard Code &amp; Soft Skills</a> - A workplaced themed RPG</li> </ul> <p>I wrote about <a href="https://daverupert.com/2024/12/my-little-games-workshop/">my little games workshop</a> more in depth if you’re curious about the why or my process. I’m also play testing a game with the ShopTalk Discord and am slowly iterating towards a release.</p> <h3>📖 <strong>Reading</strong></h3> <p>Read a lot more than I expected. After multiple recommendations I finally started reading The Murderbot Diaries and holy cow, what a great series. Each book is like a little 150-page snack that I get to enjoy. It feels good to read (e-)paper books again too, not just audiobooks.</p> <p><strong>Finished</strong></p> <ul> <li><a href="https://amzn.to/3nbn1hV">Humankind</a> - Finished this book for the second and it’s as great as I remember. I probably need to buy a physical copy that I can highlight up.</li> <li><a href="https://amzn.to/40I8Rw8">It’s not you, it’s Capitalism</a> - Marxist communism wrapped in a “You go girl!” blanket. Not for me but a good critique of the capitalist system is in there.</li> <li><a href="https://amzn.to/3UKf5Ic">Lost in Austin</a> - The history of Austin, as told by an Englishman, focusing on the rapid growth tech boom town era from the early 2000s to present. It’s an ever present fear that Austin is changing too much, but this book makes a good argument that what made Austin cool can’t live in the new upscale downtown and high rents.</li> <li><a href="https://amzn.to/3ChWZH5">All Systems Red</a>, The Murderbot Diaries No.1 - A sassy and depressed robot built for murder finds a new life after it hacks its governor module.</li> <li><a href="https://amzn.to/3CuuhTr">The Psychology of Money</a> - I thought this was going to be a book about understanding money from a psychological perspective; instead it was a book about how rich people abuse the system and it made me mad.</li> <li><a href="https://images-na.ssl-images-amazon.com/images/P/B075DGHHQL.01._SCLZZZZZZZ_.jpg">Artificial Condition</a>, The Murderbot Diaries No.2 - Another great sassy robot read.</li> <li><a href="https://amzn.to/3VhtcFd">Play Nice</a> - The rise, fall, and collapse of Activision/Blizzard. As someone who plays games by this company, I found it cathartic.</li> <li><a href="https://amzn.to/4gbKrjd">Thinking in Systems</a> - I went in hoping for design system inspiration but got mad about the incoming Trump administration because it’s a lot about incentives and guardrails, which will soon flip upside down.</li> <li><a href="https://koguchipress.com/products/koguchi-magazine-1-arcana-dawn">Koguchi Magazine #1</a> - A sci-fi kickstarter comic I backed… not my favorite.</li> <li><a href="https://koguchipress.com/products/koguchi-magazine-2-neo-future">Koguchi Magazine #2</a> - Issue #2 of the sci-fi kickstarter comic I backed… was a little bit better than the first.</li> <li><a href="https://amzn.to/4fRPUMt">Life in the Fasting Lane</a> - A book on the benefits of intermittent fasting… not my favorite</li> <li><a href="https://amzn.to/49B0bdt">Fair Play</a> - A subject I care about, the inequality gap between men and women when factoring in all the “glue work” and homemaking tasks that (typically) women absorb as part of their duties… but the husband in this book is such a cringe asshole it’s hard to think a card game is going to solve their problems when what they need is marriage counseling. I don’t want to be in the middle of that relationship so I didn’t finish the book.</li> <li><a href="https://amzn.to/3OWoCsA">Glucose Revolution</a> - Either this book is the holy grail to fixing all health problems in America… or it’s a book by someone who took a simple fact (glucose spikes aren’t great for your body) and extrapolated that to be the cause of all health problems ever. I think it’s the latter.</li> <li><a href="https://amzn.to/3VEyxXv">Rogue Protocol</a>, The Murderbot Diaries No.3 - More sassy robot. Great.</li> </ul> <p><strong>Started</strong></p> <ul> <li><a href="https://amzn.to/3Dq70mj">Exit Strategy</a>, The Murderbot Diaries No.4</li> </ul> <h3>📝 <strong>Blogging</strong></h3> <ul> <li><a href="https://daverupert.com/2024/10/super-web-components-sunshine/">Where web components shine</a> - A post celebrating web components.</li> <li><a href="https://daverupert.com/2024/10/hammers/">Hammers</a> - A post about hammers and nothing else.</li> <li><a href="https://daverupert.com/2024/11/goodbye-moogs/">Goodbye, Moogs</a> - A tribute to my cat who passed away.</li> <li><a href="https://daverupert.com/2024/12/adhd/">I got the ADHD, too</a> - A diagnosis! A plan!</li> <li><a href="https://daverupert.com/2024/12/intermittent-fasting/">Intermittent fasting</a> - A new diet I’m trying out.</li> <li><a href="https://daverupert.com/2024/12/every-token-is-a-feature/">Every token is a feature</a> - A post about design systems.</li> <li><a href="https://daverupert.com/2024/12/css-wants-to-be-a-system/">CSS wants to be a system</a> - A post about CSS.</li> <li><a href="https://daverupert.com/2024/12/my-little-games-workshop/">My little games workshop</a> - A post about how I’ve been making games this year.</li> </ul> <h3>📺 Media Diet</h3> <p>Let’s take a look at what was on the ol’ boob tube.</p> <p><strong>Movies</strong></p> <ul> <li>Join or Die (2024) - Documentary about Robert Putnam’s life work analyzing civil decline. Warning: this will make you want to change your life a bit.</li> <li>PLAY! (2024) - A classic Japanese sports team story but this time with kids from remote Shikoku forming a Rocket League eSports team. It’s not rated well on Letterboxd, but I enjoyed it. Caught this one on a plane.</li> <li>Jingle All the Way (1996) - Rewatched this Christmas classic… and it’s super unhinged.</li> <li>The Best Christmas Pagent Ever (2024) - A sweet Christmas story if you’re into the whole “true meaning of Christmas” message.</li> </ul> <p><strong>TV</strong></p> <ul> <li>Interior Chinatown (Hulu) - An all-star cast headed up by Jimmy O. Yang from Silicon Valley. Half procedural cop drama, half Truman show, it all comes together in a way that produces a wonderful commentary on seeing people and cultures that act like background characters behind the scenes.</li> <li>Very Important People S2 (Dropout) - Vic Michelas is as it again.</li> <li>Make Some Noise S3 (Dropout) - This show is really stepping into its own.</li> <li>Ranma ½ (Netflix) - I wanted to see if it was as good as I remembered it… and I’d say yeah. Not for kids tho.</li> <li>Skeleton Crew (Disney+) - This is Goonies in Space and I’ll take it. I haven’t been able to get into any of the extracurricular Star Wars shows but this one hits with me because I think it knows what it needs to be… a Star Wars story that can exist and play in that universe, but break away from the classic Star Wars tropes.</li> </ul> <p><strong>Podcasts</strong></p> <ul> <li>The Adventure Zone Abnimals - I don’t know about this one, but is growing on me.</li> <li>Maintenance Phase - Re-listening to a lot of favorite episodes</li> <li>If Books Could Kill - Such a fun look at popular culture through the lens of books. The “shitty person says something shitty” formula is getting tired but… nonetheless.</li> </ul> <h3>🎙 <strong>Recording</strong></h3> <p>Recorded some great episodes of Shoptalk, chief among them was a live action role play episode of ShopTalk.</p> <ul> <li><a href="https://shoptalkshow.com/646/">Hard Code &amp; Soft Skills</a> - Chris, Alex, Ben, and Miriam play an RPG game that I devised.</li> <li><a href="https://shoptalkshow.com/642/">Chris Person on Forums, Reddit, and Cooperative Reporting</a> - Forums rule.</li> <li><a href="https://shoptalkshow.com/637/">Approachable Open Source with Brian Muenzenmeyer</a> - Is open source without burnout possible?</li> </ul> <h3>🤖 Gunpla and modelling</h3> <img src="https://cdn.daverupert.com/posts/2024/beargguy.jpg" alt="A teddy bear mech with a bow on its back that looks cute in one photo but angry in the next" height="600" width="1200"> <p>Cooled off on Gunpla but have got the bug to pick it back up as work becomes less busy. Exhausted by the slower process of the master grade format, I decided to go back to high grade models to get the passion back.</p> <ul> <li>MG Red Frame Astray - stalled</li> <li>Beargguy III - completed</li> <li>AK-47 Rubber band gun - my brother got me this wooden model of an AK-47 rubber band gun and I’m about half way done and it’s been pretty fun.</li> </ul> <h3>🌱 Digital Gardening (née Open Source)</h3> <p>Renaming this category because technically work is open source a bit and that’s confusing, so I thought I’d make it more about growing and maintaining web objects.</p> <ul> <li>Tinkering on my website in subtle ways</li> <li>Making little web components, per usual</li> <li>Attended some Web Components Community Group meetings.</li> </ul> <h3>👾 <strong>Video games</strong></h3> <p>Spent more time making games than playing games. My PC had a catastrophic BIOS update failure and the verdict’s still out but I might need to rebuild the whole thing.</p> <ul> <li>Brawl Stars - this game is a treadmill I don’t need to be on.</li> </ul> <p>Got an <a href="https://anbernic.com/products/rg35xx-plus">Anbernic RG35XX Plus</a> pocket emulator for Christmas, so hopefully my vintage game plays list will grow.</p> Sat, 28 Dec 2024 19:54:00 +0000 https://daverupert.com/2024/12/vibe-check-36/ https://daverupert.com/2024/12/vibe-check-36/ My little games workshop <p>I always promised myself that if I was ever unemployed that I’d make a video game. When life dealt me an unpaid work hiatus though, the last thing I wanted to do was code in my spare time<sup class="footnote-ref"><a href="#fn1" id="fnref1">1</a></sup>. I worried I would have to let that dream, that part of me, die on the vine. But as interviews started going well the desire to try my hand at making a game came back. And in true adult ADHD fashion I didn’t focus on one game, but rather made a half-dozen different games in different formats and three of those games have made it to the release stage. Here’s an overview of those games and a little background on how I manage to make them.</p> <h2>Mundango, a bingo game about life’s small things</h2> <img src="https://cdn.daverupert.com/posts/2024/mundango-v1.png" alt="the bingo board ui for mundango" width="1200" height="719"> <p>During my unpaid hiatus I found myself getting a lot of pleasure in the small things; seeing a cool bird, staring at trees, or watching animals be animal-like. To not lose sight of those moments and with a desire to replace my social media addiction, I made <a href="https://mundango.daverupert.com/">Mundango</a>, a bingo game about noticing life’s small things.</p> <p>The icon is a chill turtle because it invokes the feeling of going slow. The font is a playful little handwritten sans. And there’s a (Japan-inspired) minor pentatonic scale that plays as you check items off. I hope you enjoy it but more importantly I hope it nudges you (and myself) to stop doomscrolling on our phones so much and to start looking outside the windows a bit more often.</p> <h2>Hard Code &amp; Soft Skills, a workplace adventure</h2> <p><img src="https://cdn.daverupert.com/posts/2024/hcss.jpg" alt="A character creator tool for hard code soft skills" /></p> <p>In January, the unemployment got to my head and I got inspired to make a role playing game called <a href="https://hardcodesoftskills.daverupert.com/">Hard Code &amp; Soft Skills</a>. It’s a workplace-themed<sup class="footnote-ref"><a href="#fn2" id="fnref2">2</a></sup> clone of <a href="http://www.onesevendesign.com/laserfeelings/">Lasers &amp; Feelings</a>, a one-pager by John Harper. The original game is loosely based on Star Trek, where you can use lasers or diplomacy to solve your problems. I wanted to flip that a bit and have the game world be a startup because tech needs to realize that soft skills are as valuable as code, so that’s my big social commentary.</p> <p>It wasn’t labor intensive to clone the original game, but I put a lot of time into building a little one-page website with a character generator. It’s Astro and web components, if you’re curious. I also put a lot of mental energy in planning out the <a href="https://shoptalkshow.com/646/">first episode of Hard Code &amp; Soft Skills on Shop Talk</a>. It went better than I could have imagined and what a thrill to get it out the door.</p> <h2>Pentablaster, an instrument with no wrong notes</h2> <img src="https://cdn.daverupert.com/posts/2024/pentablaster.png" alt="the UI for pentablaster" width="1200" height="719"> <p>The pentatonic scale sound effects in Mundango were a hit with some folks, so I dug in and built a whole instrument that only plays pentatonic scales and called it <a href="https://pentablaster.daverupert.com/">Pentablaster</a>! It took about a week and I’m pleased with how it turned out. It’s jammy and a little unique. I extended it to allow you to change the key and to choose which pentatonic scale you want to play.</p> <p>There’s some features I’d like to add, but worry it’ll enter the “so complicated I don’t want to work on it anymore” paradox. I’ll park it for now, but I learned a lot about <a href="https://tonejs.github.io/">Tone.js</a> in the process.</p> <h2>An unreleased solitaire game</h2> <img src="https://cdn.daverupert.com/posts/2024/youdied.jpg" alt="a skull with the text you died beneath it and a button that says reset game" style="width: 100%; max-width: 300px;"> <p>I went on a short bender learning about Solo RPGs (like <a href="https://coisinhaverde.itch.io/ronin">Ronin</a>) and that sparked an interest in trying my hand at making one. I challenged myself to prototype the game on pen and paper first to prove the game mechanics. After an evening of brainstorming, I devised a game system based on a standard 52-card deck of playing cards as a prototype. I play-tested it with my son and we both thought that I should make a mobile app version. After some nights and weekends, I had a rough alpha prototype.</p> <p>I play-tested the game with friends in the ShopTalk Discord and I got great, actionable feedback. They confirmed my suspicion that the RNG (randomness) was too high, creating a lack of decision making agency and thereby ruining the fun. I made some tweaks and the second round of play-tests went much better. It’s feeling pretty good now, but I think there’s one more ingredient needed to tie it all together before public release.</p> <h2>An unreleased Playdate game</h2> <p><video src="https://cdn.daverupert.com/posts/2024/newguy.mp4" muted autoplay loop playsinline alt="player walking around in office with npc boss in room, he exits and goes to a much larger room, black and white monochrome only"></video></p> <p>Since acquiring a little yellow wind-up boi, it’s been a small dream to write a game for <a href="https://play.date/">Playdate</a> and I picked the idea that seemed like the easiest and most PlayDate’y and descoped the hell out of it so that I’d have an achievable goal. It’s an office-themed<sup class="footnote-ref"><a href="#fn3" id="fnref3">3</a></sup> RPG type game.</p> <p>After playing with Playdate’s web-based game editor <a href="https://play.date/pulp/">Pulp</a> and trying PulpScript, I felt the chafing of limitations and wanted to get closer to the metal. I watched every one of <a href="https://www.youtube.com/watch?v=ZPcfC98JogQ&amp;list=PLlMPQvEA0GZPOuKJyhSr3Ra0vrpCiBTnb">SquidGod’s Development Tutorials</a> and decided to download the <a href="https://play.date/dev/">Playdate SDK</a> and write the game in Lua. This is my first time writing Lua and it’s been interesting because everything in Lua is a table: Arrays are tables, Dictionaries are tables, Objects are tables… tables all the way down. That takes some “undoing” of prior programming best practices to feel comfortable but after awhile you learn to embrace the chaos and for-loopedness.</p> <p>To short cut some of the player controllers and level building I picked <a href="https://github.com/unbelievableflavour/Cotton?tab=readme-ov-file">Cotton</a>, a Lua-based framework for Playdate. Cotton uses the <a href="https://ldtk.io/">LDtk map editor</a> for easier map making and that was a feature I was looking forward to using. However, I encountered a bug somewhere between the framework and LDtk. If I updated the map, my player could no longer get to a different room. Insecurity started to set in:</p> <ul> <li>Is this bug because I don’t know Lua?</li> <li>Is this bug because I don’t understand LDtk?</li> <li>Or is this a bug somewhere in Cotton?</li> </ul> <p>Feedback from the Playdate Dev Discord was “Last commit is 2 years ago, project’s dead” and “Use [Framework X] instead”… 😮‍💨 Ugh. I thought only JavaScript dorks did this but apparently Lua dorks do it too. I understand they’re trying to be a version of helpful; but this is terrible advice for someone who is learning. “You need to start over” or in video game parlance “The Princess is in another castle” kills the dopamine rush needed when learning something new.</p> <p>But I didn’t give up. And after many shower thoughts, I mustered up the energy to do some good ol’ fashioned debugging. The first step was step-by-step isolation where I manually diff’d thousands of lines of JSON line-by-line. That one step taught me there was a change in the exported JSON somewhere between the version of LDtk that Cotton used (v1.3) and the latest version of LDtk (v1.5.3). The primary key for joining map tiles no longer exists in v1.5.3. Then I followed the breadcrumb trail of how Cotton imports LDtk files and I fixed the bug by creating a new table (because Lua) to act as a join table for the neighboring map tiles.</p> <p>I was able to finish my core game loop and I’m proud of that, but fixing a framework level bug cut the wind out of my sails. <a href="https://github.com/unbelievableflavour/Cotton/issues/36">I may PR the bug fix</a>… but it’s more of a patch job than a holistic fix and I’m unsure if the author of Cotton is even interested in supporting that on their abandoned project.</p> <p>Will this game ever come out? I hope so, but it’s emotionally hard to pick up after fighting with it so much. If I buckled down, built some assets, and wrote more NPC dialog I bet I could finish it in a couple human weeks of work. Perhaps I could outsource the asset creation.</p> <h2>How the sausage gets made</h2> <p>I make my games after the kids and spouse go to bed or while the TV runs mindlessly. In some ways I’m borrowing from my own mental health staying up late tinkering with little apps that I’m going to give away for free. But these ideas all occupy brain RAM, so it feels good to chip away at ideas and get them out the door, to make room for more ideas, to chip away at ideas, to get them out the door… it’s a vicious cycle, but I think a net positive for my mental health.</p> <p>To hedge against wasting my spare time, I get prototypes out for review as soon as possible to gauge interest and invest accordingly. Shopping prototypes curbs emotional over-investment in an idea. Time builds attachment to bad ideas, making them seem good and grander in your head than reality. If you build in secret too long, it ends in disappointment when the public doesn’t understand your genius you spent all your time on.</p> <p>I default to web tech because it’s what I know best and staying in your wheelhouse means you can move faster with less mystery roadblocks (like the LDtk map issue above). But I’d like <em>NOT WORK</em> to not feel like work and see value in that, so this may change going forward.</p> <p>At times I create artificial limitations (e.g., limit myself to a single asset pack) because if the scope is overly broad and infinite, that guarantees failure. Having rules, even if arbitrary, allows for play.</p> <p>The last tool in the toolbelt is scoping the hell out of my ideas. When attention is your biggest limitation (e.g. ADHD) then keeping checkpoints small and achievable are critical. Then once you have the foundations established, do as much as time and ambition allow.</p> <h2>Unsure of what’s next… or how to book all of your free time from now until death with no promise of financial gain.</h2> <p>I have dozens of ideas kicking around in my head at all times, so my main issue is prioritization. Here’s the ideas that occupy a lot of brain RAM:</p> <ul> <li>Finishing <a href="https://daverupert.com/2023/03/gamedev-journal-1/">my son’s Zelda-like</a></li> <li>An ambitious battle royale that would take a hundred developers a hundred years to finish</li> <li>A platformer with a slime mechanic</li> <li>A local multiplayer game that has a Mario Kart vibe, but isn’t a karting game.</li> <li>A Solid Snake stealth game but for escaping awkward social situations</li> <li>A horror game parody</li> <li><a href="https://www.youtube.com/watch?v=01B4BqWxtKo">Tim McGraw’s What-if? Trucks: Fates</a></li> <li>A space shooter / medical sim</li> <li>A Contra-like with a dumb twist</li> </ul> <p>That’s a sampling of what’s going on up in the ol’ electric meatball. Not to be too macabre, but I’m not sure I have the lifespan left to get through even half of that short list. Hopefully there’s a banger billion dollar idea in there that allows me to retire and work on all the non-profitable dumb ideas.</p> <p>While doing this for a living is far off and/or will never happen I am at least pleased that I lived up to the promise to myself to make games if I had spare time. I made games, smaller in scope than what I had originally imagined, but I’m comfortable with that given the timelines. No regrets there.</p> <p>Risky as it may be, I may jump to a 3D engine because I’ve had a lot of fun building in environments like Unity in the past. That balloons the scope and raises the level of difficulty beyond my current expertise and it has never worked in the past… but perhaps this time it’ll be different! 😂</p> <section class="footnotes"> <ol> <li id="fn1"> <p>I had some big work emotions and burnout to process <a href="#fnref1" class="footnote-backref">↩</a></p> </li> <li id="fn2"> <p>I’ve already established that yes, I was processing some work emotions. <a href="#fnref2" class="footnote-backref">↩</a></p> </li> <li id="fn3"> <p>Again, processing some work emotions over here. <a href="#fnref3" class="footnote-backref">↩</a></p> </li> </ol> </section> Thu, 26 Dec 2024 21:17:00 +0000 https://daverupert.com/2024/12/my-little-games-workshop/ https://daverupert.com/2024/12/my-little-games-workshop/ CSS wants to be a system <p>I’ve realized something obvious again, this time about CSS; that CSS wants to be a system. At the core of CSS is a series of cascading rules and classes marrying and mingling in an elegant symphony of style application. Dozens and dozens of declarative instructions for painting pixels on the screen come together in under a millisecond. Sometimes it creates magic, other times it creates memes.</p> <img src="https://cdn.daverupert.com/posts/2024/cssisawesome.png" alt="CSS is aweso-me" height="436" width="600" style="width: 300px; max-width: 100%;"> <p>At its core, CSS wants to be a system and – besides its quirky selector power ranking algorithm – it doesn’t come with one out of the box. CSS wants you to build a system with it. It wants styles to build up, not flatten down. It even has <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@layer">layers</a> as a feature! You can start small with a <a href="https://piccalil.li/blog/a-more-modern-css-reset/">minimalist reset</a> or satisfy your inner typenerd with a <a href="https://clagnut.com/blog/2433">typographic default</a> and build up from there. You can make your own reset. You can establish your own naming convention. You can decide to nest or not. You can use IDs. You can use only-classes. You can even dip a toe into the Shadow DOM if you crave the dark arts. Hell, I encourage you to use <code>!important</code> just to feel something.</p> <p>Not everyone wants to conduct that symphony and I understand that. A nice thing about that CSS is that it’s sharable! Plenty of pre-built systems exist to let you offload that skill. Through the magic of copy-and-paste, you too can have high quality design! But don’t mistake a shortcut as the only valid option. We as humans and technologists like to compare objects and declare winners – to be kingmakers! – but it’s a mistake to shop at only one store and only eat meatballs despite the ubiquitous appeal of Scandinavian design.</p> <p>CSS wants to be a system and it’s not an impossible task to make your own. Will there be mistakes and bad assumptions? Yeah. Will there be a <code>junk.css</code> file? Probably. Will you commit CSS crimes? Indubitably. Is CSS just thousands of key-value pairs with random collisions implemented in an uneven distribution among a handful of different browsers? It sure is, but I wouldn’t have it any other way.</p> <p>In all my years of programming I have never loved a language more than CSS. There’s no other programming language that sparks my brain and lights up my imagination like CSS. Even after thirty years, there’s a rush of adrenaline when I see a complex design and I wonder “How am I going to make that happen?” which leads me to “And how am I going to make that happen on a phone and older browsers?” That’s the fun part of the job. And it’s good to know that there are other people out there who are great at CSS, people who can build up and tear down these systems with ease, people I can siphon knowledge from and build up my own skills when a new challenge arises.</p> <p>So cheers to the CSS folks, the tinkerers. Your obsessive animations, pixel pushing, and system building – both delicate and strong – are fun to see and experience.</p> Mon, 23 Dec 2024 23:03:00 +0000 https://daverupert.com/2024/12/css-wants-to-be-a-system/ https://daverupert.com/2024/12/css-wants-to-be-a-system/ Every token is a feature <p>I’m in the middle of a design tokens project and I thought I’d share something I’m learning that is probably obvious to everyone else; every design token is a feature.</p> <p>A token is a magical contract between design and engineering, if we agree to use the same name to abstractly refer to the same value, it will produce a desired outcome. That bridge alone is probably worth the investment, but tokens solve even more organizational problems. The mobile app and the website can look the same by sharing a single JSON file. But wait, there’s more! If the blue a different team chose is not blue enough for you, you can make your own blue and apply it at the global scope or the individual element scope. Tokens as an organizational feature are a powerful concept but there’s tons of nuance packed behind it.</p> <p>Like features, too many tokens can bloat your system. I recently learned –because I’m lucky to work with people who work on browsers– there’s a not-so-theoretical limit where the browser starts taking a performance hit based purely on the number of CSS variables. There’s no hard upper limit on the number of variables (we drew a line at ~500) because the limit ultimately depends on the size and the depth of your DOM. Style recalcs and tree walking are expensive problems for a browser. Alias tokens like <code>--foo: var(--bar)</code> compound the problem and the more static you can be, like <code>--foo: #bada55</code>, the better. Infinite customizability and peak performance are often at odds.</p> <p>Like features, too many tokens can create organizational problems! This is the opposite of what I said above, how can that be? It’s possible to generate enough tokens that they become their own <a href="https://robinrendle.com/essays/systems-mistakes-and-the-sea/">hyperobject</a>, impossible to comprehend from the outside, so well-meaning people eject from the system. Detached instances. One-offs. Snowflakes.</p> <p>Like features, tokens can create little piles of <a href="https://daverupert.com/2020/11/technical-debt-as-a-lack-of-understanding/">technical debt</a>. “Is anyone still using <code>--color-beefcake-primary-2</code>?” you shout into the void of the team chat. No one responds because no one knows. The person who does know left the company five months ago. Alas, we’ll bolt on more until we find time to fix it. Always adding. Never subtracting.</p> <p>Like features, some tokens are going to have a massive payoff if implemented and some tokens the user benefit is less clear. <a href="https://en.wikipedia.org/wiki/Conway%27s_law">You’re passing organizational complexity on to the user</a>. Like features, you can build over-complicated machinery around a simple concept like sharing values. Like features, people will build every part without considering whether they actually need each facet.</p> <p>Generally speaking, if someone wants to implement hundreds or thousands of little features in an application, that’s probably a red flag. <a href="https://daverupert.com/2018/09/if-statements-should-cost-10000/">If-statements are expensive over their lifetime</a>. But from my experience, a good system of tokens inside a cascade of meaningful componentry can make a product resonate with consistency across many surfaces, while providing just enough customizability to differentiate when necessary.</p> Thu, 19 Dec 2024 15:12:00 +0000 https://daverupert.com/2024/12/every-token-is-a-feature/ https://daverupert.com/2024/12/every-token-is-a-feature/ Intermittent fasting <aside> <p>⚠️ Content warning: Weight loss, feel free to skip if that is not a good topic for you.</p> </aside> <p>A doctor told me to look into intermittent fasting. Not for weight loss, but for ADHD. There’s some <a href="https://www.addrc.org/the-role-of-brain-insulin-in-adhd-emerging-evidence/">new data that suggests a link between ADHD and insulin in the brain</a>. Based on that science, intermittent fasting or a ketogenic diet –which can help improve insulin resistance– might help my brain. I’m a week into it and am seeing some weight loss, but it’s hard to tell with the ADHD without measuring my brainflorps per second. I might be more focused, but hunger and “hangry” bring their own distractions.</p> <p>I’m skeptical, to say the least. Intermittent fasting makes frequent appearances in my YouTube shorts with balding Joe Rogan clones dressed in all black selling workout supplements. It has a whiff of being a cure-all. To counter that skepticism, I read a book called <a href="https://amzn.to/4fRPUMt"><em>Life in the Fasting Lane</em></a> co-authored by Dr Jason Fung, who was specifically recommended to me. It’s a mix of doctorly advice and testimonials from advocates who have had success with fasting. As scientific as the book tries to be, it undoes its own credibility pitching intermittent fasting with all the hallmarks of a fad elimination diet:</p> <ul> <li>Lose weight in 30 days</li> <li>Reduce cravings</li> <li>Live longer</li> <li>Reverse diseases</li> <li>Helps you focus at work</li> <li>Improves your sex life</li> <li>Big pharma doesn’t want you to know about this one weird trick!</li> <li>Used by ancient civilizations. Ugh. The appeal to history (ancient, therefore good!) is a major pet peeve of mine.</li> <li>And my least favorite: It doesn’t cure cancer, but it cures obesity, which causes all different kinds of cancer… so we’re not gonna say it cures cancer because that’s a douchebag thing to say, but it <em>doesn’t not</em> cure cancer if you catch our drift (wink).</li> </ul> <p>I do appreciate that the book calls out “Calories-In/Calories-Out” as a myth that works 1% of the time. But it’s hard to shake the feeling that eliminating meals or days worth of food isn’t a macro-version of calories-in/calories-out, where you measure calories in weeks instead of per meal. I suppose the key difference is the duration between meals allows my body to enter ketosis (read: a starving state) which will consume my excess fat stores instead of my morning breakfast tacos adding to those fat stores.</p> <p>To be honest, I’m a good candidate for this fad diet. I can sustain myself on a couple meals a day. I could skip lunch most days. Skipping breakfast though is hard. Not putting creamer in my morning coffee is hard. Not having a little after dinner snack with the kids is hard. Not eating is not my favorite, but I’m going to trust the process for a bit and hopefully it’ll help a weary brain like mine.</p> Wed, 11 Dec 2024 04:10:00 +0000 https://daverupert.com/2024/12/intermittent-fasting/ https://daverupert.com/2024/12/intermittent-fasting/ I got the ADHD, too <p>This month I got my official diagnosis for Adult ADHD. It’s fun to share experiences with <a href="https://bradfrost.com/blog/post/my-adhd-diagnosis-process/">friends</a>. While ADHD presents some new waters to navigate, it isn’t exactly news to me. Thanks to Dr. TikTok, I’ve suspected this outcome for a few years now. It’s nice to have a proper diagnosis though. If I’m struggling to focus or feeling overwhelmed, I know the probable root cause is how my brain processes dopamine and norepinephrine impacting my executive function.</p> <p>There are different flavors of ADHD, so I can only describe my experience:</p> <ul> <li>I crave “optimal stimulation” – 1 task = too little. 3-5 tasks = perfect, ideal. 6+ tasks = uh-oh, all the spinning plates come crashing down.</li> <li>I experience periods of hyperfocus – I often will lock in on an interesting problem and work for hours and forget to eat.</li> <li>Difficulty with tasks when overwhelmed – When overwhelmed (which is always, I have some generalized anxiety too), I’m unable to summon focus for even the smallest of tasks.</li> <li>Sensitivity to messy environments – Related to optimal stimulation, cluttered and messy environments (a common ADHD issue) creates a feeling of overwhelm for me.</li> <li>Sensory-seeking behaviors and fidgeting (classic restless leg syndrome)</li> <li>I don’t have the hyperactive part of ADHD.</li> <li>I’m pretty attentive and a good listener… until I’m not.</li> </ul> <p>I’ve developed a lot of coping and masking strategies over the years that have allowed me to maintain a decent level of productivity. In my 20s I used to manage this by brute force and caffeine. But now that I’m in my 40s with a lot more responsibilities and spinning plates, I feel the reins slipping a bit. To help with this, I’m trying out a non-stimulant sNRI medication that tries to repair that norepinephrine processing. It takes a week or so to fully activate so it’s not an instant fix, and to be honest I don’t quite know what to expect. I’m excited to see if it makes a difference but even if it doesn’t I’m happy to be on a journey.</p> <p>Anyways, cheers to unique brains.</p> Fri, 06 Dec 2024 15:29:00 +0000 https://daverupert.com/2024/12/adhd/ https://daverupert.com/2024/12/adhd/ Goodbye, Moogs <img src="https://cdn.daverupert.com/posts/2024/moogs.jpg" alt="a tuxedo cat with green eyes looking away from the camera" height="900" width="1200"/> <p>The people who found you in the alley called you Cowboy. We called you Moogs, Moogers, Moogerton, Mr Moogs, Meesta, Two Meestas, Beef, Roast Beef, Roast Beefy Weefy, Kitty, Kitty cat, Long cat, Kitty kitty, Pretty kitty, and Meow meow. Those were all your names.</p> <p>Today we had to say goodbye to our cat Moogs (pronounced “Moo” like the cow says + “gs”). He was nearly 19 years old, which is about all you can ask for from a great cat. A senior cat with a thyroid problem – so his passing is not an incredible surprise – but he took a sudden downturn over the weekend. He died in his sleep.</p> <p>My wife adopted him before we were even dating in 2006. I never had a cat, was more of a dog person, and I made it my mission to befriend the cat to win her over. I succeeded in my goal and he let me hold him like a baby. Little did I know he would spend the next 18 years of my life with him sitting on my body for warmth and waking me up at six in the morning.</p> <p>When we lived in LA he would perch majestically on the sills of the open windows basking in the warm sun’s rays because that’s how LA’s perfect weather works. He’d hop in-and-out of the house, hunting, cruising, and getting into tussles with the other alley cats. We paid a lot in vet bills but he had a good life jumping along the craftsman rooftops.</p> <p>He didn’t enjoy moving to Austin, he howled the whole 1400 mile journey and when we got to Austin, he hid himself in the exposed soffit of our mid-remodel kitchen. After two weeks he came out and got used to the new home and got comfortable being an indoor-outdoor cat again. He’d spend days in our neighbor Cleo’s wisteria bushes hunting small birds. He was there when we adopted <a href="https://daverupert.com/2023/04/goodbye-rudy/">our dog Rudy</a> and learned to hold his own against dogs. And he was there when we brought our babies home from the hospital and he learned to tolerate toddlers.</p> <p>When we moved a second time to North Austin, he didn’t like that move either. He quit going outside as much and I think after that his quality of life started to decline. Three years ago, I noticed he was losing weight, felt like a skeleton with fur, and was extra ornery about food. The vet diagnosed him with hyperthyroidism and he needed to be on medication.</p> <p>Moogs was sweet and friendly – well, as friendly as cats can be. When guests came over he would saunter into the room and find the person most allergic to cats and nuzzle them. He had an uncanny talent for that. He was social, but not. He would give an affectionate little headbutt whenever he wanted attention. He’d knead his claws into your thigh when you tried to watch television. And he’d prowl the house at night and wake you up with a butthole to the face. Cats, man. Cats.</p> <p>Moogs was an incredible cat. My first and probably only cat, to be honest. I won’t miss his howls for breakfast each morning, but I will miss the soft brushes against my legs to say hello. He was a part of our family from the beginning, it will be different without him.</p> Tue, 26 Nov 2024 03:08:00 +0000 https://daverupert.com/2024/11/goodbye-moogs/ https://daverupert.com/2024/11/goodbye-moogs/