When you´re building an Infoproducts App, that requires a membership area, it´s very important to include a "Starter" section.
This way, if the Membership is already available, the Login can be linked directly.
In the following video we show you the great value of having an APP in the sales ecosystem of your infoproducts.
Adding a Membership area
What is a Membership?
It´s a kind of website that houses content tat can only be visible to customers who have been given a specific access, for example, after an online payment.
We have built a sales Funnel for a Yoga instructor, Catherine Willgood. This consists of four steps.
1- The first step of the Funnel offers the possibility of buying an Introduction to Yoga course. It includes a series of videos that can only be seen if the client joins the membership.
2- When the Yoga Course is added to the cart, then you have the option of also adding an ebook about eating healthy.
3- In the third step of the Funnel, when you click the purchase button on the "purchase summary", the client is redirected to an Up-selling page .
This sales strategy aims to encourage customers to acquire a more sophisticated or modern version of the product they originally intend to buy.
4- The fourth and last step of the funnel is the thank you page.
And these Funnel steps are showed like this inside the builder:
The Membership will be built from this fourth step.
We will therefore add a new step which would be the presentation page of the Yoga Introduction Course.
We show you everything in the following video:
Building the APP
First Steps
Once inside the platform, you will find the 'app' icon in the left side menu.
From here you can create a new app.
Just click on 'New App':
Once you've named your app, you'll get a screen where you can choose from several templates.
They are all predefined designs so that you don´t have to start from zero.
You can also change the template or start designing from scratch by clicking 'Blank Template'.
For this example we chose a blank template
The process of creating Apps with Scoreapps is very simple.
You just have to follow the different steps that the actual builder guides you through.
These steps are presented in the progress bar at the top of the builder, from where you can go backwards and forwards when ever you need to.
First step. Designing the App
From here you can chose the main template or edit the style of the layout (see below).
The Home Screen Options section shows the options available depending on the kind of layout you have chosen.
Layout election menu
For this app, we have chosen layout 95.
This layout design shows the content of the first feature, with the possibility of setting a header image. Here, it is particularly attractive to show the company logo.
As you can see, the home screen of our app directly shows Catherine's presentation on a custom page.
These are the settings for this particular layout.
- Visibility of logo: you can decide whether or not you want your logo to be displayed.
- Sidebar width: you can set the size of the drop-down menu. Either by the percentage of the screen or a fixed width showed in pixels.
- Logo URL: Here you should paste the link so the tool can upload images. You´ll find it on the left side of your screen.
To access you should click on the following icon.
And on this screen you simply drag the image you want to upload.
The image size should not exceed 500KB. When your images weigh, your images would soon be the burden of images and better it would be the user experience when browsing your.
The section you are going to see below helps you choose an image for the home screen. An image that fully fits all devices and screen ratios.
Use the overlay tool to check if the design shows correctly.
Make sure that the elements you consider important are left within the guided area area
Download the template with the optimal image sizes, available in both .png and .psd format.
Here´s a small 5-minute video that teaches you how to design the App Home screen:
Then choose your language region and also the currency you´ll be using with app.
To change the text fonts of your app you can select one from here or import a new font from Google Fonts.
To do so, it is as simple as writing the font name.
Second step. Colors
Choose the main colors of the app.
- General: applies to the substance (if there is no specific image) and the general text.
- Start: applies to the navigation menu and its elements.
- Header: applies to the navigation header of the app.
- Card: applies to items displayed in card format.
- List: applies to items displayed in list format.
In addition, if you already have web programming knowledge, at the bottom of the dashboard you can add CSS code and customize your app even more if you wish.
Once the home screen is designed and the main colors are ready, it´s time to add the different features.
By default, you´ll find some features that are already added. Features that we consider interesting for an app of your industry.
They appear as a carousel at the top of the builder and if you want to delete any of them, you just have to click on the X.
Check out this gif and you will see how easy it is to actually do this.
"The Coach" and "The Course"
For this app we have set up a presentation page for about the instructor and the actual yoga course she offers.
This functionality gives you several options for creating an info page.
You can write an article with an image, you can publish a photo gallery, you can publish a video directly on this page and you can also add call to action buttons or an external links to any website.
Click on this link and you could see a step-by-step article explaining the feature "
Custom page".
"Yoga trainning" (Link)
In this section we give access to the to Yoga course that we created at the beginning of the video.
It´s 100% mobile responsive page and users could follow the course from anywhere.
We´ve also used the 'link' feature. It is very simple to use, we show it in the next video.
Remember that the link you need to embed, most take you to the members login page
"Weekly Masterclass"
In this section, Catherine Willgood offers weekly content for the users of her app.
The feature we have used here is the "Custom Page", the same one as we initially used in the "The Coach" and "The Course" section.
"Social Wall" (Social Wall)
The aim of this section is to generate engagement.
From this section your users can post comments, share experiences with other users or make enquiries related to the world of yoga.
Click on this link and access a step-by-step article about the feature."Social Wall"
"Upcoming events"
From this section, Catherine Willgood keeps her users informed of all kind of events or webinars.
To build it we have use the "Event Schedule" feature.
In this video you can see how to set up this feature step by step.
Click on this link and access a step-by-step article about the feature "Calendar"
"Yoga Playlist" (Audio & Music)
The app also includes playlist of yoga.
In order to configure this feature, we have to click on "Audio & Music".
We have created four playlists: "Yoga playlist", "Meditation playlist", "Sounds of Nature" and "Tibetan Bells".
To learn more about setting up this feature, just watch the following step-by-step video:
Click on this link and access a step-by-step article about the feature "Audio & Music"
"STORE" (Delivery)
From this section Catherine Willgood sells products with her branding. Users of the app could easily buy all the items they may need for their yoga exercises.
This feature allows you to create one or more stores, create product categories, establish prices, configure sizes, product options, etc. and customize sales, delivery options and shipping.
You can also set up several payment options and launch discounts.
In our app, we have first set up the store. In this case, it is only an online store and does not have a specific address. If the case arose, this store would be geolocated and its location would be displayed on the map (its its operation requires adding a Google Maps API key).
In the "Categories" section, we have established the following:
And finally, this is how everything appears once all the products are added.
Learn how to fully set up the "Store/delivery" feature, by watching the following video.
Click on this link and
access a step-by-step article about the feature Store/delivery .
"Newsletter" (Topics)
This section allows Catherine Willgood users to subscribe to her newsletter to stay informed of everything that interests them.
The feature we have used to do this is called "Topics".
We have created a description, in this case, accompanied by an image.
And then we have indicated the various topics of interest to which users can subscribe.
Learn how to fully set up the "Newsletter (Topoics)" feature, by watching the following video.
Click on this link and access a step-by-step article about the feature "Topics".
"Yogui Food" (Folders)
We have also created a section about yogi food with recipes and nutritional tips for the users of the app.
We´ve used the "Folders" feature to do this.
This feature lets you organize content by folders. In other words, the folder that we have called "Yogui Food" will contain other features, in this case, custom pages, which would receive the item for each of the recipes.
Here's a video about the Folders feature.
Click on this link and access a step-by-step article about the feature "Folders".
The app has a contact form so that Catherine Willgood can answer any queries.
We have used the Form feature, creating a series of fields.
If you want to learn how to configure this feature, watch the following video.
Click on this link and access a step-by-step article about the feature "Form V2"
"Share" (Share app)
The app also has a section where users share the app with friends, family, etc.
You can configure the message and the text of the button for a more personalized experience.
If you want to learn how to add this feature, just watch the following video.
"Instagram" (Link)
This section is very simple. To connect your Instagram page with the app, we have used the link feature.
All you have to do is copy your Instagram page link inside the field and your page will be automatically connected.
Push messages are the most efficient marketing system that exists today.
While out of every 10 emails sent 8 fall into SPAM folders, with the Push Messages, 99% of them are read.
Adding this powerful tool to your App is very simple:
1- You need to add the "Push Messages" feature.
2- In order to do this, the App must be published for the native Android and/or iOS versions.
Once the app has been published on the App Store and/or Google Play, you may send info a nd promos to your clients directly from the "Push Messages" feature itself.
Click on this link and access a step-by-step article of the feature ."Push messages"
Step 4. App icon and settings
From here you can choose the icon you want to display on the screen of the user's devices, as well as the design of the button.
If you want to send push messages, here you can customize add the logo/icon and background color.
This tool will help you choose a compatible image that fits all the screen sizes of different devices.
This image would be seen by the suers when the app is loading.
Step 5. Advanced
If you wish, you can also monetize your app by displaying adding ads inside .
You can easily do this using Admob.
Publishing your App
If you joins our Starter, Business, Growth or Reseller plans, you can publish your app in various ways:
- Native iOS version.
- Web app HTML5.
- PWA mode (Progressive Web App).
To publish the native version of you app on Appstore or Google Play, you need to join a Business, Growth or Reseller plan,
You can publish your app as a Web App and Progressive Web App with no cost during you 14 day trial or if you´re a starter plan member.
If you´ve followed the guide right up to here, you already have an initial version of your App.