Tag Archive for: mock-ups

Prototyping your web designs can come in many different forms, from sketches on a napkin or in a notebook, wireframes, or high-fidelity mock-ups. No matter what way your prototyping takes shape, it is critical that the prototyping process is treated as an important part of your workflow.

Wireframe

Source: Flickr

There are quite a few reasons prototyping is integral to the web design process, but the main point is that they can save you extra effort you might otherwise use on creating a design that may not work. This is because prototypes take relatively little time to create, and they can help you identify issues in your design early on. Instead of spending hours laying out a page and tweaking it to find what works best, you can start crafting your design with a solid idea what you want, if you’ve spent the time beforehand to plan it out.

Prototypes also allow you to create variations on designs and compare them much more easily. Instead of coding different designs and layouts to compare. Using sketches or high-fidelity mock-ups, you can easily put the different iterations side-by-side. This means no switching between tabs and saved layouts and designs.

Jacob Gube points out more reasons prototyping is a must for any designer’s work process. Most importantly, putting your ideas on paper before investing time and energy allows you to cut any bad ideas at the beginning of the process. It also makes it easier to communicate your ideas to clients or employers who may need to approve a design.