I’ve got a lot of Work in Progress knocking around at the moment - and WIP is something I don’t like. So Q4 is shipping time, and this is what I’m planning to get out:

Simple CIS

Shipping by: Mid-November

This is the AP automation tool I built as an internal tool for Project XI originally. It continues to deliver a lot of value to the business - the mantra is “less paperwork, more profit”. I’m actively working on the SaaS version of this at the moment, it’s serving as the guinea pig for a Rails + Hyperkit app, and it’s going well.

PlanAtom v2

Shipping by: End of 2024

PlanAtom sparked a lot of initial interest with some decent commitments early on - but I’ve let it fall by the wayside. We only deal with payment on account for billing; I’ve never built out the SaaS infrastructure to make it self-serve.

By the end of the year I want to ship v2: a revamped UI, moving to vector search for more natural searching, more ability to cut across the hierachy of application ➔ applicant ➔ developer, and a self-serve onboarding flow.

(.*)planning.co.uk

Shipping by: End of 2024

Cheshire East Planning - the site I designed and built to showcase PlanAtom is actually taking off in it’s own right. It’s yielding > 5k uniques from Google already, on the back of pure, organic SEO. No hacks, just good markup and performance and a growing site map.

The average session is > 3 minutes too - so there’s clearly a lot of value in applying better design to planning announcements. It’s time to deliver the same value for all local authorities.

More Hyperkit

Shipping: Constantly

I’m actively using Hyperkit in my day-to-day development, and it’s working well. As I spot an opportunity to capture a new element, or enhance an existing one, it’s getting added.

I’ve been working on Hyperkit over the past fortnight, and the first release is now live on npm. It’s a collection of headless custom elements/web components designed to simplify building rich UIs with serverside frameworks like Rails or Revel.

It’s more like Headless UI than Shoelace: you bring your own styling.

Here’s an example of a styled sortable list:

<hyperkit-sortable class="bg-white rounded shadow-md w-64 overflow-hidden">
  <hyperkit-sortable-item class="flex items-center justify-between pr-4 pl-3 py-2 border-b border-b-zinc-200 data-[before]:border-t-2 data-[before]:border-t-blue-400 data-[after]:border-b-2 data-[after]:border-b-blue-400 text-zinc-800">
    <hyperkit-sortable-handle>
      <button class="cursor-move mr-2 text-zinc-400 select-none font-black px-1">&#8942;</button>
    </hyperkit-sortable-handle>
    <span class="text-xs font-medium flex-grow">Item 1</span>
  </hyperkit-sortable-item>
  <hyperkit-sortable-item class="flex items-center justify-between pr-4 pl-3 py-2 border-b border-b-zinc-200 data-[before]:border-t-2 data-[before]:border-t-blue-400 data-[after]:border-b-2 data-[after]:border-b-blue-400 text-zinc-800">
    <hyperkit-sortable-handle>
      <button class="cursor-move mr-2 text-zinc-400 select-none font-black px-1">&#8942;</button>
    </hyperkit-sortable-handle>
    <span class="text-xs font-medium flex-grow">Item 2</span>
  </hyperkit-sortable-item>
</hyperkit-sortable>

The pull of React, for me, has always been the clarity and DX that comes with colocating a component’s behaviour with it’s markup and styling. It makes a complex front-end way more intuitive/easy to reason with. The counterpart in Rails is Stimulus, which comparatively feels disconnected - relying on magic incantations of data attributes to apply behaviour. There’s a lack of traceability with Stimulus.

But for situations like a stylable select, or click to copy component, I don’t want to be reaching for React. Thus, Hyperkit - custom elements for UX patterns like sortable lists, repeating fieldsets and even calendars. Because Hyperkit uses custom elements, they’re just plain HTML tags, with all the behaviour encapsulated in the tag. No need to write a line of Javascript.

And if you use it with Phlex, you can build end-to-end frontends in pure ruby 🤌

I’ve had to integrate a few legacy APIs recently; some with SDKs that lack type definition, like the Atriusmaps Node SDK. I’ve fallen into a pattern of using tools like Zod and Valibot to parse the incoming data, for two reasons:

• It gives me a type-safe object to play with - so I get all the typescript benefits like auto-completion, checking etc.
• It flags any data that’s shaped unexpectedly with a nice, clear exception - so I don’t end up having to step through Cannot read properties of undefined errors.
• It’s easier to reason with a Zod schema than the equivalent, manual type definition.

I’ve also found that GPT does a very good job of generating Zod schemas from Jbuilder views, so adding type safety to a Rails API request is a doddle. Will definitely be leaning into this pattern more and more.

