About this design
Where the Wireframe style comes from, and what it signals.
Wireframe is a design-review deck that never completed the visual phase. You draw every element in lo-fi wireframe convention: containers with 2px dashed #9CA3AF borders and square corners, image placeholders as dashed boxes with corner-to-corner X lines, body copy replaced by rounded gray bars in #E5E7EB at varying widths. The device, applying wireframe treatment to the slides themselves rather than just to the screens under review, is the point.
Real text appears only in headings set in Inter at 32 to 46px bold in #374151, and in key figures set in Roboto Mono. The only color in the system is annotation blue #2563EB, used for 22px numbered circle pins with white numerals and thin 1px leader lines, up to three per slide. A dashed header row carries Roboto Mono metadata at 11px uppercase, such as 'v0.3 DRAFT', as a version stamp on every slide.
Wireframe suits design and product review audiences who already know what a wireframe looks like. Use it to present early-stage flows, annotate interaction decisions, or brief engineering before the visual pass is complete.
Use it for
- UX and product design review presentations before visual design
- Annotated interaction flow walkthroughs for engineering handoff
- Usability test readouts presented to product and design teams
- Early-stage product concepts shared for structural feedback
Skip it for
- Stakeholder presentations where the lo-fi treatment suggests the work is unfinished
- Marketing or brand decks where visual fidelity is expected from the first slide
The slide design prompt
This is the exact text that gets sent to your AI.
Create a presentation in the 'Wireframe' theme: a lo-fi UX wireframe turned into slides. Background: pure white #FFFFFF. Everything is drawn as a wireframe: containers with 2px dashed #9CA3AF borders and square corners; image placeholders as dashed boxes with corner-to-corner X lines drawn in SVG at 1.5px; fake body text as 12px-tall rounded gray bars in #E5E7EB at varying widths; buttons as outlined pills with 2px #9CA3AF borders and gray #6B7280 labels. Real text appears only in headings ('Inter', #374151, 32 to 46px bold) and key figures ('Roboto Mono'); both are Google Fonts. The only color is annotation blue #2563EB, used for 22px numbered circle pins with white numerals and thin 1px blue leader lines pointing at elements, like design review notes, up to three per slide. 'Roboto Mono' meta labels such as 'v0.3 DRAFT' sit in a dashed header row, 11px uppercase. Strictly avoid: any fill besides #E5E7EB gray and #2563EB blue; solid borders on containers; photos or icons; shadows and gradients; finished visual styling.
Use this theme for my slides. Ask me what the presentation is about first, then apply the theme to every slide.View this prompt and its data on GitHubHow to use this prompt
From copied text to a finished Wireframe deck in four moves.
- 01
Copy the prompt
Use the copy button, or open it pre-filled in Claude or ChatGPT with one click from the panel on this page.
- 02
Tell the AI your topic
The prompt instructs the AI to ask what your presentation is about first. A sentence or a pasted outline is enough.
- 03
Generate and iterate
Ask for more slides or swap a layout. The avoid list at the end of the prompt keeps Wireframe on-style while the content changes.
- 04
Or skip straight to a deck
SlideSpeak turns your topic or document into a finished Wireframe presentation, exportable as PowerPoint or PDF.
Common questions
Working with the Wireframe slide design prompt in practice.
