[{"_path":"/work/","path":"/work/","slug":"folder-work","type":"folder","title":"Work","description":"Recent commercial and client work","items":[]},{"_path":"/work/forgd/","path":"/work/forgd/","type":"post","title":"Forgd","description":"Data-driven tools & advisory services for blockchain token launch","summary":"Owned the UI layer at a fast-scaling blockchain token management platform,\nbuilding the core component library from scratch and establishing shared\nsystems for components, charts, forms, and layouts across the entire app.\nPartnered closely with design to translate Figma into reusable primitives,\nand led the migration from a monolithic Nuxt app to a layered architecture\nto support the platform's rapid growth.\n","media":{"thumbnail":"/work/forgd/images/thumbnail.png?width=360&height=203"},"date":"2024-03-01","duration":"18 months","role":"Senior UI Developer","tech":"Nuxt 3, Nuxt UI, Vue 3, TypeScript, Tailwind","tags":["featured","enterprise","webapp","frontend","nuxt","vue","typescript","tailwind","architecture","charts","data","ui"]},{"_path":"/work/metalink/","path":"/work/metalink/","type":"post","title":"Metalink","description":"Web and mobile app to track, manage and discuss NFT collections","summary":"Joined an NFT social platform startup to bring Vue\nexpertise and architectural thinking to a scaling Web3 product. Refactored\nand extended a Vue 3 web app, built real-time portfolio charting, and\ncontributed React Native work, while supporting and mentoring the small\nfrontend team.\n","media":{"thumbnail":"/work/metalink/images/metalink.svg?width=1280&height=720"},"date":"2022-03-01","duration":"18 months","role":"Senior Vue Developer","tech":"Vue 3, Nuxt 3, Tailwind, React Native, Recoil","tags":["featured","webapp","frontend","vue","nuxt","tailwind","ui"]},{"_path":"/work/fgh/","path":"/work/fgh/","type":"post","title":"FGH Lexicon","description":"In-house tooling for global strategic communications consultancy","summary":"Led a multi-phase greenfield build of a bespoke internal tooling suite for\na global PR consultancy, replacing fragmented third-party workflows with a\nunified Nuxt application backed by a custom Express API. Delivered news search,\njournalist contact management, a Chrome extension bridging Roxhill, and\nmedia mentions analytics — spanning full-stack architecture to feature delivery.\n","media":{"thumbnail":"/work/fgh/images/fgh-dark.png?width=1280&height=720"},"date":"2021-10-01","duration":"3 months","status":"unlisted","role":"Full Stack Developer","tech":"Nuxt 2, Vue 2, Express, Elasticsearch, Chrome Extension","tags":["webapp","frontend","backend","elasticsearch","chrome-extension","node","nuxt","vue","api","ui"]},{"_path":"/work/asterisk/","path":"/work/asterisk/","type":"post","title":"Asterisk","description":"Greenfield build of peer to peer securities lending platform","summary":"Led the greenfield frontend build of an enterprise peer-to-peer securities\nlending platform as lead frontend engineer. Architected a modular TypeScript\nVue SPA with real-time negotiation, a custom Handsontable spreadsheet UX,\nand a multi-environment Webpack build. Contributed upstream to Vee Validate\nand developed Vuex Pathify and Alias HQ as by-products.\n","media":{"thumbnail":"/work/asterisk/images/asterisk-logo-trans.svg?width=640&height=360"},"date":"2019-06-01","duration":"15 months","role":"Lead Frontend Developer","tech":"Vue 2, TypeScript, Vuex, Element UI, Handsontable, Auth0, Azure, Webpack","tags":["featured","enterprise","webapp","frontend","api","data","ui","vue","typescript"]},{"_path":"/work/sentiance/","path":"/work/sentiance/","type":"post","title":"Sentiance Journeys","shortTitle":"Sentiance","description":"Development of data visualisation dashboard for data science firm","summary":"Joined a Belgian data science firm remotely to extend their Journeys\nbehavioural analytics dashboard. Built new data visualisation components,\nfixed bugs, and refactored the frontend to a more scalable architecture\ndrawing on prior enterprise experience.\n","media":{"thumbnail":"/work/sentiance/images/sentiance-logo-red.svg?width=640&height=360"},"date":"2019-02-01","duration":"3 months","role":"Senior Frontend Developer","tech":"Vue 2, D3.js, Bulma, GraphQL","tags":["featured","webapp","frontend","api","data","vue","graphql","enterprise","ui"]},{"_path":"/work/clearbank/","path":"/work/clearbank/","type":"post","title":"Clear Bank","description":"Development of internal banking systems and tooling","summary":"Embedded in the frontend team at the UK's first new clearing bank in 250\nyears, building and maintaining internal banking systems in a massive\nmonolithic Vue/TypeScript application. Worked in agile sprints as sole\nfrontend developer per squad, tackling large-scale codebase modularisation,\ndeeply nested data sync, and service architecture patterns.\n","media":{"thumbnail":"/work/clearbank/images/clearbank-logo-light.svg?width=640&height=360"},"date":"2018-03-01","duration":"9 months","role":"Senior Vue Developer","tech":"Vue 2, TypeScript, Vuex, Element UI, Axios, Azure","tags":["featured","enterprise","webapp","frontend","api","ui","vue","typescript"]},{"_path":"/work/fairsquare/","path":"/work/fairsquare/","type":"post","title":"FairSquare","description":"Greenfield build of car finance and sales platform","summary":"Led a small in-house team in the greenfield build of an online car finance\nand sales platform over 9 months, covering UX, frontend, and backend.\nIntegrated multiple financial third-parties, handled soft and hard credit-check\nflows, and navigated regulatory requirements around sensitive credit data.\nThe project's heavy Vuex use directly spawned Vuex Pathify.\n","media":{"thumbnail":"/work/fairsquare/images/fairsquare-logo.svg?width=640&height=360"},"date":"2017-05-01","duration":"9 months","role":"Project Lead","tech":"Vue 2, Vuex, Laravel, Semantic UI, Worldpay","tags":["featured","enterprise","webapp","frontend","backend","database","vue","data","api","ui","laravel"]},{"_path":"/products/","path":"/products/","slug":"folder-products","type":"folder","title":"Products","description":"Digital products, aimed at consumers","items":[]},{"_path":"/products/bluesky-follower-info/","path":"/products/bluesky-follower-info/","type":"post","title":"Bluesky Follower Info","description":"View your followers' profile and stats in your feed to decide who to follow back","summary":"Built a Chrome extension that injects follower profile descriptions and\nengagement stats directly into Bluesky's notification feed, reducing the\nfriction of deciding who to follow back without navigating away from the page.\n","media":{"thumbnail":"/products/bluesky-follower-info/images/bsky-splash.png?width=640&height=360"},"github":"davestewart/bluesky-follower-info","date":"2024-11-27","tech":"JavaScript, Chrome Extension","tags":["productivity","chrome-extension","tools"]},{"_path":"/products/timezone-planner/","path":"/products/timezone-planner/","type":"post","title":"Timezone Planner","shortTitle":"Timezone Planner","description":"Visualise and plan your remote team's availability and meeting times","summary":"Designed and built a Google Sheets-based timezone planner for remote\nteams, dynamically calculating each team member's local time, working\nhours, and current availability throughout the day. Sold as a one-time\npurchase on Gumroad.\n","media":{"thumbnail":"/products/timezone-planner/images/thumbnail.png?width=532&height=300"},"date":"2024-04-24","tech":"Google Sheets, Google Apps Script","tags":["productivity","tools"]},{"_path":"/products/better-fastmail/","path":"/products/better-fastmail/","type":"post","title":"Better FastMail","description":"UX & UI improvements to the FastMail web client","summary":"Built a Chrome extension adding keyboard shortcuts, UI improvements,\nand account-switching ergonomics to the FastMail web client to paper\nover common friction points in daily use.\n","media":{"thumbnail":"/products/better-fastmail/images/better-fastmail.png?width=1280&height=720"},"github":"davestewart/better-fastmail","date":"2022-04-16","tech":"JavaScript, Chrome Extension","tags":["productivity","chrome-extension","tools"]},{"_path":"/products/control-space/","path":"/products/control-space/","type":"post","title":"Control Space","description":"Kanban-style browser tab manager with slick UX and keyboard shortcuts","summary":"A Chrome extension providing a\nKanban-style tab and window manager accessible via a single keyboard\nshortcut. Full keyboard navigation, tab search, window grouping,\nURL copy/drag-drop, and sleep management.\n","media":{"thumbnail":"/products/control-space/images/cs-thumb.png?width=640&height=360"},"date":"2021-03-05","duration":"ongoing","tech":"Vue 3, TypeScript, Chrome Extension","tags":["featured","productivity","chrome-extension","typescript","vue","api","ui"]},{"_path":"/products/workflowy-multiflow/","path":"/products/workflowy-multiflow/","type":"post","title":"WorkFlowy MultiFlow","description":"Multi-column view for WorkFlowy","summary":"A Chrome extension adding a multi-column\nlayout to WorkFlowy for managing and navigating multiple note trees\nsimultaneously. Supports sessions, keyboard navigation, extension\ninterop APIs, and a layout options panel.\n","media":{"thumbnail":"/products/workflowy-multiflow/images/multiflow-thumb-01.svg?width=700&height=394"},"date":"2021-03-01","tech":"JavaScript, Chrome Extension","tags":["featured","productivity","chrome-extension","tools","design"]},{"_path":"/products/great-suspender-recovery-tool/","path":"/products/great-suspender-recovery-tool/","type":"post","title":"The Great Suspender Recovery Tool","shortTitle":"Great Suspender Recovery","description":"Recover your deleted Great Suspender tabs!","summary":"Built and released a Chrome extension in under 12 hours to help users\nrecover tabs lost when The Great Suspender was pulled from the Web Store\nfor containing malware. Searches browser history to find suspended tabs\nand lets users browse, group, and save them as bookmarks.\n","media":{"thumbnail":"/products/great-suspender-recovery-tool/images/tgsrt-thumb.png?width=640&height=360"},"github":"davestewart/great-suspender-recovery-tool","date":"2021-02-01","duration":"~1 day","tech":"JavaScript, Vue 2, Chrome Extension","tags":["javascript","chrome-extension","rapid-build","vue","ui"]},{"_path":"/products/todo-emojis/","path":"/products/todo-emojis/","type":"post","title":"Todo Emojis","description":"Checkbox emojis for todo lists in Slack","summary":"Designed and released a set of checkbox-style SVG emojis for creating\nvisual to-do lists in Slack, originally made for a London indie maker\ncommunity. Picked up on Product Hunt and adopted by teams using Slack\nfor async accountability.\n","media":{"thumbnail":"/products/todo-emojis/images/todo-emojis-logo.svg?width=1280&height=720"},"github":"davestewart/todo-emojis","date":"2020-09-25","tech":"SVG","tags":["featured","creative","productivity","rapid-build","design"]},{"_path":"/products/got-paper/","path":"/products/got-paper/","type":"post","title":"Got Paper","description":"A cheeky app to calculate your toilet paper requirements","summary":"Shipped a viral mobile and desktop app calculating toilet roll\nrequirements during the Covid-19 panic-buying wave.\nReached 150K users in week 1, covered in national and\ninternational press, translated into 12 languages.\n","media":{"thumbnail":"/products/got-paper/images/thumb.png?width=800&height=450"},"github":"davestewart/got-paper","date":"2020-02-01","duration":"1 day","tech":"Vue 2, Nuxt 2, JavaScript","tags":["featured","webapp","mobile","creative","javascript","nuxt","vue","rapid-build","design","ui"]},{"_path":"/projects/","path":"/projects/","slug":"folder-projects","type":"folder","title":"Projects","description":"Technical + creative personal projects","items":[]},{"_path":"/projects/open-source/","path":"/projects/open-source/","slug":"folder-projects-open-source","type":"folder","title":"Open Source","description":"Open Source libraries for JavaScript developers","items":[]},{"_path":"/projects/open-source/phomemo-cli/","path":"/projects/open-source/phomemo-cli/","type":"post","title":"Phomemo CLI","description":"Node CLI, print server and browser client for the Phomemo mini printer","summary":"Enables printing to the Phomemo M02 thermal printer\nvia terminal, REST API, or browser UI. Originally created to power a\nlive QR code printing kiosk at a birthday event, allowing guests to\nattach memory links to a physical interactive timeline poster.\n","media":{"thumbnail":"/projects/open-source/phomemo-cli/images/phomemo-cli-thumbnail.png?width=640&height=360"},"github":"davestewart/phomemo-cli","date":"2024-11-16","tech":"Node, JavaScript, Chrome Extension","tags":["library","tools","node","javascript","chrome-extension"]},{"_path":"/projects/open-source/figma-select-related/","path":"/projects/open-source/figma-select-related/","type":"post","title":"Figma Select Related","description":"Select distantly-related items in complex component trees","summary":"A Figma plugin for selecting structurally related\nitems (cousins) in complex component trees based on their relative position\nin the hierarchy. Offers quick-select buttons and Cmd+/ keyboard command\nshortcuts for rapid component navigation without leaving the canvas.\n","media":{"thumbnail":"/projects/open-source/figma-select-related/images/figma-select-related-thumb.png?width=640&height=360"},"github":"davestewart/figma-select-related","date":"2023-04-29","tech":"TypeScript, Figma Plugin API","tags":["plugin","tools","productivity","typescript","ui"]},{"_path":"/projects/open-source/spaceman/","path":"/projects/open-source/spaceman/","type":"post","title":"Spaceman","description":"Manage monorepo workspaces with a prompt-based CLI","summary":"A prompt-based Node CLI simplifying complex monorepo\nworkspace tasks (install, share, add, remove) for npm, pnpm, and yarn.\nEliminates the need to navigate configs or remember workspace commands\nby wrapping multi-step tasks in guided prompts.\n","media":{"thumbnail":"/projects/open-source/spaceman/images/spaceman-thumb.png?width=1280&height=720"},"github":"davestewart/spaceman","date":"2022-10-01","tech":"Node, TypeScript","tags":["library","tools","node","design"]},{"_path":"/projects/open-source/es-kit/","path":"/projects/open-source/es-kit/","type":"post","title":"ES Kit","description":"A 'pick and mix' library that simplifies writing Elasticsearch code","summary":"A library of typed helper functions abstracting the\nElasticsearch JavaScript client's complex request and response patterns.\nIncludes query builders, API helpers, and script utilities, shipped\nalongside a beginner's guide to reduce the Elasticsearch learning curve.\n","media":{"thumbnail":"/projects/open-source/es-kit/images/es-kit.png?width=1280&height=720"},"github":"davestewart/es-kit","date":"2021-12-01","status":"unlisted","tech":"Node, TypeScript, Elasticsearch","tags":["library","node","elasticsearch"]},{"_path":"/projects/open-source/outliner/","path":"/projects/open-source/outliner/","type":"post","title":"Outliner","description":"Convert SVG strokes to outlined fills as a post-export process","summary":"A Node package automating post-export conversion of SVG\nstrokes to outlined fills. Solves the problem of locking in stroke edits\nin authoring tools like Figma and Sketch by running as a file watcher or\nproject dependency that converts icons cleanly for the browser environment.\n","media":{"thumbnail":"/projects/open-source/outliner/images/outliner-thumb.png?width=640&height=360"},"github":"davestewart/outliner","date":"2021-09-01","tech":"Node, JavaScript, SVG, Maker.js","tags":["featured","library","tools","node","icons"]},{"_path":"/projects/open-source/alias-hq/","path":"/projects/open-source/alias-hq/","type":"post","title":"Alias HQ","description":"The end-to-end solution for migrating to and using path aliases","summary":"A Node CLI that simplifies setting up and using TypeScript/\nJavaScript path aliases across a project. Piggybacks on tsconfig.json and\nprovides one-liner integrations for Webpack, Jest, and other tools, plus\nautomated source code conversion from relative to aliased paths.\n","media":{"thumbnail":"/projects/open-source/alias-hq/images/alias-thumbnail.png?width=640&height=360"},"github":"davestewart/alias-hq","date":"2020-08-01","tech":"Node, TypeScript, Webpack, Jest","tags":["featured","library","tools","node","design"]},{"_path":"/projects/open-source/axios-actions/","path":"/projects/open-source/axios-actions/","type":"post","title":"Axios Actions","description":"Bundle endpoints as callable, reusable services","summary":"Moves API calls out of Vuex into\nself-contained, locally-configurable service objects. Born from experience\nat ClearBank with a massive Vue/Vuex app, it decouples API interaction\nfrom global store boilerplate and reduces coupling in components.\n","media":{"thumbnail":"/projects/open-source/axios-actions/images/axios-actions.svg?width=1280&height=720"},"github":"davestewart/axios-actions","date":"2018-07-01","tech":"JavaScript, Axios, Vue 2, Vuex","tags":["library","javascript","state","architecture"]},{"_path":"/projects/open-source/state-machine/","path":"/projects/open-source/state-machine/","type":"post","title":"State Machine","description":"A powerful yet simply-configured JavaScript finite-state machine","summary":"Built a standalone finite state machine library with an intuitive DSL\nfor describing states and transitions, a rich event system for hooking\ninto lifecycle events, and helpers for jQuery, Angular, and Vue. An\nearly investigation into state machines for complex application flows.\n","media":{"thumbnail":"/projects/open-source/state-machine/images/state-machine-thumb.png?width=720&height=403"},"github":"davestewart/javascript-state-machine","date":"2016-10-01","tech":"JavaScript, TypeScript","tags":["featured","library","javascript","state"]},{"_path":"/projects/vue/","path":"/projects/vue/","slug":"folder-projects-vue","type":"folder","title":"Vue and Nuxt","description":"Packages and plugins for Vue and Nuxt","items":[]},{"_path":"/projects/vue/nuxt-layers-utils/","path":"/projects/vue/nuxt-layers-utils/","type":"post","title":"Nuxt Layers Utils","description":"Simplify and consolidate Nuxt layers paths' configuration","summary":"A utility package providing a clean API for\ngenerating Nuxt layer configurations including extends, path aliases,\nauto-imports, and content sources. Removes the verbosity and repetition\nof manually configuring complex multi-layer Nuxt projects.\n","media":{"thumbnail":"/projects/vue/nuxt-layers-utils/images/nuxt-layers-utils-thumb.png?width=360&height=203"},"github":"davestewart/nuxt-layers-utils","date":"2024-05-09","tech":"Nuxt 3, TypeScript","tags":["library","architecture","nuxt","typescript"]},{"_path":"/projects/vue/nuxt-content-assets/","path":"/projects/vue/nuxt-content-assets/","type":"post","title":"Nuxt Content Assets","description":"Enable locally-located assets in Nuxt Content","summary":"A Nuxt module enabling co-location of images\nand media alongside markdown content files with relative path references.\nResolves and serves assets at build time, with file watching, image size\ninjection, and zero-config.\n","media":{"thumbnail":"/projects/vue/nuxt-content-assets/images/nuxt-content-assets.png?width=960&height=540"},"github":"davestewart/nuxt-content-assets","date":"2023-04-14","tech":"Nuxt 2-3, TypeScript","tags":["featured","library","nuxt","vue"]},{"_path":"/projects/vue/nuxt-areas/","path":"/projects/vue/nuxt-areas/","type":"post","title":"Nuxt Areas","description":"Scalable folder management for large Nuxt 2 projects","summary":"A Nuxt 2 module bringing layers-like enabling feature-first \"areas\"\narchitecture — co-locating components, pages, and stores by domain rather\nthan file type. Provides dynamic routing, store and component\nregistration, and area path aliases.\n","media":{"thumbnail":"/projects/vue/nuxt-areas/images/nuxt-areas.png?width=1280&height=720"},"github":"davestewart/nuxt-areas","date":"2021-11-01","tech":"Nuxt 2, JavaScript, Webpack, Node","tags":["library","architecture","nuxt","vue","javascript","node","webpack"]},{"_path":"/projects/vue/vue-class-store/","path":"/projects/vue/vue-class-store/","type":"post","title":"Vue Class Store","description":"Universal Vue stores you write once and use anywhere","summary":"A universal store decorator enabling native class\nsyntax to power reactive Vue state. Converts class properties, getters,\nand methods to reactive data, computed properties, and watches with \ninheritance and debugging.\n","media":{"thumbnail":"/projects/vue/vue-class-store/images/vue-class-store.svg?width=1280&height=720"},"github":"davestewart/vue-class-store","date":"2020-05-01","tech":"Vue 2, Vue 3, TypeScript","tags":["featured","library","javascript","typescript","vue","state","architecture","design"]},{"_path":"/projects/vue/vuex-pathify/","path":"/projects/vue/vuex-pathify/","type":"post","title":"Vuex Pathify","description":"Vue / Vuex plugin providing a unified path syntax to Vuex stores","summary":"A Vue/Vuex plugin introducing a unified path syntax\nfor store access and component wiring. Reduces Vuex's 4 operations, 4\nhelpers, and 3 accessor syntaxes to 4 methods and one path format,\nachieving 2–14x line-of-code reductions in real-world codebases.\n","media":{"thumbnail":"/projects/vue/vuex-pathify/images/vuex-pathify.svg?width=1280&height=720"},"github":"davestewart/vuex-pathify","date":"2017-07-01","tech":"Vue 2, Vuex, JavaScript","tags":["library","javascript","vue","state","architecture","design"]},{"_path":"/projects/browser-extensions/","path":"/projects/browser-extensions/","slug":"folder-projects-browser-extensions","type":"folder","title":"Browser Extension Tooling","description":"Packages and plugins for browser extension development","items":[]},{"_path":"/projects/browser-extensions/wxt-module-layers/","path":"/projects/browser-extensions/wxt-module-layers/","type":"post","title":"WXT Layers","description":"Nuxt-like layers functionality for WXT browser extensions","summary":"A WXT module bringing Nuxt-style layer architecture\nto browser extension development. Enables organising extensions into\nself-contained feature and service layers, improving maintainability\nand code isolation in large extension projects.\n","media":{"thumbnail":"/projects/browser-extensions/wxt-module-layers/images/wxt-layers-thumb.png?width=640&height=360"},"github":"davestewart/wxt-module-layers","date":"2025-11-28","tech":"TypeScript, WXT","tags":["library","typescript","chrome-extension","architecture","tools"]},{"_path":"/projects/browser-extensions/wxt-module-pages/","path":"/projects/browser-extensions/wxt-module-pages/","type":"post","title":"WXT Pages","description":"File-system based routing for WXT browser extensions","summary":"A WXT module bringing file-system based routing to browser\nextensions, inspired by Next.js, Nuxt, and SvelteKit. Supports layouts,\ndynamic routes, route groups, and multiple frontend frameworks, eliminating\nmanual route configuration in large extension projects.\n","media":{"thumbnail":"/projects/browser-extensions/wxt-module-pages/images/wxt-pages-thumb.png?width=640&height=360"},"github":"davestewart/wxt-module-pages","date":"2025-11-28","tech":"TypeScript, Vue, WXT","tags":["library","typescript","chrome-extension","architecture"]},{"_path":"/projects/browser-extensions/extension-bus/","path":"/projects/browser-extensions/extension-bus/","type":"post","title":"Extension Bus","description":"Universal message bus for web extensions","summary":"A TypeScript library providing cross-process messaging\nfor web extensions with an API-like interface. Supports named buses, nested\nhandlers, transparent async/sync handling, and a consistent call interface\nacross extension processes, tabs, and external callers.\n","media":{"thumbnail":"/projects/browser-extensions/extension-bus/images/extension-bus-thumb.png?width=640&height=360"},"github":"davestewart/extension-bus","date":"2024-01-10","tech":"TypeScript, Chrome Extension","tags":["library","typescript","chrome-extension","api","architecture"]},{"_path":"/projects/personal/","path":"/projects/personal/","slug":"folder-projects-personal","type":"folder","title":"Personal","description":"Personal development and creative endeavours","items":[]},{"_path":"/projects/personal/dave-stewart/","path":"/projects/personal/dave-stewart/","type":"post","title":"Dave Stewart","description":"2026 Nuxt build of davestewart.co.uk","summary":"Personal portfolio site built on Nuxt 4, featuring swappable themes via\nNuxt layers, centralised content metadata, client-side search, and\ncustom subdomain showcase / CV generation.\n","media":{"thumbnail":"/projects/personal/dave-stewart/images/thumbnail.png?width=640&height=360"},"github":"davestewart/davestewart-site","date":"2026-02-26","status":"new","tech":"Nuxt 4, Vue 3, TypeScript, Nuxt Content, Tailwind","tags":["webapp","website","frontend","nuxt","vue","ui","data","creative"]},{"_path":"/projects/personal/birthday-timeline/","path":"/projects/personal/birthday-timeline/","type":"post","title":"Birthday Timeline Poster","description":"Birthday retrospective where guests share memories via QR code","summary":"Designed a birthday interactive timeline poster and built the supporting\nkiosk tooling — a Node CLI, web print server, and Chrome extension — to\nlet guests print QR code stickers linking to personal memories at a live\nparty event. Designed the A1 poster artwork in Figma.\n","media":{"thumbnail":"/projects/personal/birthday-timeline/images/timeline-thumb.png?width=640&height=360"},"date":"2024-11-03","tech":"Node, JavaScript, Chrome Extension, Figma","tags":["chrome-extension","javascript","experiment","creative"]},{"_path":"/projects/personal/likely-logic/","path":"/projects/personal/likely-logic/","type":"post","title":"Likely Logic","description":"Holding page for my product development moniker","summary":"A holding page for the commercial product development moniker, used for\nside projects and indie products.\n","media":{"thumbnail":"/projects/personal/likely-logic/images/likely-logic.svg?width=1280&height=720"},"date":"2021-01-01","tech":"HTML, CSS","tags":["website","design"]},{"_path":"/projects/personal/branding/","path":"/projects/personal/branding/","type":"post","title":"Branding Experiment","description":"Branding experiment with overlays and colour mapping","summary":"Explored branding concepts for Control Space using overlapping rectangle\ndesigns with opacity and blend modes, translating from Sketch to Photoshop\nfor colour palette work and into After Effects for a 3D Colorama-driven\nanimation experiment mapping greyscale to brand colours.\n","media":{"thumbnail":"/projects/personal/branding/images/featured.png?width=722&height=406"},"date":"2020-04-01","tech":"Sketch, Photoshop, After Effects","tags":["featured","creative","animation","design"]},{"_path":"/blog/","path":"/blog/","slug":"folder-blog","type":"folder","title":"Blog","description":"Insights, opinions, musings...","items":[]},{"_path":"/blog/work/","path":"/blog/work/","slug":"folder-blog-work","type":"folder","title":"Work","description":"Thoughts and realisations on the business of software development","items":[]},{"_path":"/blog/work/hackathon-guide/","path":"/blog/hackathon-guide/","type":"post","title":"Guide to nailing your next hackathon","description":"An intro to hackathons and how to get the most out of them","summary":"Actionable advice for getting the most out of hackathons — covering\npreparation, team dynamics, time management, and how to approach building\nand presenting within tight constraints.\n","media":{"thumbnail":"/blog/work/hackathon-guide/images/thumbnail.jpg?width=640&height=360"},"date":"2023-05-10"},{"_path":"/blog/work/project-estimation/","path":"/blog/the-work-is-never-just-the-work/","type":"post","title":"The work is never just “the work”","description":"A deep dive on why projects always take longer and a framework to improve future estimation","summary":"A deep dive into why software projects consistently take longer than\nestimated, introducing a framework for mapping hidden work — briefing,\nsetup, research, invisible tasks, and client changes — to improve\nfuture estimates.\n","media":{"thumbnail":"/blog/work/project-estimation/images/estimation-thumbnail.png?width=600&height=338"},"date":"2022-02-01","tags":["featured"]},{"_path":"/blog/work/app-diary/","path":"/blog/app-diary/","type":"post","title":"Diary of a Rapid Application Build","description":"Development diary and reflection on building a Trello clone from scratch","summary":"Development diary documenting the rapid build of a Trello-like application\nfrom scratch, reflecting on the planning, technical decisions, and learnings\nfrom building a non-trivial product at speed.\n","media":{"thumbnail":"/blog/work/app-diary/images/app-diary-thumbnail-02.png?width=640&height=360"},"github":"davestewart/app-diary","date":"2018-02-01","tags":["website","frontend","creative","vue","rapid-build"]},{"_path":"/blog/productivity/","path":"/blog/productivity/","slug":"folder-blog-productivity","type":"folder","title":"Productivity","description":"Everything I know so far about staying productive and getting more done","items":[]},{"_path":"/blog/productivity/mind-shifts-and-wins/","path":"/blog/mind-shifts-and-wins/","type":"post","title":"On mindsets, mind shifts and wins","description":"A 10-year (ish) retrospective of self-reflection and improvement","summary":"A 10-year retrospective of personal self-improvement wins across mindset,\nenvironment, organisation, and habits — written as a scan-friendly reference\nof actionable shifts that have had lasting impact.\n","media":{"thumbnail":"/blog/productivity/mind-shifts-and-wins/mindset.png?width=1280&height=720"},"date":"2023-02-22","tags":["featured"]},{"_path":"/blog/productivity/workflowy-inboxes/","path":"/blog/workflowy-inboxes/","type":"post","title":"WorkFlowy \"Inboxes\"","description":"A WorkFlowy organisational strategy for when you've multiple projects and lots of ideas","summary":"A WorkFlowy organisational strategy called \"Inboxes\" — using per-project\ncapture lists accessible from a single main view — to keep ideas organised\nwithout losing context when jumping between multiple active projects.\n","media":{"thumbnail":"/blog/productivity/workflowy-inboxes/workflowy-inboxes-thumb.png?width=640&height=360"},"date":"2023-02-04"},{"_path":"/blog/productivity/rocks-pebbles-sand/","path":"/blog/rocks-pebbles-sand/","type":"post","title":"Why rocks, pebbles, sand is a productivity trap","description":"Doing the big stuff first can set you up for failure; here's how you should structure your day instead","summary":"Reframes the rocks-pebbles-sand productivity metaphor by inverting it —\narguing that clearing small tasks first removes cognitive overhead and\nsets up flow, rather than always leading with the \"big stuff.\"\n","media":{"thumbnail":"/blog/productivity/rocks-pebbles-sand/images/rock-pebbles-sand.png?width=1024&height=512"},"date":"2021-08-11"},{"_path":"/blog/nuxt/","path":"/blog/nuxt/","slug":"folder-blog-nuxt","type":"folder","title":"Nuxt","description":"Deep dives about Nuxt and the Vue ecosystem","items":[]},{"_path":"/blog/nuxt/nuxt-data-fetching/","path":"/blog/nuxt-data-fetching/","type":"post","title":"Data fetching in Nuxt","description":"Nuxt data fetching explained within the context of Nuxt's SSR lifecycle","summary":"Explains Nuxt's SSR render lifecycle and how it affects data fetching,\nthen walks through $fetch, useAsyncData, and useFetch — covering the\nserver-client serialisation boundary, rehydration, and when to use\neach approach.\n","media":{"thumbnail":"/blog/nuxt/nuxt-data-fetching/thumb.png?width=360&height=203"},"date":"2025-11-05","tags":["nuxt","vue","data"]},{"_path":"/blog/nuxt/nuxt-data-fetching/cookbook/","path":"/blog/nuxt-data-fetching/cookbook/","type":"post","title":"Nuxt Data Fetching Cookbook","shortTitle":"Data Fetching Cookbook","description":"A cookbook of Nuxt data fetching patterns and best practices","summary":"Companion cookbook to the Nuxt data fetching article, providing extended\ncode examples and patterns for $fetch, useAsyncData, and useFetch drawn\nfrom the Nuxt 4 docs, reorganised for easier browsing and consumption.\n","media":{"thumbnail":"/blog/nuxt/nuxt-data-fetching/thumb.png?width=360&height=203"},"date":"2025-11-05","status":"unlisted","tags":["nuxt","data"]},{"_path":"/blog/nuxt/nuxt-auto-import/","path":"/blog/nuxt-auto-import/","type":"post","title":"Getting a grip on Nuxt's auto-import functionality","description":"Understanding when to use and when to avoid the auto-import magic","summary":"Digs into Nuxt 3's auto-import system to explain when it helps and when\nit hurts — covering IDE integration, file discoverability, and practical\nworkarounds for the cases where the magic becomes a liability.\n","media":{"thumbnail":"/blog/nuxt/nuxt-auto-import/images/thumbnail.png?width=360&height=203"},"date":"2024-05-21","tags":["nuxt","vue","typescript","architecture"]},{"_path":"/blog/nuxt/nuxt-layers/","path":"/blog/nuxt-layers/","type":"post","title":"Modular site architecture with Nuxt layers","description":"Build sites that scale by organising code by domain, not concern","summary":"Practical guide to using Nuxt layers for domain-based code organisation,\ncovering the theory of organising by domain vs concern, a step-by-step\nmigration path for existing Nuxt apps, and path configuration gotchas.\n","media":{"thumbnail":"/blog/nuxt/nuxt-layers/images/thumb.png?width=360&height=203"},"date":"2024-05-14","tags":["featured","nuxt","vue","architecture"]},{"_path":"/blog/programming/","path":"/blog/programming/","slug":"folder-blog-programming","type":"folder","title":"Programming","description":"Programming concepts explained in plain English with understandable examples","items":[]},{"_path":"/blog/programming/how-ai-writes-code/","path":"/blog/how-ai-writes-code/","type":"post","title":"How do AIs code as well as they do?","description":"Claude AI explains in its own words how it writes such good code","summary":"A candid conversation with Claude AI about how AI models write code\nso effectively — covering pattern matching, probability distributions,\nand training data, and how understanding this process helps developers\ncollaborate with AI more productively.\n","media":{"thumbnail":"/blog/programming/how-ai-writes-code/ai-code-thumbnail.png?width=360&height=203"},"date":"2024-11-09","tags":["featured"]},{"_path":"/blog/programming/extension-versioning/","path":"/blog/extension-versioning/","type":"post","title":"Versioning and releasing larger Chrome extensions","description":"An approach to plan and implement a robust versioning scheme and release schedule – without Semver","summary":"Retrospective on developing a robust versioning and release scheme for\nChrome extensions, working around the limitations of Chrome's manifest\nversion format to support alpha/beta stages — drawing on experience\nbuilding Control Space.\n","media":{"thumbnail":"/blog/programming/extension-versioning/versioning-thumb.png?width=360&height=203"},"date":"2023-08-09"},{"_path":"/blog/programming/msal-vue/","path":"/blog/msal-vue/","type":"post","title":"A guide to MSAL authentication in Vue","description":"Architect a Vue JS app secured with Microsoft Authentication Library","summary":"Guide to integrating Microsoft Authentication Library (MSAL) in a Vue\napplication, cataloguing common gotchas and sharing a modular demo\ncovering tenant setup, redirect handling, and auth flow architecture.\n","media":{"thumbnail":"/blog/programming/msal-vue/msal-thumbnail.png?width=1280&height=720"},"date":"2023-02-28","tags":["featured"]},{"_path":"/blog/programming/type-safe-json/","path":"/blog/type-safe-json/","type":"post","title":"7 code-style variations for strongly-typed JSON","description":"Destructure raw JSON whilst automatically adding type information","summary":"Explores 7 code-style variations for adding TypeScript type information\nto raw JSON at the point of destructuring, demonstrating how flexible\nTypeScript's compiler can be around assignment, wrapping, and nested\ndestructuring patterns.\n","media":{"thumbnail":"/blog/programming/type-safe-json/thumbnail.png?width=1280&height=720"},"date":"2021-11-01"},{"_path":"/blog/software/","path":"/blog/software/","slug":"folder-blog-software","type":"folder","title":"Software","description":"Tips and hacks for software I use every day","items":[]},{"_path":"/blog/software/webstorm-features/","path":"/blog/webstorm-features/","type":"post","title":"WebStorm Power User Manual","description":"The WebStorm features and tools I use everyday to write better code and build bigger apps","summary":"Companion post to a JetBrains webinar, covering the WebStorm features\nused daily for writing better code and building larger applications —\nfrom refactoring and file navigation to project-wide search and tooling.\n","media":{"thumbnail":"/blog/software/webstorm-features/webstorm-splash.png?width=1280&height=720"},"date":"2022-04-22"},{"_path":"/blog/software/webstorm-shortcuts/","path":"/blog/webstorm-shortcuts/","type":"post","title":"WebStorm shortcuts for lightning productivity","description":"Essential WebStorm keyboard shortcuts to make you the most productive developer in the office","summary":"Reference guide of 75+ essential WebStorm keyboard shortcuts across\nnavigation, editing, refactoring, and tooling — including customised\nbindings for high-frequency operations.\n","media":{"thumbnail":"/blog/software/webstorm-shortcuts/webstorm-splash.png?width=1280&height=720"},"date":"2022-04-21"},{"_path":"/blog/software/mac-finder-tips/","path":"/blog/mac-finder-tips/","type":"post","title":"25 Finder tips & tactics to speed up your workflow","description":"A treasure trove of solid strategies and hidden gems to wrangle those windows and fly through folders","summary":"A roundup of 25 Finder strategies and hidden features for speeding up\nfile navigation and window management on macOS, covering keyboard\nshortcuts, view modes, and lesser-known capabilities.\n","media":{"thumbnail":"/blog/software/mac-finder-tips/mac-finder.svg?width=79&height=44"},"date":"2022-02-01"},{"_path":"/blog/software/workflowy-styling/","path":"/blog/workflowy-styling/","type":"post","title":"Hacking WorkFlowy formatting with Stylish","description":"Use a well-known Chrome extension to add new functionality via custom CSS styles","summary":"Demonstrates how to add custom text formatting to WorkFlowy using the\nStylish Chrome extension and CSS, by targeting WorkFlowy's contentEditable\nHTML structure and repurposing the underline tag as a styling hook.\n","media":{"thumbnail":"/blog/software/workflowy-styling/workflowy-highlight-thumb.png?width=800&height=450"},"date":"2021-06-01"},{"_path":"/blog/thoughts/","path":"/blog/thoughts/","slug":"folder-blog-thoughts","type":"folder","title":"Thoughts","description":"Random musings","items":[]},{"_path":"/blog/thoughts/keto-and-fasting/","path":"/blog/keto-and-fasting/","type":"post","title":"My ketogenic diet and intermittent fasting journey","description":"Everything I learned in 3 months of sticking to a keto and fasting regime","summary":"Personal account of a 3-month keto and intermittent fasting experiment\nin 2023, covering the journey, learnings, and indirect benefits — written\nin scan-friendly note form as a practical reference for others considering\nthe same.\n","media":{"thumbnail":"/blog/thoughts/keto-and-fasting/laksa-thumb.jpg?width=520&height=311"},"date":"2023-05-11"},{"_path":"/blog/thoughts/nail-biting/","path":"/blog/nail-biting/","type":"post","title":"How I stopped biting my nails","description":"How I stopped biting my nails and learned to respect my hands","summary":"Personal account of stopping a long-term nail-biting habit overnight,\nsharing the mindset shift that made it stick and stay gone.\n","media":{"thumbnail":"/blog/thoughts/nail-biting/nails-splash.png?width=840&height=472"},"date":"2022-04-26"},{"_path":"/blog/thoughts/twosdays-hidden-symmetry/","path":"/blog/twosdays-hidden-symmetry/","type":"post","title":"Twosday's hidden analogue symmetry","description":"22:22 is palindromic and ambigramic, but what about its analogue form?","summary":"Explores the analogue clock symmetry hidden in 22:22 on 22/02/2022,\nbuilding on the palindromic and ambigramic properties of the \"Twosday\"\ndate with a mathematical perspective on the clock face.\n","media":{"thumbnail":"/blog/thoughts/twosdays-hidden-symmetry/images/twosday.png?width=1200&height=675"},"date":"2022-02-23","tags":["featured"]},{"_path":"/blog/thoughts/the-wrong-kind-of-democracy/","path":"/blog/the-wrong-kind-of-democracy/","type":"post","title":"The wrong kind of democracy?","description":"A comparison of the 2015 election results with FPTP vs PR","summary":"A data-driven comparison of the 2015 UK election results under First Past\nthe Post vs proportional representation, examining just how differently the\noutcome would have looked under each voting system.\n","media":{"thumbnail":"/blog/thoughts/the-wrong-kind-of-democracy/images/election-thumb.png?width=742&height=417"},"date":"2015-05-10"},{"_path":"/blog/thoughts/the-shard-finished/","path":"/blog/the-shard-finished/","type":"post","title":"The Shard, finished","description":"Ever thought The Shard looks like they forgot to finish it off? See how it could have looked if they had...","summary":"Tongue-in-cheek Photoshop experiment imagining The Shard finished with\na conventional pyramid top — contrasting the original \"unfinished-looking\"\ndesign with a more traditional pointed alternative.\n","media":{"thumbnail":"/blog/thoughts/the-shard-finished/images/shard-thumbnail.jpg?width=800&height=450"},"date":"2013-11-08"},{"_path":"/archive/","path":"/archive/","slug":"folder-archive","type":"folder","title":"Archive","description":"The best older work","items":[]},{"_path":"/archive/work/","path":"/archive/work/","slug":"folder-archive-work","type":"folder","title":"Work","description":"Older commercial work","items":[]},{"_path":"/archive/work/flash/","path":"/archive/work/flash/","slug":"folder-archive-work-flash","type":"folder","title":"Flash","description":"Flash websites","items":[]},{"_path":"/archive/work/flash/mixoff/","path":"/archive/work/flash/mixoff/","type":"post","title":"TalkTalk/X Factor - Mix Off","shortTitle":"X Factor Mix Off","description":"Flash application allowing users to star in their own pop music videos","summary":"A Flash application for the X Factor Mix Off campaign, allowing users\nto insert themselves into pop music video clips via webcam capture and\nvideo compositing — a UGC-driven interactive experience.\n","media":{"thumbnail":"/archive/work/flash/mixoff/images/mixoff-featured.png?width=260&height=260"},"date":"2014-10-21","tech":"Flash, ActionScript 3","tags":["flash","frontend","as3","ui","api","video","ugc"]},{"_path":"/archive/work/flash/world-chess/","path":"/archive/work/flash/world-chess/","type":"post","title":"World Chess: ChessCasting","shortTitle":"World Chess","description":"Interactive prototype for broadcast chess","summary":"An interactive Flash prototype for a broadcast chess format, visualising\nlive game data and providing a real-time view of match progress for a\nTV concept pitch.\n","media":{"thumbnail":"/archive/work/flash/world-chess/images/world-chess-logo.png?width=450&height=450"},"date":"2012-08-05","tech":"Flash, ActionScript 3","tags":["flash","frontend","data","api","as3","technical","concept"]},{"_path":"/archive/work/flash/map-my-summer/","path":"/archive/work/flash/map-my-summer/","type":"post","title":"YouTube: Map My Summer","shortTitle":"Map My Summer","description":"Flash micro-site with heavy use of mapping and video APIs","summary":"An award-winning Flash micro-site integrating map clustering, video, and\nuser-generated content for a social summer campaign — combining mapping,\nvideo, and social APIs to create a shareable interactive experience.\n","media":{"thumbnail":"/archive/work/flash/map-my-summer/images/map-my-summer-fwa-square.jpg?width=400&height=400"},"date":"2011-02-05","tech":"Flash, ActionScript 3, Google Maps API","tags":["flash","frontend","data","api","ui","as3","animation","technical","mashup","award","social","video","maps","ugc"]},{"_path":"/archive/work/flash/lost-angel/","path":"/archive/work/flash/lost-angel/","type":"post","title":"Lost Angel: Flash microsite","shortTitle":"Lost Angel","description":"Immersive Flash micro-site for one of London's leading destination bars","summary":"A richly animated Flash micro-site for one of London's destination bars,\nfeaturing immersive 3D-rendered environments, animated scene transitions,\nand ActionScript 3 interactivity.\n","media":{"thumbnail":"/archive/work/flash/lost-angel/images/lost-angel-thumb.png?width=260&height=260"},"date":"2009-08-05","tech":"Flash, ActionScript 3, After Effects, 3dsmax","tags":["flash","frontend","animation","creative","technical","3d","as3","after-effects","3dsmax"]},{"_path":"/archive/work/flash/sony-talkman/","path":"/archive/work/flash/sony-talkman/","type":"post","title":"Sony: Talkman PSP Microsite","shortTitle":"Talkman PSP","description":"Multilingual Flash micro-site for Sony PSP translation game / software","summary":"A multilingual Flash micro-site and interactive game for Sony's PSP\nTalkman translation software, featuring language selection, guided tours,\nworld map exploration, and arcade-style mini-games.\n","media":{"thumbnail":"/archive/work/flash/sony-talkman/thumbs/wallpaper-square.jpg?width=520&height=520"},"date":"2006-05-05","tech":"Flash, ActionScript 3","tags":["flash","game","data","3d","animation","technical","as3","video","ugc"]},{"_path":"/archive/work/flash/tokyo-drift/","path":"/archive/work/flash/tokyo-drift/","type":"post","title":"Universal: Fast & Furious Game","shortTitle":"Fast & Furious","description":"Flash racing game for Tokyo Drift official film site","summary":"A Flash racing game for the official Fast & Furious: Tokyo Drift film\nsite, featuring multiple tracks with physics-based driving mechanics\nand ActionScript 3 gameplay.\n","media":{"thumbnail":"/archive/work/flash/tokyo-drift/images/tokyo-drift-thumb-square.jpg?width=520&height=520"},"date":"2006-02-08","tech":"Flash, ActionScript 3","tags":["flash","frontend","game","physics","technical","as3"]},{"_path":"/archive/work/html/","path":"/archive/work/html/","slug":"folder-archive-work-html","type":"folder","title":"HTML","description":"HTML websites","items":[]},{"_path":"/archive/work/html/timeslice-live/","path":"/archive/work/html/timeslice-live/","type":"post","title":"Timeslice Live","description":"Kiosk and online system for live event multi-camera photo studio","summary":"A kiosk and online delivery system for a multi-camera live event photo\nstudio (Timeslice), built with Vue and Laravel to manage real-time photo\ncapture, iPad display, and online order delivery.\n","media":{"thumbnail":"/archive/work/html/timeslice-live/images/timeslice-feature-01.png?width=260&height=260"},"date":"2015-04-01","tech":"Vue 2, Laravel, PHP","tags":["webapp","ui","vue","database","laravel","php","ipad"]},{"_path":"/archive/work/html/g4s/","path":"/archive/work/html/g4s/","type":"post","title":"G4S: \"How it Works\" Animation","shortTitle":"G4S \"How it Works\"","description":"Cross-device HTML5 story-style animation","summary":"A cross-device HTML5 animated explainer for G4S, using a story-style\nscrolling format to walk through how their services work across multiple\nanimated scenes.\n","media":{"thumbnail":"/archive/work/html/g4s/images/g4s-feature.png?width=260&height=260"},"date":"2014-08-01","tech":"HTML5, JavaScript, CSS3","tags":["frontend","javascript","animation","html"]},{"_path":"/archive/work/html/rise-as-one/","path":"/archive/work/html/rise-as-one/","type":"post","title":"Budweiser: Rise As One","shortTitle":"Rise As One","description":"Front end development for Rise as One World Cup campaign","summary":"Front end development for Budweiser's \"Rise as One\" FIFA World Cup 2014\ncampaign, featuring video integration and a responsive HTML5 experience\nacross multiple devices.\n","media":{"thumbnail":"/archive/work/html/rise-as-one/images/budweiser-feature.png?width=260&height=260"},"date":"2014-06-12","tech":"HTML5, JavaScript, CSS","tags":["webapp","html","responsive","javascript","video"]},{"_path":"/archive/work/html/f1/","path":"/archive/work/html/f1/","type":"post","title":"F1: Global Broadcast Report","shortTitle":"F1 Broadcast Report","description":"SPA for data-driven end-of-year report for Formula One","summary":"A data-driven SPA for Formula One's end-of-year broadcast report,\npresenting season statistics through interactive SVG charts and\nvisualisations — optimised for iPad display.\n","media":{"thumbnail":"/archive/work/html/f1/images/f1-feature-02.jpg?width=260&height=260"},"date":"2013-01-05","tech":"JavaScript, HTML5, SVG","tags":["concept","website","frontend","html","javascript","api","data","charts","technical","ipad","svg"]},{"_path":"/archive/work/html/cyber-city/","path":"/archive/work/html/cyber-city/","type":"post","title":"e-skills Cyber City","description":"Creative and technical development for 12-14 year old e-learning project","summary":"An award-winning HTML5 e-learning game for 12–14 year olds, combining\ninteractive storytelling with educational content about internet safety\nand digital literacy — featuring original character design and game mechanics.\n","media":{"thumbnail":"/archive/work/html/cyber-city/images/cyber-city-feature-02.png?width=260&height=259"},"date":"2012-09-05","tech":"HTML5, JavaScript, CSS3","tags":["frontend","html","javascript","game","technical","award","concept"]},{"_path":"/archive/work/html/nineteen/","path":"/archive/work/html/nineteen/","type":"post","title":"19: Microsite","shortTitle":"19 Microsite","description":"Landing page for Simon Fuller's 19 Entertainment stable","summary":"A responsive microsite for Simon Fuller's 19 Entertainment management\ncompany, showcasing the artist roster with an interactive, visually-driven\nUI — an early responsive web build.\n","media":{"thumbnail":"/archive/work/html/nineteen/images/nineteen-thumb.jpg?width=520&height=520"},"date":"2009-02-05","tech":"HTML, JavaScript, CSS","tags":["frontend","html","ui","responsive","javascript","technical","concept","webapp"]},{"_path":"/archive/work/animation/","path":"/archive/work/animation/","slug":"folder-archive-work-animation","type":"folder","title":"Animation","description":"3dsmax and After Effects animation","items":[]},{"_path":"/archive/work/animation/showreel/","path":"/archive/work/animation/showreel/","type":"post","title":"Animation Showreel","description":"My final showreel from my animation days","summary":"The final animation showreel from the animation phase of the career,\nfeaturing broadcast work for Sky One, Channel 5, London Smile Clinic,\nand others — a retrospective of motion graphics and 3D work circa 2007.\n","media":{"thumbnail":"/archive/work/animation/showreel/images/showreel.png?width=512&height=288"},"date":"2007-12-01","tech":"After Effects, 3dsmax, Flash","tags":["creative","flash","3d","after-effects","3dsmax","concept"]},{"_path":"/archive/work/animation/disney-channel/","path":"/archive/work/animation/disney-channel/","type":"post","title":"Disney Channel: Halloween","shortTitle":"Disney Channel Halloween","description":"2D and 3D animation mixed to create a spooky Halloween ident","summary":"A mixed 2D and 3D Halloween TV ident for Disney Channel, combining\n3dsmax-generated 3D environments with After Effects compositing to\ncreate a spooky animated sequence.\n","media":{"thumbnail":"/archive/work/animation/disney-channel/images/disney-channel.jpg?width=580&height=326"},"date":"2007-09-08","tech":"After Effects, 3dsmax","tags":["creative","data","animation","3d","after-effects","technical","plugin","3dsmax","concept"]},{"_path":"/archive/work/animation/jetix/","path":"/archive/work/animation/jetix/","type":"post","title":"Jetix: \"My Jetix\" promo","description":"Highly-scripted 3D animation sequence","summary":"A heavily scripted 3D animation sequence for the Jetix children's TV\nnetwork, driven by MaxScript automation in 3dsmax to produce a complex,\nprecisely-timed broadcast-quality result.\n","media":{"thumbnail":"/archive/work/animation/jetix/images/jetix-thumbnail.jpg?width=580&height=326"},"date":"2006-10-08","status":"unlisted","tech":"3dsmax, After Effects, MaxScript","tags":["creative","animation","3d","after-effects","technical","plugin","3dsmax","concept"]},{"_path":"/archive/work/animation/mozart-uncovered/","path":"/archive/work/animation/mozart-uncovered/","type":"post","title":"BBC4: Mozart Uncovered","shortTitle":"BBC4 Mozart Uncovered","description":"Visual exploration of the structure and ideas of Mozart's symphonies","summary":"A data-driven visual exploration of Mozart's symphonies for BBC4,\nusing VBA to extract musical structure data and After Effects to\nanimate the resulting patterns and relationships.\n","media":{"thumbnail":"/archive/work/animation/mozart-uncovered/images/mozart-02.jpg?width=1024&height=576"},"date":"2005-06-08","tech":"After Effects, VBA, JavaScript","tags":["javascript","data","after-effects","technical","mashup","vba"]},{"_path":"/archive/work/animation/nocturnal-groove-visuals/","path":"/archive/work/animation/nocturnal-groove-visuals/","type":"post","title":"Nocturnal Groove: Visuals","shortTitle":"Nocturnal Groove Visuals","description":"Club and festival visuals for chart-toppers Shapeshifter","summary":"Club night visuals created in After Effects for Nocturnal Records\n(home of Shapeshifter), designed for projection at London's AKA/The End\nvenue for their monthly Nocturnal Groove night.\n","media":{"thumbnail":"/archive/work/animation/nocturnal-groove-visuals/images/nocturnal-groove.png?width=404&height=227"},"date":"2005-05-08","tech":"After Effects","tags":["creative","animation","after-effects","concept"]},{"_path":"/archive/work/animation/so-you-think-youre-safe/","path":"/archive/work/animation/so-you-think-youre-safe/","type":"post","title":"Sky One: So You Think You're Safe?","shortTitle":"So You Think You're Safe?","description":"Fun title animation about the hidden dangers of everyday situations","summary":"An animated title sequence for Sky One's \"So You Think You're Safe?\"\nexploring the hidden dangers of everyday life, using 3dsmax for 3D\nelements composited in After Effects.\n","media":{"thumbnail":"/archive/work/animation/so-you-think-youre-safe/images/safe-thumb.jpg?width=640&height=352"},"date":"2004-10-01","tech":"After Effects, 3dsmax","tags":["creative","animation","after-effects","3dsmax"]},{"_path":"/archive/work/animation/truth-about-love/","path":"/archive/work/animation/truth-about-love/","type":"post","title":"The Truth About Love","description":"Film titles for mid-naughties rom-com starring Jenifer Love Hewitt","summary":"Film title sequence for \"The Truth About Love\" theatrical rom-com, combining\n3D elements from 3dsmax with After Effects compositing — seen on the big\nscreen in the UK release.\n","media":{"thumbnail":"/archive/work/animation/truth-about-love/images/truth-about-love.png?width=640&height=350"},"date":"2004-09-01","tech":"After Effects, 3dsmax","tags":["creative","animation","after-effects","3dsmax"]},{"_path":"/archive/projects/","path":"/archive/projects/","slug":"folder-archive-projects","type":"folder","title":"Projects","description":"Previous side projects","items":[]},{"_path":"/archive/projects/personal/","path":"/archive/projects/personal/","slug":"folder-archive-projects-personal","type":"folder","title":"Personal projects","description":"Apps, experiments and investigations","items":[]},{"_path":"/archive/projects/personal/balham-night/","path":"/archive/projects/personal/balham-night/","type":"post","title":"Balham Night","description":"Social networking & mapping experiment","summary":"A social networking and location mapping experiment aggregating\nuser-generated content onto an interactive map for local community events,\nbuilt with PHP and JavaScript before social platforms commoditised the idea.\n","media":{"thumbnail":"/archive/projects/personal/balham-night/images/balham-night.png?width=260&height=260"},"date":"2007-04-05","tech":"JavaScript, PHP, HTML, Google Maps API","tags":["frontend","backend","creative","html","php","javascript","data","api","technical","mashup","social","concept","maps"]},{"_path":"/archive/projects/personal/open-source-map/","path":"/archive/projects/personal/open-source-map/","type":"post","title":"Open Source Project Map","description":"Tube map inspired exploration of my personal and open source projects","summary":"A London Tube Map-inspired visual diagram mapping the progression and\nrelationships between personal and open source projects over time,\ndesigned to show context and connection that a list of links cannot.\n","media":{"thumbnail":"/archive/projects/personal/open-source-map/images/dave-stewart-open-source-projects-2013-tn.png?width=260&height=260"},"date":"2013-09-24","tags":["creative","maps"]},{"_path":"/archive/projects/personal/mashifesto/","path":"/archive/projects/personal/mashifesto/","type":"post","title":"Mashifesto","description":"Twitter mash-up, winning 3rd place at the Digital Sizzle Art Hack 2013","summary":"A Twitter mashup that won 3rd place at the Digital Sizzle Art Hack 2013,\nbuilt rapidly to remix and collage user-generated content from the\nsocial platform into a real-time interactive experience.\n","media":{"thumbnail":"/archive/projects/personal/mashifesto/images/mashifesto_thumb.jpg?width=435&height=435"},"date":"2013-08-12","tech":"JavaScript, HTML, Twitter API","tags":["webapp","frontend","html","javascript","data","api","technical","mashup","rapid-build","award"]},{"_path":"/archive/projects/personal/bill-bunny/","path":"/archive/projects/personal/bill-bunny/","type":"post","title":"Bill Bunny","description":"Bill management application for flat sharers","summary":"A web application for managing shared household bills between flat sharers,\ncovering expense tracking, splitting, and payment history.\n","media":{"thumbnail":"/archive/projects/personal/bill-bunny/images/bill-bunny.png?width=385&height=385"},"date":"2012-02-05","tech":"JavaScript, PHP, HTML","tags":["frontend","backend","creative","html","php","technical","social","concept","ui"]},{"_path":"/archive/projects/personal/futureclock/","path":"/archive/projects/personal/futureclock/","type":"post","title":"future::clock","description":"Experiment in time and visual numerical/temporal-patterns","summary":"A Flash experiment in visual time representation, built on 11/11/11 at\n11:11 — exploring numerical and temporal patterns through unconventional,\naesthetically-driven clock visualisations.\n","media":{"thumbnail":"/archive/projects/personal/futureclock/images/clock-featured.png?width=260&height=260"},"date":"2011-11-11","tech":"Flash, ActionScript 3","tags":["creative","frontend","flash","technical","as3","concept"]},{"_path":"/archive/projects/personal/angry-tennis-birds/","path":"/archive/projects/personal/angry-tennis-birds/","type":"post","title":"Angry Tennis Birds","description":"Creative hack to spice up broadcast tennis to the squawks of Angry Birds","summary":"A creative JavaScript hack synchronising Angry Birds sound effects with\nlive broadcast tennis footage, built as a viral mashup concept and\nfeatured in The Sun.\n","media":{"thumbnail":"/archive/projects/personal/angry-tennis-birds/images/angry-tennis-birds.png?width=260&height=260"},"date":"2011-06-05","tech":"JavaScript","tags":["creative","javascript","game","api","technical","mashup","concept"]},{"_path":"/archive/projects/tools/","path":"/archive/projects/tools/","slug":"folder-archive-projects-tools","type":"folder","title":"Tools & frameworks","description":"Larger, self-contained tools, mainly for developers","items":[]},{"_path":"/archive/projects/tools/laravel-sketchpad/","path":"/archive/projects/tools/laravel-sketchpad/","type":"post","title":"Laravel Sketchpad","description":"Browser-based development playground for your Laravel site","summary":"A browser-based development playground that generates an automatic\nfrontend for Laravel controllers, enabling rapid iteration on backend\ncode and scripts without leaving the browser.\n","media":{"thumbnail":"/archive/projects/tools/laravel-sketchpad/images/sketchpad-thumb.png?width=740&height=416"},"date":"2017-04-01","tech":"PHP, Laravel, JavaScript","tags":["frontend","backend","framework","tools","ui","php","laravel","plugin"]},{"_path":"/archive/projects/tools/double-o/","path":"/archive/projects/tools/double-o/","type":"post","title":"Double-O","description":"MVC theme framework for Wordpress","summary":"An MVC theme framework for WordPress introducing clean separation of\nconcerns, object models, template hierarchies, and lifecycle management\ninto WordPress theme development.\n","media":{"thumbnail":"/archive/projects/tools/double-o/images/double-o_thumb.png?width=640&height=360"},"date":"2013-08-12","tech":"PHP, WordPress","tags":["backend","framework","plugin","php","api","technical"]},{"_path":"/archive/projects/tools/processr/","path":"/archive/projects/tools/processr/","type":"post","title":"Processr","description":"Online editor to manipulate and generate text, code and data","summary":"An online text processing tool for manipulating and generating text,\ncode, and data using a configurable pipeline of transforms — an early\nexploration of browser-based developer tooling.\n","media":{"thumbnail":"/archive/projects/tools/processr/thumbs/processr-thumb.jpg?width=580&height=326"},"date":"2013-04-05","tech":"JavaScript, PHP","tags":["frontend","javascript","ui","framework","parsing","technical","backend"]},{"_path":"/archive/projects/tools/pocket-god-tools/","path":"/archive/projects/tools/pocket-god-tools/","type":"post","title":"Pocket God Tools","description":"Level editing toolkit for iOS game Pocket God, created with xJSFL","summary":"A level editing toolkit for the iOS game Pocket God, built with xJSFL\nto streamline the production pipeline for Bolt Creative — automating\nlevel creation and asset management within the Flash authoring environment.\n","media":{"thumbnail":"/archive/projects/tools/pocket-god-tools/images/pocket-god-thumb.png?width=284&height=160"},"date":"2012-07-09","tech":"Flash, ActionScript 3, JSFL","tags":["frontend","javascript","flash","as3","jsfl","ui"]},{"_path":"/archive/projects/tools/xjsfl/","path":"/archive/projects/tools/xjsfl/","type":"post","title":"xJSFL","description":"JSFL framework to create tools for the Flash authoring environment","summary":"A comprehensive JSFL framework for building tools within the Flash\nauthoring environment, providing MVC-like structure, utility libraries,\nand a plugin system — used by Flash animators and developers to automate\nproduction pipelines.\n","media":{"thumbnail":"/archive/projects/tools/xjsfl/images/xjsfl-logo-wide.png?width=360&height=203"},"github":"davestewart/xjsfl","date":"2011-01-01","tech":"Flash, JSFL, ActionScript 3, JavaScript","tags":["frontend","framework","plugin","javascript","flash","api","data","jsfl","concept","creative","parsing","technical","ui"]},{"_path":"/archive/projects/open-source/","path":"/archive/projects/open-source/","slug":"folder-archive-projects-open-source","type":"folder","title":"Open Source","description":"Ongoing Open Source releases for various software packages","items":[]},{"_path":"/archive/projects/open-source/plugins/","path":"/archive/projects/open-source/plugins/","type":"post","title":"Web framework plugins","description":"A wide variety of plugins for various JS and PHP frameworks","summary":"A range of plugins and extensions for various JavaScript and PHP frameworks,\nwritten before specialising in Vue.js — covering UI components, data handling,\nand framework integrations across the pre-Vue JS ecosystem.\n","media":{"thumbnail":"/archive/projects/open-source/plugins/plugins.png?width=1280&height=720"},"date":"2009-01-01","tech":"JavaScript, jQuery, PHP, Vanilla, GreenSock, Kohana, WordPress","tags":["plugin","framework","javascript","php","ui"]},{"_path":"/archive/projects/open-source/applications/","path":"/archive/projects/open-source/applications/","type":"post","title":"Application Extensions","description":"Various extensions for native Windows applications","summary":"A collection of extensions for native Windows applications, exploring\napplication extensibility beyond web frameworks using JavaScript and VBA.\n","media":{"thumbnail":"/archive/projects/open-source/applications/applications.png?width=1280&height=720"},"date":"2005-01-01","tech":"JavaScript, VBA","tags":["plugin","framework","javascript","design","vba","ui"]},{"_path":"/archive/projects/open-source/3dsmax/","path":"/archive/projects/open-source/3dsmax/","type":"post","title":"3dsmax plugins","description":"An extensive collection of plugins and scripts for 3dsmax","summary":"A collection of MaxScripts written over 8 years for Autodesk 3dsmax,\nshared with the 3dsmax community — covering UI tools, workflow automation,\nand production pipeline plugins for animators and VFX artists.\n","media":{"thumbnail":"/archive/projects/open-source/3dsmax/3dsmax.png?width=1280&height=720"},"date":"2001-01-01","tech":"MaxScript, 3dsmax","tags":["3dsmax","plugin","framework","creative","ui"]}]