29 lines
1.3 KiB
Markdown
29 lines
1.3 KiB
Markdown
|
---
|
|||
|
|
title: Wireframing
|
|||
|
|
---
|
|||
|
|
## Wireframing
|
|||
|
|
|
|||
|
|
<p>A wireframe is a two-dimensional illustration of a page’s interface that specifically focuses on space allocation and prioritization of content, functionalities available, and intended behaviors.</p>
|
|||
|
|
<p>Wireframing is a way to design an application at the structural level. A wireframe is commonly used to lay out content and functionality on a page which takes into account user needs and user journeys. Wireframes are used early in the development process to establish the basic structure of a page for these reasons, wireframes typically do not include any styling, color, or graphics. Wireframes also help establish relationships between a website’s various templates.</p>
|
|||
|
|
<p>Find additional resources on Wireframing <a href="http://www.experienceux.co.uk/faqs/what-is-wireframing/" target="blank">here</a></p>
|
|||
|
|
<br>
|
|||
|
|
<h2>Wireframing Tools</h2>
|
|||
|
|
<hr>
|
|||
|
|
<ul>
|
|||
|
|
<li>
|
|||
|
|
<a href="https://marvelapp.com/home" target="blank">Marvel</a>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<a href="https://www.invisionapp.com/" target="blank">InVision</a>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<a href="https://proto.io/" target="blank">Proto App</a>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<a href="https://www.lucidchart.com/pages/examples/wireframe_software/" target="blank">Lucidchart</a>
|
|||
|
|
</li>
|
|||
|
|
<li>
|
|||
|
|
<a href="http://pencil.evolus.vn/Default.html/" target="blank">Pencil</a>
|
|||
|
|
</li>
|
|||
|
|
</ul>
|