I’ve been working on some embedded touch screen projects recently, SPAs built with React. A requirement recently came up to enable D-Pad navigation of the UI - with the entire functionality of the app needing to be accessible.

Making features designed for the capabilities of a full-blown touch screen fully accessible with a 5 button controller isn’t exactly trivial, especially with complex components like dropdowns and a virtual keyboard in the mix.

I ended up undertaking some R&D to come up with a solution. Based on convention, a “virtual cursor” seemed to be the best solution - making every element of the UI accessible without any additional design consideration. I’m sure it’ll have some further utility, so I’ve wrapped it up as a React hook. It’s headless, so you can style the cursor however you like.

It’s currently quite specific in scope: designed for non-scrolling, full screen kiosk apps; there are a couple of clear enhancements that I’ve already identified. I think overtime this could prove to be a great accessibility option for these sorts of kiosk implementations.

Check it out: @hyperlaunch/use-virtual-cursor

Bit of an overdue “year in review” - but better late than never.

2023 was a very weird year.

• On the back of “Trussonomics”, I spent a lot of time naviagating choppy waters with my property portfolio - we got to a stable place, but it was stressful
• I did my first ever (brief) stint on payroll with a startup, and learned a lot along the way
• Coming out of that, I jumped straight into developing the world’s first integration with the Sphere for u2
• I launched Decimal - a binaural beats player that now boasts an average user session time of 46 minutes
• Developed a bunch of tools for Project XI - leaning heavily into generative AI and discovering totally unexpected capabilities
• We spun the first of those out as PlanAtom
• I managed to sneak a really fun PoC with my friends at MusicAlly in before the end of the year - using RAG techniques to deliver a generative chat experience based on their 20+ years of content
• I really let my fitness drop in the last quarter. I do a lot of walking and that keeps a certain baseline, but fell very short on strength training, and did next to no fighting

2024:

• Getting back to my happy level of fitness; lot’s of HIIT, fighting, climbing and hiking
• I want to really up my Jujitsu/grappling skills this year
• Building work on our house should be finished next month - and I look forward to home not being a building site for the first time
• I want to formalise my consultancy offering; I love working with startups in that capacity, specifically the constant exposure to new projects that it brings - I need to get my messaging down and do more concentrated prospecting
• At the same time, I want to start to shift the majority of my income away from project work and towards license revenue; my main skill to hone this year is growth and marketing - I can build, now I need to sell

I’m very excited to share the public availability of PlanAtom. This is a product that I originally spiked as an internal sales tool within XI, but has since grown into a full blown commercial service.

The premise is quite simple: aggregate planning applications and identify the ones which fit with our service, then reach out to the applicants with a view to being the first builder they engage with. There’s a huge range of use cases for this across the construction ecosystem - from commercial lenders, to materials suppliers, to service providers like building regs.

Tech wise, the data aggregation is wrapped up in a Rails app. It uses GPT to parse very “soapy” planning application descriptions into structured data which can then be filtered and queried. The frontend, as ever, is built with Astro and leans heavily on Tailwind UI. I’m still actively developing the customer control panel, using Turso and Lucia.

Very excited to be shipping this - it’s the first flag in the ground for Project XI as a tech enabled business, and showcases the extent of what we’re working on.

I haven’t done this for a while, but this week has had a few interesting occurrences (by my standards).

• With the Space Baby out in the wild, it was nice to get some attention from the Astro and Turso communities.
• I was privileged to spend some time in conversation with Glauber on the back of that – he’s an impressive guy and super committed to making Turso the best platform possible. Really excited about Turso’s future!
• Discord is where the best announcements happen now.
• I gave Hyperlaunch a much needed rebrand, to match the realignment in offering and to tie in with some announcements.
• I made two pre-sales on my first SaaS spin-out from Project XI… We’ve been aggregating planning applications for a while now. We use them to target outreach for lead generation. I decided to put out a demo site based on the data, and ended up with two pre-sales on the back of it. One’s to a bank that has previously financed property acquisitions for us; the other is an organisation that I’ve previously consulted for. Goes to show that relationships really do compound.

I’ve been doing a lot of building over the past month, and I’m really enjoying the feedback loop as it kicks in while I start to bring more of it online.

It’s been a while since I shipped a client project with Hyperlaunch, so I’m super excited to release the new Space Baby app for U2. I’m even more excited to be able to say that I’m the first developer in the world to develop an app integration with The Sphere.

What is it?

