Custom Stencils are perfect for reusing navigation bars, login fields, footers and any other reoccurring content in your projects. What’s more, any changes you make to your Custom Stencils will be carried out wherever you have used the stencil in your project. With this feature you can save time and ensure consistency throughout your projects.

Custom stencils saved in stencil palette

Here is an example: I have used the Custom Stencils feature to create a template for a group of stencils that occur several times in the profile page of my Social Network prototype. This way I have been able to create a consistent layout, so that my image holder, text block and like button remain in the same relation to one another. Because custom stencils are saved at the left of the screen in the stencil palette, I can simply drag and drop my custom stencils into the page.

Create a custom stencil for your prototype by selecting a few stencils

You can create a custom stencil by simply highlighting a selection of stencils, opening the context menu and selecting ‘convert to custom stencil’. After converting the group into a custom stencil it appears in the stencil palette under “Custom Stencils” and can be used like a regular stencil. A custom stencil includes the customized information you have included in your stencils and also saves how the stencils are positioned in relation to one another.

Did you know: Another way to create templates in Pidoco is by using the global layer feature, which allows you to create positioned layers that you can re-use on any page in your prototype, for example to create the main navigation of an online shop.

The Custom Stencil feature is available with our Classic and Expert plans. We hope you can save time in your projects by using Custom Stencils. Watch this space for information on more updates to our product. Happy prototyping!

Selecting prototype folder via the new breadcrumb navigation

Using folders with Pidoco is easy. To create a new folder, simply click on the plus sign next to the “Folders” label in the Prototype View. This will take you straight into your new folder. From here you can add new pages, subfolders and other elements. You can name folders and add existing pages to your folder by clicking on the context menu of your page and selecting a folder in the parent folder category. You can select multiple pages by holding the ctrl key and clicking the pages you want to organize in the folders.

In the example below, you can see that I have created a folder called “Home” in my Social Network project. I can now organize my page into the folder “Home” or into one of its subfolders (shown by the ‘/’ symbol).

Organizing pages into folders using the context menu of a page

We hope our new folder system will save you time and make your prototyping even quicker than before by helping you organize your projects. Watch this space for more information about new features. Happy prototyping!

Moving to a new page in your prototype

We’ve introduced a breadcrumb system, which enables you to see where you are in your prototype at any time. Boxes will appear at the top of your screen showing you which prototype, folder and page you are working from. These are clickable, which means if you are working from a page, you can go back to these sections. When you hover over the arrows in your breadcrumbs, a menu will also appear. You can then use this to switch to a different page or layer in your prototype, without having to go back to the prototype view. This is a fantastic feature, which should make finding your pages even easier.

The breadcrumb navigation in our prototype creator lets you see what global layer you're working on

Thanks to another great feature we have added, you can work on different pages of your prototype in different browser tabs. What’s more, if you do this, the tabs in your browser will be clearly labeled to show what pages or layers you are working on. In your browser, you will then be able to change the order of your tabs to suit you and use shortcuts to flick through these tabs. To open a page in a new browser tab, simply click on the page whilst holding down the ctrl button. You can also click on the special icon in the breadcrumb menu. With Pidoco, you can save the URLs of these tabs for the next time you work on your prototype. What’s more if you send the URL to someone collaborating with you on a prototype, they will also be able to open this page automatically.

These are just some of the new features we’ve added to make working on your prototypes even easier. We hope you enjoy working with our new navigation system. To see how the new Pidoco navigation system works, you can also check out our YouTube video! Pidoco explained: the new breadcrumb navigation pidoco

How does ScatchApp work?

ScatchApp works by using unique technology that can recognize the layout and features of paper wireframes. ScatchApp can recognize components such as text boxes, headlines, buttons and image place-holders, which is great, whether you are creating flowcharts or wireframes. Uploading your designs with ScatchApp is easy. Simply draw your sketch on a piece of paper using the relevant symbols, take a photo with your mobile phone and upload the image to ScatchApp. Within seconds, your design will be transformed into a digital wireframe that you can edit online in Pidoco. ScatchApp even aligns the individual elements in your design, giving you a clean, professional-looking layout.

