In recent articles about app design, we’ve seen how to write the preliminary documents: the User Profiles, User Stories and Business Model. With this material we’re ready to start working on the mockup, which will allow us to assess and test the actual look of the app.

Given that the mockup is a preliminary design of the views for the app, you can use any tool, even pen and paper. Nevertheless, these days there are a number of tools online, some of which are free, that allow you to quickly create animated prototypes of your screens. Just Google mockup tools or prototyping tools to get a nice list. These tools offer templates and icons of the most common user interface elements, so you can design views that will feel very similar to the final versions.

Once we’ve chosen a tool, we need to understand what we’re actually going to mock up. I don’t recommend mocking up all the app views, from logins to settings. The best strategy is to start from the User Stories, and make a mock up for each User Story described in the document. This way we’ll be able to see just the main processes of the app without getting distracted by everything else, and that will allow us to create a prototype that’s more focused on the most important features.

Finally, a little advice on style. In apps, less is more, so resist the temptation to add hamburger menus with all kinds of functions. Be clear and concise when using text, say nothing more than you have to, and capitalize on the power of images and the recognizability of icons, which are often worth a thousand words. Never open the onscreen keyboard unless absolutely necessary, avoiding input fields as much as you can, and minimize the number of taps to complete the process.

Before getting started, some good advice is to study both your competitors and other applications with a similar process. You’ll be able to appreciate some of their ideas and also see how you can stand out. That’s what I did before starting the mockup for ToBuy, which you can find here.

It’s interesting to compare the mockup with the final app, which you can test in preview here. In truth, the differences are minimal because the mockup and the app share the same graphical theme, meaning the device’s native theme.

This article wraps up our little overview on app design. At this point we can start to see how to move from the mockup to the app, which means tackling the actual phases of development. In the meantime, if you’ve created some mockups and you’d like some advice on how to optimize them, I’m at your disposal.


It is with enormous pleasure and something of a thrill that I’m writing this post today to make a very important announcement: on November 15, 2016, Instant Developer Cloud concluded the preliminary phase and the first final version has been released.

Simply register on the console to be able to develop your app directly from your browser and test it directly in the device, thanks to the InstaLauncher app that you’ll find in the Android and iOS stores. But you also know that this was already possible in the preliminary version.

Starting today, it takes just a few clicks to purchase a production server and make your web applications available to end users. Just enter your information, choose the server type that best meets your needs, and confirm the operation. Your new server will be available in a few minutes. There’s something for every taste, beginning with the XS size, with 1 shared CPU and 0.6 GB of RAM, through to a powerful XXXL with 16 CPUs and 60 GB of RAM memory.

Compiling, installing, returning to a previous version of the application, and running queries to your database in the Cloud will be child’s play thanks to the console. But that’s not all.

We’re well aware that in developing a product, one of the most important phases, if not the single most important of all, is the test. That’s why Instant Developer Cloud was equipped with a system of automated tests that makes it possible to flag regressions in the code, check the application behavior under load conditions, and launch step-by-step test sessions.

It’s simple. Simply choose an installation of the application and record a few work sessions; then you can use these records to run a test on the original installation or any other instance of the application.

I’m happy to say that these are just the first public steps for Instant Developer Cloud Final. In upcoming weeks we’ll release lots of very interesting features. But I don’t want to give away too much in a single article.

As usual, we welcome your feedback! For any clarifications, problems, or doubts, write to

Now we’re officially on the road and I can hardly wait to start this journey together!

Have fun!


In recent articles about app design, we’ve seen which documents need to be written before making the mockup: the User Profiles describing users, and the User Stories that describe the processes.

Today I’d like to get into some detail about the third and final preliminary document, the business model. First let’s see how it affects the mockup for the app. There’s no doubt that the business model is an essential component of the business plan, but why should we worry about it in the mockup phase?

The answer is that nearly all apps are developed as software as a service and are not based on a predetermined fee, so monetization and promotion must be integral parts of how the app itself functions. Simply put, the app has to sell itself, and we need to plan how this will happen very carefully.

So how do you begin your business model? By defining the goals you need to reach. While costs and revenues are addressed in the business plan, here you can have other goals, such as:

  1. the total number of users/installations/registrations.
  2. the number of sessions/day.
  3. the total time in minutes of use/day.
  4. a given number of significant events (for example purchases, shares on Facebook, etc.)/day.

After we have identified our goals, we need to describe the characteristics that the app must provide in order to achieve them. This phase is very complicated, and my advice is to start by looking at how apps similar to your own work. It’s really difficult to invent new business models from scratch: it’s easier to adapt existing ones to our specific case.

