You can access the Readz Design Studio in 2 ways:
  • From the dashboard - by double-clicking on the project thumbnail.
  • From the Project menu: Click Edit. The Design Studio appears

Opening the Design Studio

Readz offers you an online design studio. Use it to create, build, edit, and update your interactive publications. Create pages, add text, media, animations, forms, and so on to create engaging interactive long-form content.  Here is where you will work the layout of your pages, create the design and make the publication become interactive by adding animations and feedback forms. Once you’re done, click publish and your publication is available, optimized, on a global content delivery network (CDN).

Understanding the Design Studio

The designer consists of the main canvas plus a set of toolbars and panels, split into four tabs.  In the middle of the design studio is its main component, the Canvas. This is the space where you will build layouts, add and style content elements and add animations. In this overview, we will give you a quick overview of the following toolbars:
The left toolbar has links and tools to add content and elements. Click a button in the left toolbar to display a new panel with a panoply of tools and options.
1. Add content elements
You’ll quickly become familiar with this tool. It contains the content elements, the building blocks of page construction, like text boxes, images, and forms.

Use these drag and drop components to add content and structure to a page.
9. Actions and animations - element level (and page level)
Make your content interactive. With an element selected, this toolbar allows you to add a wide variety of actions and animations to your elements.

Working with the top toolbar: Project management & meta-data

The top toolbar contains project management and meta-data  tools, such as SEO settings, media bank and more.
1. Save / Publish
To save your work, click the Save button. Once the project is saved, the button will change into a Publish button.

Working with the left toolbar: Content and element tools

The right toolbar contains page view tools.
  • Left: content and element tools
  • Top: project management and meta-data
  • Right: page overview tools

Working with the right toolbar: Page overview tools

Once you select a content element, the Layout toolbar will automatically open up. On this toolbar, you will find tools to help you manage the layout of your content element: sizing, alignment, grouping and so on.
2. Add pre-made blocks
Cut design time with customizable, pre-formatted layouts for headers, footers and full-page spreads.
3. Manage page background
Add a splash of pizzazz. Customize the page color or place an image in the background.
4. Element and action index
This nifty tool helps you locate every element (e.g. a text box) or action (e.g. trigger) on a page. It’s a great time saver when you want to update content or add customizations.
5. Actions and animations - page level
Deliver an interactive experience without coding. Add triggers, actions, and animation to page elements with visual controls.

Left toolbar: Element positioning styling tools

6. Text styling options
7. Element styling options
8. Layout options
Fonts, font sizing, alignments, colors, and so on. Here you will find all the tools needed to style your fonts.
Here you will find controls to set the background of elements, to define borders, padding, shadows, and more.
This opens up the panel above with the layout options.
3. Start animations from beginning
4. Pause / play actions
5. Switch between desktop and mobile layout
6. Open media library
7. Open SEO settings
9. Message center
10. Go back to the dashboard
Animations will run in the editor like they would in a real browser. If you want to see all the animations and effects start as if the page were newly loaded, click this button.
This button will allow you to pause or play actions and animations on your page.

Why would you need this? Well, imagine you would want to change the styling on a cross-out box of a pop-up. Every time you select the box, the action going along with this box will be performed, meaning that your pop-up will close. And so will the element you were trying to style. So, to be able to edit and style these elements that have animations on them, you can pause the animations. Allowing you to style and edit them!
Click this button to view your project as it might display on a desktop computer monitor or on a mobile phone.

For more information on this feature, read: "Using Viewports"
All the media (e.g. images, PDFs, video) you upload for a project can be accessed here. This nifty tool saves time when you want to reuse digital assets. 
Improve search results by optimizing your content. Click the button and a panel opens. Improve the default project title and then add a keyword-rich description.
Here you can communicate with other team members and with Readz support!
Click this button to go back to the Project page. 
2. Preview your page
8. Properties
5. Rename page
1. Add page
2. Page editor
3. Hide page
4. Lock page
Click here to open the Properties panel. Change the project name and then check the box to place a hamburger, the small square with three lines that holds a table of contents, on each web page.
The Preview button gives you several options:

Toggle Preview:
Need a clean view of the canvas? Click the eye to remove all designer tabs. Press any key to return to edit mode. 
Get a Preview Link:
  1. Click the URL to preview the flipbook on your current device.
  2. Scan the QR code to preview the document on a mobile device.
  3. Email the link and let another person preview the document. Be sure to check the security box to allow a preview without a login.
Note: the preview button disappears if you have unsaved content on the canvas. To activate Preview, click Save.
Click the pencil to rename a page.
Click the button to open the Create Page panel. Select a page template from a wide array of options.
Lots of tools here to help you manage your page. Copy, rename or move pages. And more.
Use the toggle to change the state of a page from approved to not approved (and vice versa). This is a useful tool when a team manager has to find and approve content before publishing.
When the lock is engaged, content on the page cannot be modified. Unlock to edit the page again.
Additionally, when an element is selected, the left bar offers you additional options:

Overview of the Design Studio