About PubCoder…

We launched PubCoder in 2013 with the aim to build a platform to create and distribute interactive contents for mobile platforms.

Actually we started some years before, when we were struck by the iPad presentation in 2010, and started to realize that it was a perfect device to enjoy highly interactive digital contents. But we saw something there: the only way to produce such contents was hiring an iOS developer to write one app for each content. Lengthy and costly. There had to be another way. A way that enabled creatives to design digital contents directly, without hiring and instructing a developer.

After some research and development, we ended up with a working prototype of an InDesign plugin that allowed to animate layout contents and create an interactive iOS app. The thing worked quite well and actually allowed us to produce some cool children’s book with it.

But we decided that this wasn’t enough.

InDesign wasn’t enough: it was a wonderful product to build paper layout, it was ok to add functionalities to enrich those layouts with some digital contents like audio and video, but when you wanted to create a truly interactive environment, where every object could vary according to medium or language and respond to touch actions and sensors, the interface simply could not keep up.

Also, building iOS apps wasn’t enough: we think that what makes digital contents great is the content itself, not the platform, so contents should not be tied to any technological platform. Authors should be able to create contents then sell them or distribute them for free on every possible platform. And users should be able to consume those contents on any device they possess or will buy in the future, regardless of the platform they initially bought these contents on.

So, in 2013 we doubled up our efforts and started to build a stand-alone desktop application to realize our dream, getting some good feedback here and there, for example from Apple and Xojo. So, where are we now?

It is now 2017…

“It appears IBM wants it all!” just kidding, that’s another cool story 😀

Some days ago we released version 3 of our platform, well, actually a beta of it, but one we are particularly proud of, and I think it’s time to wrap up and see where we are now and what is PubCoder today.

Today, PubCoder is a desktop application running on Mac and Windows systems that allows authors, creatives, illustrators and the rest of humanity to create HTML5-based, highly interactive, multi-language digital contents and distribute them in a plethora of different formats:

• As a native iOS or Android app, that can be installed on almost every mobile device on planet Earth
• As an HTML 5 widget that can be embedded on every website and viewable on any modern web browser
• As a standard EPUB 3 Fixed Layout file, that can be read on mobile and desktop devices using Apple iBooks, Google Play Books, Microsoft Edge or any other compatible ebook reader
• As KF8/MOBI file that can be read on Amazon Kindle platform
• Last but not least, in our open XPUB format, that can be read on any iOS or Android device using our free PubReader app or sold through a branded Shelf app that we can quickly setup for you

This means that you can use a lot of distribution channels for your contents, choosing what best fits your type of contents and your objectives:

• Sell a native app through App Store or Google Play
• Sell digital contents in a native, branded Shelf app using in-app purchases or coupon codes
• Sell an ebook on iBooks Store or Google Play Books or Amazon Kindle Store
• Directly host your EPUB file and sell it through Gumroad or similar services
• Distribute your interactive company presentation, report, product brochure, instructions manual, university lecture or whatever you built, for free, using PubReader

OK cool, how do I create contents?

PubCoder makes creating interactive publications a fast and straightforward process.

You start by creating a new project, choosing a default page size and orientation for your pages. PubCoder works in fixed layout, meaning that your layout proportions are fixed, and the page will eventually scale but not stretch to fit the viewer’s screen. If you like, you will be able to add different renditions to optimize your contents for, say, 16:9 and 4:3 screens or for both orientations, but we’ll see this in another article.

You can also start by importing a layout from Adobe InDesign and add some interactivity to each original InDesign object.

Laying out your document works simply as yow would expect: you can drag placeholder areas, drop files, use alignment tools and automatic magnetic guides:

You can use whatever bitmap image you like: PNG, JPEG and GIF are perfect but even TIFF or PSD work, since PubCoder will automatically compress & convert them to the most suitable format when exporting your project.

And if you are missing something, you can browse and grab thousands of Creative Commons photos from Unsplash and Google Open Images without leaving PubCoder or worrying about licenses. Fast and easy:

Of course vector images are welcome, in SVG format. You can even apply color easily to them and, again, if you can’t find the right vector icon on your disk, pick one from The Noun Project directly from PubCoder:

And it’s not all about images, you can of course drop audio and video files, or embed them from YouTube or Vimeo:

What about text? Well, for many other apps and services, text is a label with a font selected from a prefixed list and a size. PubCoder, instead, offers a full-featured on-stage text editor: you can assign a different style, size or font to each word in a text box, use tables, lists, links, shadows, inline images, and last but not least, use whatever OTF or TrueType font, or import some using our Google Fonts integration:

Let’s make it interactive

PubCoder allows you to easily enrich your content with interactivity by defining a series of actions that each object can perform in response to some events, like a touch on the screen or device shaking or tilting.

Actions can be combined in lists using a very simple form of visual programming: each action is represented by a “brick” that can be chosen from a menu, and the various bricks can be placed in the list one after another or sticked together, so that they will be performed at the same time.

Once added to an object, the action parameters can be edited on stage or in the inspector panel. Here’s a very simple example of how to obtain some subsequent moves of an object when it is touched:

Some actions can target any other object on the page to change their appearance, e.g. moving, rotating, scaling, fading them or bringing them to the front or backwards. Other can act on specific objects: play or stop a video, an audio or a frame-by-frame animation, switching the text of a text box or the image if an image object and so on. There are actions to change page, open a URL, run JavaScript code, apply CSS classes and other that allow to loop or run a group of actions and more. The possibilities are really endless, and we keep on adding something new very often.
Whatever the action you use, you can quickly preview the entire page with a click of a button:

Another way of adding interactivity is to opt for ready-to-use objects that can automatically respond to user actions to implement predefined behavior. We call them widgets and we bundled a few of them to let you quickly add to your page an image gallery, a pan and zoom images, a quiz, a memory game or a coloring game. Again, we listen to our users and try to add what they need as quickly as we can.

Anyway, if you don’t find what you need, you can always add some custom CSS or JavaScript or HTML code to your project using our shining code editor, at various levels. For example, you can add a custom HTML container to a page using a Smart Object, apply custom CSS to any object, page or for the entire project and run JavaScript code in response to PubCoder’s events.

Ready for take off

Whatever you want to build, you can do it in whatever format you like in PubCoder 3, and change your mind at any time. Your control tower for the export is the menu at the top-left of your project window: choose format, page range and destination of your project and click play. Done.

Each format has destinations that make perfect sense, here’s some examples:

• export your iOS app to a simulator or to the App Store
• export your Android app to a connected device or to Google Play
• export your EPUB to a file or to iBooks or Adobe Digital Edition apps
• export your HTML5 widget to a folder or to a browser

Among all the various formats supported by PubCoder, XPUB is the best choice when you are still working on your project, even if you want to finally export an app or an EPUB. This is because you can send an XPUB file wirelessly to any mobile device connected to the same Wi-Fi network of your computer using PubCoder’s companion mobile app, called PubReader, available for free on App Store and Google Play.

Just open PubReader on your device and you will see it appearing as a suitable destination for your XPUB export:

You can even send your project to more devices at once, very useful to use in team, a classroom or a meeting.

And when your work is complete, you can always switch to another format and export. Or, you can export your XPUB file and share it with your friends, customers or collegues via e-mail or using your favorite online file sharing service — like DropBox or Google Drive. No developer, app store or book store accounts, no submissions, no hassle.

This is really just a quick taste of what you can do with PubCoder. If it sounds cool to you, go get the PubCoder 3 Beta for Mac here: you can use it for free for 30-days and send us your feedback!