Booklet

author

Konstantin Zhuck

Design

Difference Between Wireframe, Mockup and Prototype

design

Design

|

Difference Between Wireframe, Mockup and Prototype

Wireframe, mockup, prototype
Many beginner designers and clients often confuse when hearing these words. Is the prototype the same thing as wireframe? And what is the mockup?

  1. Wireframe
    A wireframe is a «blueprint» of the future design. It's a structure of a page / screen made with simple blocks. Without any graphics. It's one of the UX design steps. You should place all text and elements in the proper way based on you UX research.
  2. Mockup
    A mockup is a final version of the Ul design. But there is one more meaning. Mockup is also a device or a place where you can put your design.
    For example: iPhone XS mockup Bilboard mockup
  3. Prototype
    I always was confused about it. So, the prototype is not a wireframe :) Prototype shows how the website/app works. Like a simulation of a real product. It could be animated or just build with lnVision or Marvel app.

More booklets by Konstantin Zhuck

More Design booklets

Your recently viewed booklets

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
See all booklets