To avoid getting too technical, I’ll share the case of the example application ToBuy. The value of this application is that it optimizes the purchasing process in the supermarket. However, this value can’t be directly monetized: few people would be willing to pay to have it, in part because there are many free competing apps out there.

A good goal for ToBuy instead is to maximize the total number of times you go shopping each week. This requires:

  1. That the app be free, both in the app store and when using it.
  2. That creating a user account is not required, to avoid conflicts before users even begin to enjoy the value of the app.
  3. That there must be functions for sharing the app on social networks. The simple function for sharing your shopping list is not enough by itself, because that occurs within the family.

How can this goal be converted into effective monetization? Not with in-app ads, which require more than a million installations and extreme app user loyalty in order to be effective.

ToBuy might however represent a marketing channel for supermarkets: knowing what a person wants to buy makes it possible for them to influence purchasing decisions. For example, you could develop an API that lets a supermarket send a notification like this: “Shop here, you can save up to 12 euros on your list today.” Then if the user accepts, perhaps they’ll find their list already organized to match how merchandise is displayed in the selected store.

Beyond the ToBuy example, it’s clear that monetization affects app design from the very beginning, so the Business Model is an essential element of the preliminary information needed to create the mockup.

Next week I’d like to talk to you about actually making the mockup, working from the three documents we’ve analyzed. In the meantime, if you want, try to write up an alternative Business Model for ToBuy – I’m curious to see what you’ll come up with.


15.5 is here

by Giovanni Foschini on 11/03/2016

This weekend we released version 15.5 of Instant Developer Foundation, and as you will have noticed, it’s one of the most important versions in recent years.

In addition to the great innovations you’ve already heard about, like the introduction of a new graphic theme based on Bootstrap and the option to use two new libraries (Google Chart and ChartJs) to create charts, this version contains more than a hundred fixes and improvements, and most of them are things you’ve asked for.

I think this is the best response to the concern that some of you have expressed to me, worrying that we might become less committed to Instant Developer Foundation after we released Instant Developer Cloud.

In Varignana, when Andrea shared with you the idea of creating Instant Developer Cloud, he told you that our main goal in building this new tool would be to help you provide the best possible response to new requirements in app development, for apps that are less business-focused and more customer-facing, which are in increasing demand from the market.

He said all this even more clearly when he presented the final release of Instant Developer Cloud, answering the question “Instant Developer: Foundation or Cloud?” by saying:

“…it’s not Foundation – or – Cloud, it’s Foundation – and – Cloud.”

I think this has been reinforced even further by Andrea’s recent posts, in which he provides examples of exactly how the approach to app development has changed, and how to best use Instant Developer Cloud as a result.

Coming back to what’s going to happen with Instant Developer Foundation, I can tell you now that next year the release cycle will proceed as normal, with three versions planned for March (16.0), June (16.1) and October (16.5), and their content will be defined largely by your ideas.

So keep telling us what you need and how you’d like to improve Instant Developer Foundation, and in the meantime if you have the chance, be sure to try Instant Developer Cloud as well!


App processes: how to describe them with User Stories


In my last article dedicated to app design, we saw how to create a User Profile, which is the document that describes the user types, the obstacles they have to overcome, and the advantages they can gain by using the app. However, before we proceed with making the mockup, there’s another step we have to [...]

Read the full article →

App users: how to create a User Profile


In recent weeks I’ve tried to highlight the challenges that designing an app poses, especially for those of us who have already developed a lot of business software. To get off to the right start, we can do ourselves a favor by writing a few specific documents before starting the mockup. In this article I’ll [...]

Read the full article →

App design: where to start?


In our last article we saw that before we start developing an app, it’s helpful to begin with a product design phase that can bring the idea to life through a mockup that shows the user interface, and perhaps a few work flow examples. A variety of programs exist for developing mockups. The main advantage [...]

Read the full article →

From idea to app: what’s the path?


In recent weeks I’ve had the opportunity to help a few members of the Instant Developer community set up projects using the Cloud edition, working from their own app ideas. It was a very interesting experience because it helped me understand what obstacles must be overcome for people who have already developed a lot of [...]

Read the full article →

Instant Developer and iOS10? No worries


We’re well into September, and it’s time to start up with the iceberg again. Now that the weather has cooled a bit, we’re ready to be with you every week. We’ll start right away with some excellent news for our whole Community: as of September 12th, Instant Developer Foundation is fully compatible with iOS10. That [...]

Read the full article →

Bootstrap + Foundation: watch the preview


A few months ago we announced that the most important innovation for Instant Developer Foundation this year will be the new rendering engine based on Bootstrap. Since we’ve talked about Instant Developer Cloud a lot recently, you might think we’ve forgotten about that promise, but the project is moving along quickly toward release in version [...]

Read the full article →