Brand art tool · Salesloft · 2026
SLD Construct
I built Salesloft’s design team a creative tool for its new brand. Use the key art in new ways or make new art, in motion and in real 3D. Deep control, easy to learn, and every change shows up live.
- Role
- Product design, motion systems & build
- Year
- 2026
- Built with
- Claude Code, end to end
01
Start from what you’re making.
Pick the format first, a slide, a LinkedIn carousel, a story or a 32:9 event screen. Every starting point redraws at that size and plays when you hover it, so you choose from the real thing, not a thumbnail.
02
A finished slide, built in the tool.
Art, photo, type and logo on one canvas. Drag anything and it snaps to the margins and guides, the type follows the brand’s two-tone rules, and the whole slide plays and exports as one seamless loop. The clip is real time.
03
Real 3D, lit like a product shot.
The 3D scenes are real WebGL, with stone, glass and concrete, studio light and soft shadows. Open the stack, turn the camera, change the light. Hover any option and the canvas previews it, so trying ideas costs nothing. Even the dots live in real space. This flat disc is a cloud the camera flies through.
04
Any photo, rebuilt in dots.
The halftone is the piece the team reaches for most, so it matches the brand’s existing dot screen exactly. Drop in any photo or video, on ink or on canvas, and the dots swarm in, hold the face and drift away again.
05
Every piece moves on brand.
Dot landscapes, globes, signal fields, radars, wave bars and isometric scenes, all in one signal green over warm neutrals, all calm by default. Each loop here came straight out of the tool’s video export.
06
Data that builds itself.
Charts draw on, peaks lift their callouts and columns stack up to their values. Type the numbers in and the scene follows.
Demo values throughout.
07
Out to Slides, LinkedIn and the web.
MP4 for a Google Slides background, with the steps to make it loop. A GIF for Slack, transparent video for editors, SVG for Figma, or a live embed for the website. Every loop is seamless by construction.
- 58
- Art pieces, 2D and real 3D
- 205
- Designed looks to start from
- 10
- Formats, from slides to LinkedIn carousels
- 77
- Starting points, ready to make your own
The long version · 2 min readHow I got hereWhy a tool ·How I built it with AI ·What I learned
Why a tool
Salesloft’s brand has a rich visual language: the dot screen, the radars, one signal green, calm and precise motion. I wanted the design team to be able to do more with it, not just reuse the same key art, but push it into new pieces, in motion and in 3D, at a quality they’d put in front of anyone.
So SLD Construct is a creative tool, not a template filler. There’s deep control under every piece, from materials and light to the motion principles, but the interface stays simple: pick a piece, shape it on the right, see every change live. A designer can learn it in a few minutes and make something finished in a few more.
A simpler version could follow for stakeholders: the same art and guardrails, fewer controls, so anyone can make a polished graphic on their own.
How I built it with AI
- Built entirely with Claude Code. I designed the product, art directed every piece and set the brand rules. Claude wrote the code and tested it in a headless browser.
- Three interfaces, then the right one. The first versions were layered editors, like a small Figma. They were too much. Now it’s one piece at a time: the art library on the left, its settings on the right, and photos, type and the logo placed on top.
- Measured against the brand. The halftone was checked pixel by pixel against the brand’s existing dot screen, the radars rebuilt from the key art’s measured geometry, and every loop made seamless by construction.
- Taste, written down. Key art uses one green. Materials stay neutral: stone, glass, concrete. Motion is calm by default. Every 3D scene has to mean something, no decorative props.
What I learned
Power and ease aren’t a trade-off when every control shows its result instantly. The work wasn’t adding more options; it was making every starting point look finished and every option easy to preview, so the fastest path is also the on-brand one.