It’s a companion app for U2’s residence at the Sphere. Whenever U2 content is playing on the “exosphere”, the app goes into “broadcast mode”, allowing fans to tune in and listen to the audio accompaniment. This includes the Space Baby speaking, so I had a fair bit of technical wrangling to make sure it’s millisecond accurate - essentially pre-downloading the entire clip and then seeking to the right point, to avoid latency issues with streaming.

Outside of broadcasts, there’s an ambient soundtrack produced by Brian Eno.

When a broadcast starts, we recieve a notification from the Sphere’s internal tooling to update the currently playing clip - and my stack then pushes a socket to all active users to update the state in real time.

Built with…

• Astro for build
• Pusher for web sockets
• Mux for streaming the ambient soundtrack
• Turso for persisting the Sphere notifications
• React and Tailwind for UI
• Vercel for CI and infra

You can read the full case-study over at Hyperlaunch.

It’s been a while since I indulged in a pure piece of R&D, and the list of tools I’ve been keen to play with has grown pretty lengthy. I finally managed to carve out a week to get down to some serious experimentation and the result is Decimal, a free Binaural Beats generator delivered as a PWA.

I’ve been using Binaural Beats ever since I heard about them in the Huberman Lab episode on concentration, Focus Toolkit: Tools to Improve Your Focus & Concentration. I’ll add that I’ve also found them incredibly effective as a sleep aid.

While the concept works for me, the existing apps are generally pretty poor; ad-laden and lacking in terms of UX. With Decimal, I wanted to deliver an app that users can love, without the ad and tracking bloat that comes with so many apps. My main goals were:

• Exceptional speed and performance
• Joyful to use - nicer than any existing apps
• No invasive ads or tracking

I hope I’ve achieved all three. The end result is what I’ve started to refer to as a toy; it’s fun to use, singular in purpose and has no intention of delivering any commercial outcomes. A true “small web” project.

Tech wise, the app is built with Astro, with some React islands peppered throughout - for interactive components like the player controls. I dropped in Million.js because… well why not?

The biggest epiphany for me was using Nanostores to share state between disparate React components - like the main player and persisted mini player in the header. Nanostores make this super easy, and the resulting code is far clearer than the eqivalent would be with a Provider/Context hook. I’ll definitely be using this approach in future.

The tones themselves are generated with the Web Audio API, so you can switch from the suggested presets to entirely custom frequencies. As part of my three goals above - I was eager to get lock screen controls functional on mobile. The Media Session API, however, doesn’t have any awareness of Web Audio instances, so I resorted to a hack: playing a looping mp3 of silence, and then binding to the Media Session callbacks for that <audio /> to control the Web Audio output.

All of this is made feasible with Astro’s <ViewTransitions />. I can just append transition:persist to any component to have it persist in the client between page navigations - so there’s no loss of audio playback etc as you navigate around. You get some fantastic transitions too - with no implementation overhead.

Astro is increasingly looking like a framework/build tool I can go all in on; the life cycle is super intuitive and ability to drop in piecemeal UI framework components is incredible. The default 💯 page speed scores are pretty compelling, and because the app compiles to static and generates the audio entirely in the client, it costs next to nothing to run.

Tech aside, I’ve also done some experimentation with using GPT 4 and DALLE-3 to generate blog posts that I hope will deliver some educational and actionable information for new comers to binaural beats. I really struggle to pen that sort of content myself, so this was a novel way to overcome a writer’s block; hopefully some craftmanship at the the prompt level pays off in the output. These posts will be rolling out on the blog over the next couple of months.

Well, that was reasonably easy. The new View Transitions API made Swup redundant and added a nicer transition. The move to astro:assets felt like a bit of a step down, with losing the <Picture /> component. And requiring manual installation of Sharp when deploying to Vercel.

Overall it was about 10 minutes work though - and really cemented Astro as the choice for this sort of web project.

I’ve been involved in a construction SME for a couple of years now, and I’ve been consistently shocked by the administrative burden that HMRC impose on general contractors like us. Regulation like reverse VAT and CIS ultimately shift liability for our subcontractors taxation onto us, while the industry remains woefully under-educated in the consequences of not complying.

To save hours of paperwork a week, I developed a small app for managing our subcontractor “Accounts Payable”. It collects all the necessary information about the subbies trading style, makes it effortless for them to submit invoices in a standardised format, calculates CIS deductions and reversed VAT, and gives a real-time view of our liabilities.

We’re getting requests from every subcontractor to make the tool available to them for use in their own business, so from September I’m going to be focussing on spinning this out as a commercial SaaS and growing it from there. It feels like we’re very close to Produt-Market-Fit already… “Build something people want”.

