Contact

How to prototype a mobile app for potential investors

App Design · Updated June 7, 2022

Mobile app investors encounter a plethora of projects in their inboxes every day. Understanding how to create a successful mobile app and launch a prototype for your mobile app can help differentiate your startup from the rest and give you a competitive edge when presenting your app to potential investors.

how to create an app prototype

Whether you are looking for funding from family members or potential investors, defining a prototype correctly is the key to attract investment for your app. From the App Design team we have seen how some of our clients went from having 2 or 3 investors to more than 40 after designing the prototype of their app.

In this article you will learn how to create a free application prototype from the beginning. Our experience creating mobile applications for more than 20 years, makes us work on the small details, the keys for develop mobile applications for our customers.

Step 1: Study your business model

prototype yoga app

The first thing you need to know is your business model, which is defined by the following points:

  1. Who are your potential customers?. The design of an app is defined by the type of target audience: whether it is for children, for seniors or for a specific niche such as the luxury sector.
  2. Study your competition. Maybe you can get new ideas and improve your app by studying the competition. What similar apps are already developed in the market.
  3. Think ROI. Many customers have in mind exclusive functionalities that do not bring benefits to the application, thinking about ROI (return on investment) is the key to launch a first functional version with the lowest possible costs.
  4. Less is more. Your application should be easy and simple, with a flat learning curve to simplify use.
  5. Not sure?, start over. It is important to define the main idea, study the main problem of your customers and how to solve it in the most efficient way possible. Talk to your future customers, collect ideas and re-evaluate the 5 key steps to define your business model.

For a first contact, a self-study outside the app development is necessary. Collecting ideas from your customers will make you see new functionalities where you can create a utility for your end users.

Step 2: Define the main functions of the app

Once you have defined the business model, the next step is to break down the amount of functionality needed to develop your mobile application.

Let's take an example of a social network type mobile app, you will need to access the mobile device to launch different functions such as:

  1. Access to camera and gallery, it will collect the photos to upload to each user's profile.
  2. Access to social accounts, so that users can easily register through the main social networks such as Facebook or through gmail.
  3. Map functionalities, location of the user through maps. This function can be performed with the Google maps API, PositionStack, Mapbox or Here, there are many others but these are the main ones.
  4. Online advertising, including ads in the app through a provider such as Google AdMob, the main platform for including ads in mobile applications.
  5. Include videos in your app. Each functionality requires a previous study, is it necessary to include videos, will it affect the main utility of the app?

You must take into account that each functionality will have an additional cost, not only in design and development of the app, but also in recurring costs.

Videos take up more space than usual, so you will need a much more expensive server than usual. Therefore, it is necessary to know if it is worthwhile to develop all the app's functionalities in order to study your clients in a first app version.

Step 3: Define an app sitemap

This is the most important point in evaluating the app budget. From our mobile application development team, we always recommend taking the time to develop a complete sitemap for your application, as this will allow us to estimate the costs more accurately.

In order for an app development team to define the application, it is necessary to know the sitemap of the complete application for its first version (MVP). This will help the development team to understand how the app works.

Spending time to define well all the views or sections of your app, will lead to an application development company not to move away from the total costs of the project, over-estimating the costs or worse, falling short and leaving the development halfway. In our company we use a flexible methodology to eliminate these risks, contact us to study your case in a personalized way.

Below you can see an example of a sitemap for a VTC type application for cabs:

Development of a Taxi app - First MVP version

App Site Map

  1. Access
    —1.1 Registration
    ——1.1.1 SMS verification
    —1.2 Forgot password
    Client:
  2. Choose a destination (from X to Y)
    —2.1 Configuration of the trip to be made (luggage, animals, type of cab...)
    —2.2 Confirm (pay by credit card, paypal or to the driver)
    —2.3 Cab tracking and estimated arrival
  3. Trips made
    —3.1 Detail of trip made
    ——3.1.1 Valuation
    ——3.1.2 Invoice
  4. My profile
    —4.1 Edit my profile
    —4.2 Notifications
    Driver/taxi:
  5. List of requests (to accept or cancel)
    —5.1 Request detail (tracking for en route trips)
  6. Agenda
    —6.1 Configure availability
  7. My driver profile
    —7.1 Edit profile
    —7.2 Notifications
    Web:
  8. Landing
    —8.1 Driver registration
create prototype app

Our main advice is to spend more time studying the sections your app will take. You can do without the previous steps if you have a good and well elaborated sitemap.

Step 4: Prototype design tools for apps

Once the sitemap is defined, you need a UX/UI expert to design your application efficiently. The designer will create all the sections of the application to make your idea visible.

The main tools that UX and UI application designers work with are as follows:

  1. Figma: is one of the main app prototyping tools currently in use.
  2. Invision: very similar to the previous one, perfect for large web application projects where you need to work with more designers.
  3. Adobe XD: also widely used for prototyping, is used more for web prototypes.
  4. Mockflow: a powerful digital product design tool. Shape the user interface and structure of your app.
  5. Moqups: create prototypes of your interactive applications.

Simulating a user experience with your app is essential to get potential investors to test your app on a prototype.

Step 5: Development of your app prototype

I already have the prototype of my app, what's next?. Once you have defined the prototype, you will need to develop the application and the control panel to manage your app.

Choose a technology for develop your app, we recommend React Native, due to the amount of support and libraries it has, being the main code for developing hybrid mobile applications. Applications such as Instagram, Aibnb, WhatsApp, Facebook and Netflix are developed with React Native technology.

There are other types of newer and more efficient technologies, such as Flutter. You should know that it has been in development for a few years, so the costs and work times will be higher. In addition, many of the libraries do not exist, so you will have to create them and assume the costs.

Conclusion

It takes time to prototype an app, think about the idea, simplify it to reduce development costs and design the prototype to meet quality standards for a good user experience.

Take all the time you need to advance in each of the steps, it will be the beginning of a long road. Build a solid foundation so you don't get stuck, you will be able to scale your app steadily.

Our experience helps thousands of companies and investors to develop successful mobile applications, ready to break into the technological future.

5/5 - (3 votes)

Leave a Reply

Your email address will not be published. Required fields are marked *

App Design
Web design agency, application and software development

📍Madrid - Malaga - Barcelona

Spain | USA | Mexico | Colombia | UK | France | Germany | Belgium | Switzerland | Australia

Copyright © 2022 App Design | All rights reserved - Privacy Policy, Legal Notice and Cookies - General conditions
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram