mockups
Preliminary visual models
Mockups are preliminary models or representations of a design, built to test appearance or demonstrate concepts before final production.
In product design, a mockup might be a physical model; in web and software development, mockups show how interfaces will look without functional code: The designer presented mockups of the new homepage.
Also spelled mock-ups.
Edge-only geometric model
- prototypeFirst functional specimen
- layoutSpatial arrangement of elements
- interfaceShared connection point
- UIInteraction design abbreviation
UX · Figma · clickable · responsive · interactive · screen · component · pixel-perfect
Preliminary sculptural study
Short trial presentation
- betaGreek alphabet's second letter
- alphaFirst Greek letter
- functionalAble to operate correctly
- clickthroughAct of selecting hyperlink
simulation · pilot · validation · refinement · iteration
Interpretive depiction or performance
- compositionArranged elements forming whole
- placeholderTemporary position marker
- grayscaleTonal range, black to white
- presentationFormal display to viewers
wireframe
Edge-only geometric model
- prototypeFirst functional specimen
- layoutSpatial arrangement of elements
- interfaceShared connection point
UI · UX · Figma · clickable · responsive · interactive · screen · component · pixel-perfect · artboard
maquette
Preliminary sculptural study
demo
Short trial presentation
- betaGreek alphabet's second letter
- alphaFirst Greek letter
- functionalAble to operate correctly
clickthrough · simulation · pilot · validation · refinement · iteration
rendering
Interpretive depiction or performance
- compositionArranged elements forming whole
- placeholderTemporary position marker
- grayscaleTonal range, black to white
presentation · polished · realistic · annotated · redline · handoff
- graphic designlogo, font, typography, layout, color
- design documentsstyle guide, blueprints, sketches, color palette, drafts
- design processbrainstorming, prototyping, concept, wireframe, sketches
- design toolsruler, pencils, eraser, pen, markers
- digital productsapp, apps, ebook, ebooks, software
- stock mediastock photos, royalty-free, photo library, photo archives, video clips
mockupsfinal product
Completed output ready for use
finished product · finished products · final version · live version · live versions