I’ve been caught up in a lot of chat about async vs sync for development teams lately. I’m clearly not the only one.

I skew heavily towards eradicating scheduled/recurring calls, but I’ve noticed a tendency to interpret that as being “anti-conversation”. This really isn’t the case - face-to-face, or voice-to-voice, conversation is by far the fastest way to traverse an intellectual space. Notion docs, slack threads, etc all create friction to reaching a conclusion.

Scheduled calls and meetings, to me, represent dogma. But for complex topics, purposeful, ad hoc conversations with a defined goal can’t be beaten.

People talk about stand-ups and and other rituals as a means of socialising and bonding - but I, personally, bond far better over a pairing session than a “what I did / what I’m doing” round-robin.

• Bobby told me about Good Job yesterday, a really nice, low dependency worker implementation for Rails. Will be using.
• I’ve been thinking about teams as springs: you can put a certain amount of pressure on them and they’ll keep springing back, but if you keep pushing and keep sustaining that pressure, you’ll reach a point where there’s no spring left. Then you don’t have a spring anymore.
• On the teams note, I’ve been watching Last Chance U. Coming from a sporting background, I find it super interesting that tech teams are rarely run like sports teams, or kitchens for that matter. Why is there no brigade for delivering apps?
• I made a very small investment in Twine last year; their AI offering is really taking off at the moment, and it’s getting very exciting. Being able to source bespoke, diverse training data at scale is going to become incredibly valuable.

• I’ve been spending some evenings getting re-acquainted with Rails; being reminded that ActiveRecord is a super power, and remains the quickest way to get a form validated and persisting to a database. It’s nice to be back to building features, instead of configuring build tools.
• ViewComponents are a new one for me, but they’re ace and will be a pre-requisite for any new projects.
• I didn’t have ChatGPT last time I was learning a new language or framework - it’s a game changer for quickly acclimatising and understanding.
• I’ve been using TS-Pattern in anger; it’s one of those “wish I had this sooner” libraries.
• It’s been a week, and my fitness goals for this month have slipped severely. I’m digging out a new pond this weekend though, which should turn that around.
• I’ve been focussing heavily on “the clinch” with my boxing coach and think I might be getting the urge to learn BJJ with some focus.

• For the first time in my adult life, I took a bonafide job role at the beginning of this year. I’ve subsequently learned how much I value entrepreneurship and building for myself, and so will be returning back to the world of venture building in September.
• This comment on HN really resonated with me, because it captures a lot of lived experience. Domain understanding and clarity of vision are what drives productivity, not coding prowess.
• I’m very bullish on Bun, and it’s awesome to see that Fly.io is too. Bun is the closest thing to a native TS runtime, and I think it could be the runtime of the next truely RAD stack.
• On that note, I ran rails new for the first time in five years. The React & Node ecosystems of late have left me craving an environment based on consistency and consensus.

• I’ve finally had a chance to dabble with Bun, and I think it might be the nicest way to work with Typescript. No config, no boilerplate - just run it. If you’re just building for the Bun runtime, you don’t even need to Transpile…
• This tweet highlighted an issue I’ve come up with a few times; Next.js middleware is ineffective in standalone builds. This made me realise how much I miss the power of before_action in Rails. Middleware seems like the logical equivalent, but it’s just not there yet.
• Lucia is an auth library I can finally get behind; it’s primitive but ergonomic and malleable - very easy to work with.
• On that note, I noticed support for Astro. shadcn/ui also shipped Astro support this week - is Astro becoming a serious option for app development?
• I’ve been watching Season 2 of the Bear; it’s one of my favourite shows. The kitchen seems true to life, and certainly tracks with the depictions in Kitchen Confidential. I think there’s a huge amount that startup/tech teams can learn from functional kitchens.

Per week:

2× posts here 3× HIIT/weights workouts 1+ climbing session 1+ (kick)boxing session < 2 glasses of wine

Per day:

100 pushups 100 v-situps 15k+ steps (weighted vest) < 50g carbs

Projects:

Go live with Myrtal alpha

Giving the blogging thing another go. Super simple stack - but hopefully that means I’ll keep it updated:

• Astro for dev/build
• MDX for content
• Swup for client side page transitions
• Tailwind for styling (with @tailwdindcss/typography)
• Space Grotesk for display, Poppins for body
• Deployed to Vercel
• As always, photo of me by Rachel Carney

I’ll definitely refine the design over time, but let’s see how well I do at keeping this thing up-to-date for now…