We've sketched out a paper wireframe of the Pidoco home page
that we will upload with ScatchApp.

How will you be able to use ScatchApp with Pidoco?

Here’s an example of how to use Pidoco in connection with ScatchApp. We understand that some people like to sketch out their ideas on paper first. Some even find this helps them be more creative. Naturally, paper has its limitations and even the best paper wireframes cannot produce the same results as prototyping with Pidoco. In addition, paper prototypes cannot be adapted or shared easily. In the example above, you can see that we’ve sketched out the layout of the Pidoco home page. In the picture below, you can see what the finished product will look like in Pidoco once this has been uploaded into ScatchApp. The buttons, text boxes and image placeholders appear in the same visual layout as in the sketch.

Now we've uploaded our sketched wireframe to Pidoco,
we can edit our prototype and add interactive elements.

In Pidoco we can now link and edit these pages. With Pidoco you can also collaborate on prototypes online in real-time and even use your prototypes in usability testing. What’s more you can discuss your prototypes with colleagues online. Using ScatchApp with Pidoco therefore enables you to model your UI designs with paper and pen, while making the most of all the great features of digital prototyping that Pidoco has to offer. If you would like to learn more about Pidoco have a look at our website, or if you would like to learn how to program your own application against the Pidoco API, take a look at our documentation here.

We would love to hear from you!

Navigation to other pages

We added a little menu to each breadcrumb that opens when you hover over the little grey arrow as shown in the screenshot. It lists all the elements on the same level and you can pick one to switch to that view. We also added a button that opens the desired view in a new browser tab such that you then can easily switch between several views. This way, navigating through your prototype should be as fast as before.

Folders

You can now add folders to your prototype where you can put anything inside. This allows for better organization of all the pages, layers, etc that your prototype contains. In order to move an item to a different folder, use the context menu. A drag and drop moving into a folder has not been implemented yet.

Custom stencils

We already have layers to reuse groups of elements across several pages, but they are always at the same position. From now on you can convert a group of elements into a so called custom stencil that then appears in the palette and can be added anywhere in your prototype. You can add several instances of it to the same page, you can choose different positions, and any change will automatically be applied to all the instances.

New visual design

Since it already took longer to implement things up to now, we skipped this part and will change the design in one of the next versions.

Stability

A whole lot of bugs have been fixed already, but there are still some left to be fixed. As long as we are not satisfied with the quality we won’t deploy the new version. However, it shouldn’t take very long anymore until we reach that point.

Let us know what you think

We would love hearing from you what you think about this new version! If you have any suggestion or feel that there is something important still missing, please don’t hesitate to get in touch with us.

• Chat with us.
• Feel free to send us a tweet: @pidoco
• We are happy about any email we receive: support@pidoco.com
• You may even give us a call: +49 30 4881 6385

Many thanks for your support!

When you search for it you may notice that we have a Pidoco app that is for 99 cents and a Pidoco HD app that is for free. You may ask, why you have to pay for the app? Unfortunately, Apple’s App Store policies prevent our app from being free because pidoco° itself is a paid service. So, for your benefit, we chose the minimum possible price. With the iPad version of our app we were just lucky to get it approved before we made our pricing public, therefore it is still for free. But once we have to add a new version, this is likely to be changed.

If it were for us to decide you would get the app for free. However, we preferred having the app in the store instead of having no app at all. Our hope is that you will understand that to date it was not possible to get a free pidoco app into the store. Having now achieved that the app is in the store we will continue to think about a solution that both satisfies Apple to make some money with our app and you to get the app for free. After the last three months, I’m not yet convinced that this solution will be possible in the short term, but we’ll work on it.

