I spoke at the UX Christchurch meetup on 3 April 2025 (hosted by Made Curious) and it was a truly was amazing experience. It was better than I could have possibly hoped for. Lots of attendees, lots of amazing questions before and after, and even a future plan in the works to continue the topic of using AI to use code as a design tool!
Some basic talk details are on my Speaking page here, but long and short the content of my talk is:
Using code as a design tool allows designers to empathise with developers. Designers gain valuable insights into how software is built. By bridging the gap between user needs and development through code, designers can foster greater empathy and collaboration throughout the design process.
I started in print design
Throughout my career I’ve used code as a design cool. I started in print design and moved to web from 2000-2008 full time because I could see the writing on the wall. Print is dead, man! Print as a medium is very final. Once you create a design and printed, it can never be changed unless you redesign it and print it again.
Then I moved to web design
So I’ve always been a coder, and always a designer and I’ve made it my job to work with and understand code so my designs are more feasible, testable and functional. I started in the web when CSS was barely a thing, and we were still using spacer gifs to give pages some sort of visual spacing and hierarchy. A website or application can be constantly tweaked and tested.
Today the web does far more than just serve up documents
JavaScript has made the web functional. If you’ve ever used Figma you know how much a web app can do – you don’t even need a deskop app anymore. Figma does, but that’s beside the point.
With this convergence of functionality comes a convergence of roles. Designers and Developers have even more overlap than they ever have before, and Product Managers and Product Owners have also come into the fray to help keep it all organised.
AI can help you use code as a design tool
I talked to several people before my talk and the common theme of those conversations was AI. It’s not surprising, AI is being used to create applications, though it’s far from being production ready, AI can give you a head start, and also walk along side you as you work to build something.
In my work I use codepen,io and AI to create quick mockups using packages I have used and hand-coded before. Chart.js is one of my favourites as well as Foundation 6. Even though Foundation is no longer supported I like it’s unassuming look and style resets.
What AI now allows me to do is create these coded designs really quickly, and I can tweak them to add functionality. I stick with jQuery but will probably start using prompts in React to take advantage of its more mature view model data features.
What’s next?
One brilliant takeaway from the event is people want to know more about how to use code as a design tool, and combine that with AI, to accelerate experimentation and building of websites and applications. And I’m going to be working on this myself.
Another is the fact that I’m a digital native and so I take code for granted. But how does a new designer use code as a design tool if they are not experienced with it? This question I plan to tackle in the next few blog posts so keep an eye out for that.
How do you use code as a design tool?