Atlassian

    Prototyping is a strong entry point for AI learning. It gives teams a hands-on way to test ideas without needing deep technical expertise.

    AI prototyping kit

    Atlassian AI Builders Week curriculum

    Take what's relevant and make it your own.

    What is it?

    Prototyping helped our teams take a practical first step with AI-powered tools at Atlassian.

    The AI prototyping kit helps participants build on-brand prototypes to test ideas without deep technical expertise. We use Atlassian's kit, but you can use your own materials so teams build in line with your brand and style.

    Why it matters

    Faster to first demo

    Duplicate, pick screens, paste a prompt — you're testing in minutes, not days.

    Higher code quality

    Templates already pass Atlassian Frontend Monorepo checks; cleaner handoff to engineering.

    Consistent ADS UI

    Common patterns (e.g., Rovo chat, create button, inline search) look and feel like Atlassian products.

    Works where you work

    Same template set in Figma Make, Replit, and local dev tools (Cursor/VS Code/Devbox).

    Easier multi-screen flows

    Pre-linked screens and interactions to tell a believable story.

    Choose your path

    From no code to low code — pick the tool that fits your workflow.

    Figma Make

    No code

    Best for quick flows, stakeholder reviews, and early research.

    Replit

    Low setup

    Browser-based code prototype with the wizard; great for demos and usability tests.

    Prototyping Sandbox

    Low code

    Fast iteration with the latest design system components preconfigured — best for complex builds and generating hand-off specs.

    Cursor / VS Code / Devbox

    Low code

    Ideal when you'll iterate with engineers or publish a shareable link.

    What you'll get

    1

    Starter screens for common Atlassian patterns (nav, tables, search, creation flows, Rovo chat).

    2

    Pre-wired interactions across multiple screens so user journeys feel authentic.

    3

    Cleaned, ADS-compliant code when using Replit or local dev options — easier for engineers to extend.

    Best practices for non-technical teams

    1

    Begin with the story

    Write the top 3 tasks your user must complete; select only the screens needed for those tasks.

    2

    Keep scope tight

    Fewer screens -> faster wizard run, quicker testing, clearer feedback.

    3

    Use real copy

    Replace lorem ipsum with realistic labels and messages to reduce ambiguity in research.

    4

    Review with engineering early

    Share your Replit or published link so they can plan feasibility and effort.