How To Create Mockup Screens In Visio

Drag a form first followed by some buttons and panels.

How to create mockup screens in visio. But it is less known that among this diagramming powerness there is also specific funtionality that allows to create your own mockups wireframes or prototypes for software development. I know i can create these using visual studio but i would rather use a graphics tool if possible. With all of the parts for your mockup captured bring them together in the snagit editor.

When you first start visio the choose drawing type screen appears. Expecting a screen mockup to communicate functionality. Design your application form using the common controls and shapes found in the stencils on the left.

They can t capture the complexity of a website or app s experience. After that click on dialogs us units then click and drag dialog form to the middle of the page. Create two rectangle boxes by right clicking on the rectangle box shape and dragging the shape over to the drawing area twice.

Move each box to fit adjacent to each other inside the main body box. I have visio 2007 that came with ms office and i do not have any software or database templates. Change the size of the viewing screen by clicking on the zoom in button at the bottom of the window.

Resize each box to fit one half of the main body box. Ui designers new to mockups might make these all too common blunders. Remember screen mockups look great but they re just a series of isolated images at the end of the day.

Choose the windows xp user interface drawing type from the software catagory. From there you can click and drag to rearrange the captures and position them to fit your desired layout. For ease of use save these stencils into the documents my shapes folder and visio will automatically include those in these in the my shapes menu the next time you launch it.