You may have seen some three-panel mosaics on your timeline. Here's how you can create them with @bot in @figma.
Any designer knows how they'd make one, it's just a bit of a pain in the ass.
So we should be asking “how can I use AI to make this 90% less of a pain in the ass, so I can focus on the cool, creative parts of design”
Grok Bot can do exactly that.
If you don't care about the “how” and just want a @bot template, you can find one here: https://x.ai/bot/dYpPe1PCZv2WJDVTYDwhc
Otherwise, here's how I built mine:
Building the photomosaic
My general approach with Grok Bot is: break down how you'd create the asset yourself, then prompt @Bot to do exactly the same.
In this case, the workflow was a design in Figma.
This is just a canvas with a hero asset, componentized and split across three panels. We can reverse engineer the aspect ratios by looking at existing posts on X.
I asked Bot to do exactly this - here's my optimized first prompt.
Replace Cursor Gothic, [link to image], and [insert file] with your assets.
After sending the prompt through, check on your bot every few minutes - if things are going awry, ask why.
Maybe the bot isn't properly using autolayout. Maybe the padding is off. Maybe a border radius needs a tweak.
Make the change, make a note of why it was needed, then integrate those things into your next prompt.
A few meta-points:
I'm using accurate language. Note how I called it a “photomosaic” and not “a picture in a picture as three thingys on a thingy”
I didn't know what a photomosaic was, but I asked Grok