Oh, you haven’t heard about Pidoco Mobile yet? Please read this article that describes how the mobile edition works.

The most visible change that we did: we removed the tab navigation and introduced a breadcrumb navigation. Have a look how this will look like in the future (we plan to deploy this into our live system in November):

The first row of the pidoco interface now contains three elements: to the left we added two buttons that navigate back and forth in your browser history. Next to them is a breadcrumb component that always shows where you are in your prototype. In the upper right corner we placed some helpful links, like our support chat.

The new features in detail:

• Breadcrumbs: whenever you open a page, screenflow, or layer for editing, the breadcrumbs will show where you are. You can do various things with them:
  • Open the context menu to edit any property of the given item
  • Edit the name by double clicking on a crumb. This works also for the name of the prototype
  • Navigate to other items (not yet included in preview) by choosing it from the list of items that are on the same level
  • Open the item in a new browser tab by pressing Ctrl or Cmd while clicking
• Browser Tabs: you may know our real time collaboration feature. We now use this feature to sync several native browser tabs with the same prototype. This way you can open the same prototype in several tabs (or windows) and have all the pages or layers accessible that you are currently working on.
• Browser History: we enabled pidoco to track in your browser history where you have navigated while prototyping. This allows for using the history back and forth buttons. You may use the native browser buttons or the two buttons in the upper left corner, which do the same as the native buttons.
• Bookmarks: add the pages or layers that you need most often to your bookmarks. Since we enhanced the URL, the prototype can be opened directly in any specific page or layer.
• Global layer in Prototype View: up to now, we only show the pages and screenflows in the prototype view. With this version, we also added the global layers such that you can immediately open a layer for editing, no matter on which page it is visible.

In the current preview we have only two levels for the breadcrumbs: the prototype view and any other view in the second level. With only these two levels, the breadcrumbs may not yet make big sense. However, we plan to add further levels soon. Both within the prototype (folders) and on top of the prototype (maybe something like projects that wrap several prototypes). Especially with the folders you will realize the full power of this feature.

These screenshots show the different views and how the breadcrumbs and the URL change in all the views. For comparison, the following screenshot shows the current (old) version with the tab navigation.

When will this be available?

We know that people prefer what they are used to. And because of the big impact of this change on the way you use pidoco, we decided to give you the chance to preview what is coming up before we deploy this feature. This way you can get a feeling of how to use pidoco in the future and the surprise is hopefully not too big when we have this in our live system.

The current state of the preview is not exactly the state that will be deployed. These things will be done before deployment:

• Navigation to other pages: we want to add a feature to the breadcrumbs that shows you a list of items on the same level, where you can open any of these items with one click. Currently, it is required to go one level up and choose the item to open, which is a step we want to provide a shortcut for.
• Folders: we very likely will add folders to your prototype such that you can organize your pages and that the breadcrumbs will make more sense.
• “Custom stencils” (working title): a while ago we already started working on a feature where you can create your own stencils out of a group of elements. Our plan is to add this feature as well, because we were missing only the breadcrumb navigation to complete this feature.
• New visual design: together with the breadcrumb navigation we developed a facelift of our visual design as well. Although we didn’t decide it yet, we may include the new design as well.
• Stability: although we did a lot of tests for this preview version, we did not yet fix all the tiny bugs. Until we deploy this version you can be sure that we will fix all of them.

The time frame for all this to become the next version of pidoco is November. We will create another preview version a few days before go-live to show you how this will finally look like.

What if I have an idea / feedback on this?

If you have had a look at the preview and want to get in touch with us, please go ahead and let us know:

• Chat with us. You can pick anyone in our chat support, but if I am online you can also talk directly to me, Volker.
• Feel free to send us a message on twitter: @pidoco
• We are happy about any email we receive: support@pidoco.com
• It’s also possible to leave us a comment on facebook: http://www.facebook.com/pidoco
• We do have a feedback forum where you can add new requests and vote existing ones: http://pidoco.uservoice.com
• You may even give us a call: +49 30 4881 6385

