• Topics
• FAQs
• API Documentation
• Professional Services
• User Experience Dictionary
• Important Notice

4. Reusing elements (layers)

Often it is useful to re-use some parts of the prototype, for example when the same set of elements appears on several screens, as is often the case with branding or top-level navigation structures. Pidoco offers several options for reusing elements to help you save time and maintain consistency throughout a project. One of them are layers, which work like "skins" that can be laid over (or under) any page. Similar to pages, layers can contain stencils and are edited the same way pages are, but they are "global" in nature, meaning that there is only one instance of each layer that can be displayed on various pages. When the layer is edited, all those pages change appearance - a powerful way to avoid redundancy.

In our example, a layer is an ideal way to add some branding to our design. Since the branding will be the same on all three screens, we can create one layer and display it on all three pages. To do so, go back to the "Home" page and open the sidebar at the right by clicking on the arrow icon.

Click the "New layer" button to add a layer and name it "Branding". The page content will slightly fade to indicate that you are now editing the layer.

Add an "image" stencil to represent the logo and a "text" stencil with the words "Pidoco - Powerful Prototyping" in 14pt font. Then click the "Done" button in the toolbar to close the layer. Always make sure to deselect layers you don't need on a page and close them by clicking "Done" when you want to go back to editing the page.

Now all we have to do is apply this layer to the other two pages by going to each of them and activating the layer's checkbox in the layers panel. Done.

Another option for creating reusable building blocks for your projects is by creating so-called "masters". This can be done by selecting a group of stencils, opening the context menu and clicking the "Turn into master" icon.

The master will be added to the end of the Stencil Palette and can be used just like any other stencil. You can edit a master by double-clicking on it in the Stencil Palette or anywhere it appears. But beware: Editing a custom stencil changes all instances of it - unless you have "detached" them from their master in the Stencil Palette using the "Detach from custom stencil" icon in the context menu.

<< previous

next >>