Wire Frame Diagram
Getting to know the Wire Frame Diagram
Introducing the Wire Frame Diagram
Wire Framing is a productive tool that can be used to create visually compelling and realistic models of commercially available phones, tablets, screens and web pages. The diagrams assist Business Analysts, Experience Designers and others communicate with stakeholders, allowing them to demonstrate the solution interfaces.
Many stakeholders will understand how a solution is going to work if they can see something concrete and visual. The Wire Framing tool is perfect for this situation where a mock-up of the user interface of a phone, tablet or web page is created including page layout, interface and navigational controls representing different parts of a User Story or Use Case.
Where to find the Wire Frame Diagram
Ribbon: Design > Diagram > Add Diagram > Wireframing > Apple, Android, Dialog, Webpage, Windows Phone Wireframe
Browser window Toolbar : New Diagram icon > Wireframing > Apple, Android, Dialog, Webpage, Windows Phone Wireframe
Browser window context menu | Add Diagram... > Wireframing > Apple, Android, Dialog, Webpage, Windows Phone Wireframe
Usage of the Wire Frame Diagram
A Business Analyst or Experience Designer will typically create Wire Frame models for the devices that are being targeted in the solution. The interface elements and navigational controls can be connected to other elements in the Repository. For example a drop down list could be connected to a data source indicating the origin of the data. A slide show could also be created to walk a stakeholder through a sequence of diagrams representing the flow through a User Story or Use Case.
Options for the Wire Frame Diagram
There are built in Toolbox pages for the most common types of device, including:
The Toolbox pages contain elements for the devices, pages and screens and a wide range of controls, widgets and other elements. Tagged Values can be set to hide or display elements of the interface such as phone menu buttons and notification bars.
Diagram Filters can also be used when presenting the diagrams to draw attention to parts of the diagrams, and the diagrams can be presented as hand drawn or in a whiteboard style by changing the properties of the diagram.
Learn more about the Wire Frame Diagram