We are looking forward to talking to you and hearing your feedback!

For users of Google’s Chrome web browser the Pidoco Web App comes in as a great improvement since it allows users to edit, share, and manage their Pidoco prototypes more quickly and efficiently. Upon installation a large icon is added to the New Tab page that allows you to easily find and open Pidoco with one click! Further more you can set the Pidoco Web App to open in a regular tab, pinned tab, or in full-screen mode. As a web-based wireframing application, the Pidoco Web App offers you the latest in wireframing and prototyping capability and stays up-to-date as we add new releases. Thanks to Chrome’s sync you can access the Pidoco Web App no matter what computer you’re using.

Our lucky winners can now use the Pidoco Web App on their new Chromebooks: It now takes as little as 8 seconds to boot up and start prototyping! The all day battery as well as the built-in WiFi and 3G ensure mobility free from malware and viruses.  The Chromebooks will be going out to winners mainly in Germany, but two will travel as far as the United Kingdom and Sweden.  Some of the happy winners have even managed to come to our office to pick up their Chromebooks in person. Here are some pics!

We are starting the roll-out of Pidoco Mobile with a private beta phase where you may be added to create iOS prototypes and test them directly on your device. Some of you may now ask, ‘and what about Android?’ Once we have fully rolled out the iOS part of Pidoco Mobile we start working on Android, so please be a little patient about it.

What is Pidoco Mobile?

It consists of two parts: the web application for creating the iOS prototypes (as you know pidoco already, but with new stencils) and the iOS app to simulate the prototypes on your device.

For the web application, you need to have a modern browser on your desktop PC (or Mac, for sure). We officially support Firefox, Safari (Mac only is recommended), or Google Chrome. On top, we heard that Microsoft IE 9 is working well, too, although not yet being officially supported. The iOS prototypes that you can create do run only in these browsers plus Opera and IE 9. We skipped the support for the older IE versions (8 and earlier) to simplify our development efforts. In general, if your browser supports native SVG then it is very likely to run our prototypes.

The iOS app provides you with a list of your iOS prototypes. First, pick one of these prototype and you see its pages. Then pick a page and the prototype is opened in either the sketched or plain mode. Take it from there to test your prototype, get a feeling for the correct sizes and measurements of the elements, and see whether your concepts work. We have added a demo account with which you can try a prototype of the Facebook app to give you an impression of what’s possible. The pidoco app is available for both iPhones and iPads.

How can I participate?

To install the iOS app on your device, please sign up with testflight right from your device. You will then have to register your device so we can add it to the builds of our app. (You might have heard that for such a test, we have to add every single device to the app for it to be installable.) If you followed the above link then we will be informed and can create a new build that we then can send you. To install the build you will have to open the link from the email on your device, the rest is done by testflight. UPDATE: we finished the private beta phase. It will be released soon for everybody to use.

If you already have a pidoco account, then we need to activate the iOS prototypes for that account. The best way is to send us a short mail (contact@pidoco.com). In case you have not yet an account you may create one and use the 31 days free trial. In this case we also need to activate your account before you can create an iOS prototype.

I have feedback. How do I let you know?

We know that this beta version of Pidoco Mobile might not yet be complete and that you will very likely miss a feature. If we know about this we can add it to our development process. There are different ways of how to tell us such ideas:

• You can chat with us: https://pidoco.com/contact/chat
• Feel free to send us a message on twitter: @pidoco
• We are happy about any email we receive: contact@pidoco.com
• It’s also possible to leave us a comment on facebook: http://www.facebook.com/pidoco
• We do have a feedback forum where you can add new requests and vote existing ones: http://pidoco.uservoice.com
• You may even give us a call: +49 30 4881 6385

Just pick a channel to talk to us, we’re happy to hear from you!

(Please note that we created the Facebook prototype on our own and only for demo purposes. There was no involvement of Facebook.)