Create app templates with the Wireframing App

Create own templates for your contentApps with the Wireframing App - without programming knowledge. More than 20 elements from the fields of multimedia and graphics are available as standard.

With the contentDock SDK element, developers also have the option of integrating individual programming.

Register and test contentDock!

Install the contentDock® Apps

The contentDock® apps are free of charge available for iPadOS in the Apple App Store.

For Android, the contentDock® Viewer App will be available in the Google Play Store in spring 2020.

contentDock® Wireframer App

contentDock® Viewer App

Why a Wireframing App?

Wireframes are a proven tool when it comes to displaying the basic structure and the functionality of a page.
They are an important step in any screen design process. Without being distracted by colors, fonts and text, you can concentrate on building your page templates. Have the courage, to experiment also simply times!

Synchronize the page templates with the contentDock® Management System.
There you then set the styles and link the individual page templates with the corresponding content.

Image: View of an open template in the Wireframing App

App templates - intuitive & easy

Create your own templates for your contentApps or adapt the templates from an imported template project. Alternatively, set a finished design or a finished wireframe as background image and position the desired content elements on it. Be creative and play with the elements until it's right for you. With the contentDock® Wireframing App, we offer you a maximum of flexibility for this.

The user interface for editing a page template is designed so that the entire surface of the tablet can be used for positioning the content elements. Tools such as magnetic grids, distance lines, or a background image help you position the elements accurately. The elements can be enlarged, moved or rotated with your finger. You can set for the position, size or rotation also the pixel exact values per element in its settings.

Image: contentDock<sup>®</sup> offers various elements that can be used for the design of the contentApps.

Elements

Apps that mainly display content usually get by with just a few elements. The elements headline, text and image as well as video and audio are predominantly used.

contentDock® offers you over 20 different elements that you can use for your contentApps. And if you don't want to do without HTML, CSS and Javascript, you can use the "Webview" element and then save a live URL or a zip file with a static web page in the contentDock® App Management System.

You can also create forms for your apps. All classic form elements like text box, multiline text, drop-down list, checkboxes and radio buttons are available.

Tip: If you always want to place an image or navigation element at the same position on each page, set this element in the master template. This means that it only has to be set once in the project.

Image: contentApps can be optimized for display in portrait and landscape format.

Responsive Design

In contentDock® you can optimize your contentApps for display in portrait and landscape format.

Activate the desired format in the Wireframing App in the project properties, then rotate the tablet into the corresponding display and position the elements.

The same elements are always available, but they can have different sizes, positions or rotations.

Image: Any page size can be defined for each template.

Different resolutions

For each template within a project, any page size can be defined for the landscape format as well as for the portrait format.

This makes it possible to create templates which are scrollable or optimized for a special tablet.

Image: Various help tools support the positioning of the elements.

Help / Tools

The Wireframing App offers different help for the placement of content elements.

A magnetic grid can be displayed, which you can adjust in the size according to your needs. Distance lines show the distance to the frame or other elements and help lines are designed for individual pixel-precise placement.

Tip: If an element is at the final position, lock it so that it is not accidentally moved.

Image: The Wireframing App shows the current state of synchronization with the App Management.

Synchronisation

Edit your templates offline and synchronise your project as needed. The editing the templates, the synchronizing to the contentDock® Management System and the publish to the Viewer App - repeat the workflow until you are satisfied with your work.

Are you ready to contentDock®?

Write to us or start the registration directly.