Video 2 of Part 2: Widgets and Masters – Wireframing Basics
Next we’ll add a logo placeholder. The wireframe widget library is loaded by default. Drag out a placeholder widget. Double click it to add text which is a visual cue of what this object is. Let’s also add a name, this is an extremely important habit to get into for when we get into interactivity. It also enables you to communicate with other about aspects of your design – it’s not very often we are designing in a vacuum.
Talking of not designing in a vacuum. Let’s introduce the notes tab. This is where you can make notes about the widget. There are a number of preset fields, but you can customise these for whatever purpose you desire. I often delete a lot of these presets and create a custom field of ‘Changes’ so I can log to-do’s against this object or widget. These notes are included when you generate specification docs, more on working effectively in a team later.
Widget properties and style
OK, we’ll skip interactions for now, on to the Widget properties and style tab. In the event that you realise you are using the wrong shape, or you want to change a shape – you don’t need to delete, and start again. You can quickly change the shape by right clicking, and choosing ‘select shape’, or, for more visual details, you can select a shape from the dialogue in the properties tab.
OK next we’ll drag out a ready made horizontal menu. Let’s put a global guide in to delineate the head of the page, and move the menu into place. Then simply double click to customise the text of each item. Let’s keep it generic for now, matching the names of the default pages.