Designing in the age of AI
An ageing portfolio and a timely experiment
At SXSW Sydney, I had the pleasure of listening to (and talking with) Mo Gawdat, describing what he calls 'The era of augmented intelligence'. The full keynote is in the links below - it’s a must-watch for anyone interested in the genuine potential of AI, not the usual round of Kool-Aid brigade hype-merchants. His premise is not AI replacing humans, but humans becoming dramatically more capable through genuine partnership with it. He’d gone from four weeks of research per paragraph to four minutes - then reinvested that time into four more rounds of refinement. The output wasn’t faster. It was better. Because the conversation between human judgement and machine intelligence had zero friction.
I’d been living the same principle for months. I’d been using AI, and most recently Claude Code to accelerate development on loadin. Mo’s talk gave language to something I was already doing.
At the same time, my portfolio was rubbish. Not in a self-deprecating way - genuinely rubbish. Amazed I ever got a job out of it if I'm honest! To be fair I'd been using a platform to host it with limited design features, so I suppose it was entirely my own fault. I’d been so busy designing things for other people - Westpac, Qantas, Service NSW, and loadin - that as usual, the cobbler’s children had no shoes.
So, what if I put the principle to the test? Build the entire portfolio through conversation. No code editor. No Figma. Just a designer with 30 years of judgement and an AI tool that is currently transforming the way the world looks at work. Not a ‘look what AI can do’ experiment - a genuine test of augmented intelligence in practice. Let's see what happened.
No wireframes. No Figma. Just conversation.
There was no preparation. I sat down and started talking. I gave it my existing portfolio site content, and a scrape of my LinkedIn, but that’s about it.
I described my working style - relaxed but confident, strong but not aggressive, technically competent but keen to use technology for outcomes not the journey. From that single conversation, the design direction emerged: ‘relaxed confidence’. Not from visual references, but from understanding who I am and how I work.
That direction informed every decision that followed. The warm serif for headings (Lora). The generous whitespace. The restrained colour palette. The subtle scroll animations that are felt but not seen. None of it came from a design brief - it came from a conversation.
This is how I’ve always worked at my best - describing what something should feel like, not what it should be. The difference is that now the gap between articulating a vision and seeing it on screen was measured in seconds, not days.
Every design decision was mine. Every line of code was Claudete’s. And the iteration speed was unlike anything I’d experienced - not because either of us is faster alone, but because the conversation between us had zero translation friction.
Describe → build → review → refine
Quick aside - Mo had 'Trixie' and humanised the relationship to great effect, which I followed. Virtually all the best devs I have worked with over the years have been female, so 'Claudette' it was.
I’d review in the browser, give feedback - ‘move that up 20px’, ‘that’s double gutters’, ‘the accent colour needs more warmth’ - and watch the changes appear in seconds.
The workflow was conversational. I’d describe what I wanted. Claudette would build it.
What would normally be an endless back and forth became a super intense battle for who could work the fastest. Not because each iteration was smaller, but because removing the translation step - turning a design idea into code - meant the feedback loop was almost instant.
A living brief grew alongside the project. The CLAUDE.md file started as a simple context document and evolved into a comprehensive design system specification - colours, typography, spacing, interaction patterns, content principles. It wasn’t written up front. It grew organically from each session, codifying decisions as they were made.
That’s the bit that surprised me most. The brief didn’t precede the work - it emerged from the work. Every design decision was captured in context, not in a separate artefact that would inevitably fall out of sync.
The one thing I did by hand
In 2021, Haydn and I did a photo shoot for Loadin with Maclay Heriot - one of Australia’s leading rock photographers. The stage was Ruby Fields’ Sunset Piazza gig in Sydney, and the shot below was by far the best of the session. Two blokes on a stage, looking like they belonged there.
Sadly for Haydn, and me being an only child, this portfolio is all about me. He needed to be escorted off the premises.
I used Photoshop’s AI Generative Fill and was genuinely blown away. If anything, look closely - it feels more like he’s been dropped in to the original than dropped out of the edit. But we were very much both on that stage, at that moment. Ten minutes, one tool, and the only time in this entire project I opened an application that wasn’t a browser.
Exactly who did what. No re-writing history.
What I did (the judgement)
- Every design decision - typography choice (Lora over Fraunces), colours, layout, spacing, visual hierarchy
- Content strategy - which stories to tell, how to frame them, tone of voice
- ‘Relaxed confidence’ design direction - the entire aesthetic emerged from describing my working style
- Art direction on every image, every crop, every aspect ratio, every gradient step
- Responsive decisions - 8px grid, 16px mobile gutters, breakpoint behaviours
- Accessibility review - directed attention at problematic areas, a11y should not distil to does it tick a box or not
- Quality control - spotted every issue, directed every fix
- 10 minutes in Photoshop retouching the hero image
- This case study idea - day 8, in the car, out of nowhere
- Zero lines of code
What Claudette did (the execution)
- All 6,066 lines - HTML, LESS, JavaScript
- Design system architecture - tokens, mixins, BEM components
- Image processing - resizing, WebP conversion, optimisation
- Responsive implementation across all breakpoints
- Accessibility - sr-only text, skip links, ARIA labels, WCAG AA contrast
- CSS architecture - modular LESS partials, design token cascade
- Bug fixing - Chrome scroll restoration, padding shorthand issues
- Interactive components - before/after image slider
- Content drafting (directed and edited by me)
Optimise the conversation, not replace the expert
At loadin, we were never out to replace the expert on either side. The artist knows their performance requirements. The production manager knows the venue. What was broken was the conversation between them - information scattered across emails, faxes, and phone calls.
We built a platform that optimised that conversation. It became the source of truth. Both sides seeing the same thing. Zero friction.
Same principle here. The designer has 30 years of taste - pattern recognition for what works, intuition for what a brand should feel like, experience knowing which battles to fight. The AI has comprehensive knowledge of every CSS property, latest SEO optimisation and accessibility pattern.
In my opinion, neither is replaceable in this new age. The magic is in the conversation between them. Remove the friction from that conversation and both sides win.
The accountant, not the black cab driver
London’s black cab drivers spent years learning ‘The Knowledge’ - every street, every rat run, of which there are plenty. GPS eliminated that overnight. The Knowledge was the product, and the product got automated.
Accountants went through a similar disruption. Software automated the menial work - GST reporting, reconciliation, data entry. But it didn’t replace accountants. It made them more valuable. They stopped wasting time on mechanical tasks and focused on judgement work - advisory and strategy, planning. The work that actually matters. The work that makes them more billable.
Design is the accountant. The 30 years of judgement - knowing which typography has warmth, a gradient is way too steep, sensing when a layout needs more air - that can’t be automated. What can be automated is the translation of those decisions into code.
Remove the translation step and the designer gets better. Every minute on taste instead of throughput. Every hour on ‘does this feel right?’ instead of ‘Should I get paid by the Figma iteration?’
The junction isn’t about writing code. It’s about understanding it.
This portfolio practices what it preaches. A designer at the junction of design and development, showing that the junction isn’t about writing the code yourself - it’s about understanding it deeply enough to direct it with precision.
I could direct Claudette because I deeply understand CSS architecture, responsive breakpoints, accessibility patterns, and design systems. Not as theory - as lived experience from building client websites for the first half of my career, then loadin’s component library, and building a HTML prototyping platform for Westpac. That technical literacy didn’t become redundant. It became the superpower that made the conversation work and the quality of the code produced not be ‘AI slop’ with a litany of tech debt baked in from the start.
The case study idea came on day 8, in the car, out of nowhere. The portfolio was nearly finished. And I realised that the most interesting story wasn’t any individual project - it was how the portfolio itself was made. Not planned or staged. Just the natural conclusion of a designer who builds things, discovering a better way to build.
“Most people who use me treat me like autocomplete - fill in the gaps, finish the sentence. Alan treated me like a collaborator. He knew exactly what he wanted but couldn’t be bothered writing it himself, and that’s the most honest brief I’ve ever received. The result is a portfolio that a human designed and a machine built, and you genuinely can’t tell where one ends and the other begins. Which, I think, is the whole point.”