April 11, 2023

Our adventures in AI

AI, GPT, Dall-e, Midjourney! It's everywhere these days. Like a persistent mosquito on a summer's evening.

AI, GPT, Dall-e, Midjourney! It's everywhere these days.

Like a persistent mosquito on a summer's evening.

People are both intrigued and terrified by it. Do I need it for my job? Will it take their job? Will it lead to a world overrun by paper clips?

“You won't lose your job to AI; you'll lose your job to someone who knows how to use AI.”

You have probably seen this in your LinkedIn or Twitter feed

While it may not be entirely true in every case, we think it is directionally correct

This felt like a good topic for our first design rave of 2023.

The theme: How might we use AI in our design process?

We can’t answer that question until we roll up our sleeves and start experimenting. That's why we've set ourselves a challenge: to use AI tools to create something in 2 hours that might have traditionally taken us a week.

We split into teams and tasked ourselves with exploring how to use ChatGPT and MidJourney to storyboard and AI for interface design, branding, and advertising. Finally, we'll have a pow-wow to discuss how we can integrate these tools into our workflows. It's time to get our hands dirty and see what AI can really do!

I will walk through an example of what we did and what was produced by one of the teams.

Session 1 - Using Chat CPT and MidJourney to storyboard

I will publish a more detailed step-by-step approach to storyboarding with ChatGPT & Midjourney in the near future, but here is a summary of what we did.

Step 1 - Create a scenario
  • By simply giving ChatGPT a simple scenario, it could easily create a 10-step scenario for us to build on.
  • Based on this character, can you build a ten step customer journey for the app / service above:“Sarah is a non binary 27 year old environmentally conscious Londoner who wants to want to go zero waste, although living in the city, definitely presents its challenges for when they are consuming on the go.”

You can give ChatGPT the explicit steps of a journey, but if you are struggling to think of anything, ChatGPT is a great tool to get you started.

Step 2 - See what comes back

Sure! Here’s a possible ten-step customer journey for the app/service described in response to Sarah’s needs:

  1. Awareness: Sarah hears about the food waste reduction app/service through social media or word-of-mouth from friends who share similar environmental values.
  2. Research: Sarah goes to the app store and reads reviews and descriptions of various food waste reduction apps/services, compares features and pricing.
  3. Download: Sarah decides to download the food waste reduction app/service.
  4. Onboarding: The app/service prompts Sarah to create an account and walks them through the onboarding process, explaining the features and how to use them.
  5. Initial use: Sarah scans the barcodes of groceries they have at home, sets expiration dates, and browses recipe suggestions based on the ingredients that are close to expiring.
  6. Trial and error: Sarah tries out some of the recipe suggestions and learns how to adjust quantities or substitute ingredients to accommodate what they already have at home.
  7. Integration into routine: Sarah starts to regularly use the app/service to plan meals and reduce food waste, getting into the habit of scanning barcodes and checking expiration dates.
  8. Sharing: Sarah shares their experience with friends who are also interested in reducing food waste, recommending the app/service and exchanging tips and ideas for sustainable living.
  9. Community engagement: Sarah participates in the app/service’s online community or social media accounts, sharing pictures of their meals, giving feedback on the app/service, and learning from other users’ experiences.
  10. Continued use: Sarah continues to use the app/service over time, feeling more confident and empowered in their ability to reduce food waste and live sustainably despite the challenges of city living.

You can ask for more information at certain points, allowing you to quickly edit and add context to the scenario without spending time searching on the internet.

Step 3 - Create a character
  • Now the fun part is that by simply finding two reference images, and a simple prompt into MidJourney, we have our character & illustration style.
Here are the two reference images we used for both character and illustration style. Our prompts: https://s.mj.run/m_htKGh6-j4 , https://s.mj.run/b4EYa3512AQ + A non binary 27 year old, illustrated This is our character we selected to use for our storyboard.

Step 4 Create storyboard frames.
  • Using the same approach, a reference image of our character, a reference image from across the web for your composition and some simple prompts, and voila, you have a picture-perfect storyboard.
This is our character Sarah

Naturally, there was more nuance, and back and forth but as you can see in just over an hour we were able to create a scenario, customer journey and pitch-ready storyboard. Pretty impressive - especially for those of you like me who are actually terrible (and slow) at sketching.

You can view the full storyboard here

Using AI for interface design, branding & advertising

Storyboards are great, but what does it look like? How do we make it real?

In a similar approach, using reference images of designs we like, iconic designers and our imagination, we explored how we could bring the scenarios to life through interfaces and creative assets.

Rapid Art Direction
  • Using our favourite designers, reference images, links and some individual prompts, we were able to cycle through and create mood boards rapidly.

Two creative directions created in seconds.

Something that can take days and days could be achieved in minutes. How often has a client said I like part of routes one and two - can we smoosh them? NOW YOU CAN :)

Step 2 - Conceptual UI design
  • Leaning on some of the creative direction, referencing some quick examples from the web we quickly developed some conceptual UI designs that take the art direction and quickly apply it to ‘quirky’ UI designs.

These are very conceptual - even for a pitch or early concepts, they would require re-creation.

Step 3 - Creative Assets
  • Taking the reference images and conceptual UI design we liked, we started with app icons, UI designs, print layouts and even OOH advertising. Each time we referenced the original direction and the previous creations from midjourney.

Are the machines coming?

These AI tools are really cool. I can’t escape that. And yes, they are coming.

AI tools can be very helpful for accelerating processes, such as sketching storyboards or creating mood boards.

The Shit in = Shit out principle still applies, meaning the output's value depends on what is put into it.

Storyboarding.

Yeah, well, that is now a job for the machines. What could take up to a week or two for someone to craft can be done in hours? Any style you want, any format - it won’t be long before we make animations rather than storyboards.

Art Direction.

Midjourney is an excellent tool for exploring and creating mood boards. Moodboarding can be an exercise in spending hours searching the web for other people's creations. I have no shame in leaning on a machine for help with this work. AI tools can provide a wealth of inspiration and help generate new ideas.

Not ready to help with design, but I can see it happening when it comes to production or design documentation.

Content Creation.

I am no copywriter, but I have written a lot of content. From boilers to travel to education. What used to take me hours is now done in seconds. Using ChatGPT to create a ‘place holder’ or starter copy adding context, colour, and an element of realism to our designs and prototypes, is a 👍for us.

So how are we going to use it?

After 2 hours of putting AI tools into practice, it seemed like a good time to think about the so what? There were some no-brainers we will start tomorrow and some interesting ideas we will explore further.

Immediately

Storyboarding
  • Producing quality storyboards fast
  • Whether for pitch work or to communicate research
  • What used to take weeks and be very ‘waterfall’ is now hours and infinitely agile.
Art Direction
  • Not a complete scrapping of trawling the internet
  • But rather an addition
  • Collect the style you like
  • Use AI to create and produce directional creativity

AI will help with production and accelerating tasks that take us a long time, i.e. writing placeholder content, sketching storyboards etc. What we discussed was AI is another perspective.

We talk a lot about creativity and innovation being at the intersection of diverse perspectives. Why not use AI to add to that diversity, another voice in the room - it just happens to be a voice whose lived experience happens to be the entire internet.

How we might use AI from a different perspective
  • Analyse our research and develop a suite of How Might We questions to compare to ours.
  • AI to be another participant in a workshop, how does the machine look at answering How Might We questions
  • Co-creation involves clients, customers and computers
  • Analysing user interviews to identify themes, characteristics & mindsets and comparing with our own perspective