top of page

Wireframing and Mockup:

A wireframe is a schematic or blueprint that is useful for helping you, your programmers and designers think and communicate about the structure of the software, website, or app you're building.

Elements of Wireframes

  • Text input

  • Checkboxes

  • Progress bar

  • Labels

  • links

  • Dropdown menus

  • Icons

​

Tools for creating wireframes - Whimsical, Balsamiq, Wireframe.cc, Figma, Adobe XD, and the list goes on 

​

A Detailed Example of wireframes - 

A mockup is a static design of a web page or application that features many of its final design elements but is not functional. A mockup is not as polished as a live page and typically includes some placeholder data.

Ultimately, a mockup serves as a visual draft of a web page or application. It is created to bring life to an idea or wireframe and allows a designer to test how various visual elements work together. (In simple words mockup means adding colors or design elements to wireframe)

bottom of page