Mobile App Walkthrough 1/5
Hello everyone! Today we’ll do the tutorial on using The Ask Alvin Mobile App.
First, go a head to the login to login page at mobilemarketing.conversion-hub.com.
Log in with your username and password. For this, the username will be the app code.
After you log in, you will see two (2) tabs on the left navigation panel, one (1) main page, and one (1) floating bar on the right side of the page. The two tabs on the left navigation panel are Manage and Edit.
We will do a separate video to explain about each of the tabs later.
The first tab in navigation panel is Manage. This is where you can manage your app with provided tools like to see the Overview of the app, analyze Analytics report and setup Push Notifications of the app.
The second tab is Edit. Inside the Edit tab, you will see three (3) main tools to develop your app. There are Design, Build and Publish.
Design is where you create the appearance of your apps including Home Screen, Navigation Button and Screen Styling. You can do the setup your mobile app’s colors, layouts, positioning of the buttons, and anything regarding the appearance of the app.
Then inside the Build page, you will see that all the Features you’ve created are here. They will appear as tabs in you app. Here, you can edit each function and Content of each Feature by clicking their tab names. Here you can create as many Feature as you would like to create in the app. We will go through that in part 2 of this training video.
Lastly, Publish. This is where you put all the information of your app which includes the App Icon, app name, app description, app keywords and so on. I will explain this in the part 5 of this training video.
At the bottom of the left navigation panel, you will see Settings. In Settings page there are three (3) tabs to setup your app. They are General, App Screens and Members & Groups. Each tab has its own usage which can be setup easily based on your purpose.
In top right of the main page, you will see your Ask Alvin Mobile App user name. You may navigate to the user menu to find your Account page or just to log out your session. In User Account page, you may update your avatar, password, and so on. Don’t forget to click Save after you make the changes.
Mobile App Walkthrough 2/5
We will focus on Build menu under Edit tab at the right control panel in this video.
You will see that I’ve created few tabs or Features. If you want to create new tab for New Feature, just click Add Feature then this window will appear. You will see that we have quite few Default Feature function here. If you click on the selected Feature, the platform will show you the outline interface and explanation of selected Feature.
Around Us is for displaying multiple branches or locations of a business. You can use this Around Us Feature in tab to create maps.
Call Us is very useful feature that allows your users to quickly call you at the tap of a finger.
Car Finder allows users to drop pins when they park so never lose track again. They can also set timers, reminder or share the location via email or text.
Contact is for you to create a contact page of your app and make a button to call your business or service phone number. There’s also a map on how to guide the app user to the business location.
Direction View is guides the user to your business location using the phone’s map function.
Email Form is an email contact form.
Email Photo allows users to take photos with the app and submit it to you.
There are 2 versions of the Events Feature. 1) Events 2) Events Version 2
Events is to engage your users by add upcoming & pas events.
Events V2 is the upgraded version of the old Events feature with more option and natively functional.
Fan Wall is for customer testimonials.
Fan Wall V2 is the upgrade version of old Fan Wall feature with more option and natively functional.
Food Ordering allows you to let your customers order their food on the mobile app.
Golf Course is most relevant for golf courses and allows users to track their scores.
GPS Coupon has been merged into our Loyalty Feature, more flexibility and customization, not to mention an all new design.
Image Gallery functions as a photo gallery or a photo album. You can create a custom gallery or integrated with Flicker, Picasa or Instagram to pull in existing galleries.
Image Gallery Tab functions as a photo gallery or a photo album.
We have 1, 2, 3 Tier Info for you to put insert in images and text.
Loyalty allows you to issue stamps to users. They can redeem gifts later on. Advance Loyalties feature also available for greater customization and more user engagement.
Mailing List allows users to input their email address for future email newsletters.
Menu is essentially identical to the Info feature (3-Tier) with specify a price for each item can be added.
Merchandise Feature is for e-commerce.
Messages store all the past push notifications that you have sent to the app.
Mortgage Calculator is to compute the mortgage installments.
Music is great way to share and sell tracks. You can import, upload or link to music files to integrate them with in the app.
News allows you to display news from multiple sources.
Notepad offers your users an easy way to save notes within your app.
PDF allows you to upload PDF files. Commonly used to showcase flyers, menus and even reports.
We have also Podcast Feature.
QR Coupons has been merged into our loyalty Feature.
QR Scanner is useful tools that can scan any QR code your users come upon.
Real Estate allows you to upload property listings.
Reservation allows users to make reservations at your business.
RSS Feed allows you to pull in RSS feeds from other sources.
Sport Stats allows you to include a flexible counter inside your app.
Tell Friend is great marketing tools that banks on word of mouth .
Tip Calculator allows users to calculate the Tip amount.
Voice Recording allows your users to record and send voice notes straight to your business.
Walkthrough is an excellent way to give IOS users a sneak peak into your app’s features.
Web Site allows you to embed any website into the mobile app. This works best with a mobile responsive website.
WuFoo Form is a third party form builder. The WuFoo feature allows you to embed in Wufoo forms into your mobile app. You can create an account at Wufoo and link the form into your mobile app here.
Youtube Channel is to connect your app to your Youtube Channel if you have one.
So, choose the feature and click Select to pick Feature. Put Screen/Feature Name and click Add to add Feature to tab. Or Cancel to cancel Add Feature and go back to Build page.
Basically, each tab feature has main setup menu. They are Content and Custom Design. Different feature provides different option.
In Content, under Screen Info you can name your Screen/Feature. You can name it according to your preferences, for example Contact Us, Find Us, Company Profile, and so on.
You can set your Feature Icon by click Edit button, and choose the icon from Library or Upload your custom icon. The dimension is 140×140 pixels.
As different Feature provides unique settings, usually you can find it below Screen Info setup. Hover on information icon to see what this setting use for. Toggle the button ON to activate this option. Then always click Save every time you make a change.
To activate the Feature, toggle the button ON. To deactivate the Feature, toggle it OFF. Inactive Features will be moved below Modify More Menu at the bottom. To activate inactive Feature, toggle it ON, it will be moved up to the Active Features area.
Next, if you would like to delete a Feature, make sure a Feature is inactive. Hover Feature you want to delete then click Delete icon right after Feature Name. Click Delete to remove the following feature. Otherwise click Cancel to go back to Build page without remove the following Feature. Maybe you accidently click Delete icon.
Rather than delete Feature, deactivate Feature is useful to keep your old Feature with its own setup and can be used for next purpose. Let’s say you run a promotion but you already past the due date and you don’t want to delete the tab because you want to use it in the future.
Ordering active Features is easy. Just hover the Feature you want to reorder, click here, hold and move to new position then release it.
Mobile App Walkthrough 3/5
We will focus on Feature Setup Menu in this video.
This setup menu allows you to edit the Content, Custom Design or any available setting of each Feature.
I will run through some of the basic Feature on how to edit its Content.
The first one is Contact Feature. This Feature is for you to put in contact information should the user want to contact you or the business.
To start, click Add Feature, choose Contact, Select. Then choose the proper Name to easily recognized then click Add. Here you may change your Screen / Feature Name also Add Feature Icon.
At the moment, we haven’t added any location or person for our user just yet. Click Add Contact.
You can choose Business Location or Directory/Person. Take note that you can add a multiple location just in case you have multiple branches or outlets. For example we choose Location. Then click Next.
Here you still can change Feature type from Location that we chose before to Directory/Person. Different type gives different setup option. Keep in Location type.
You can type Address here and Google Map will find the location automatically. Latitude and Longitude detail filled in when address found. You can change from Kilometer to Mile.
This function is to make it easier when the user would like to use Loyalty Feature that requires GPS for Validation. If you don’t do anything to set this up, then you’ll not be able to use Loyalty Feature that requires GPS for Validation.
Choose Show Images OFF or ON. This image will be put on the map. If you set Show Images ON, you have to upload the images that represent your location. Left image and right image.
You can choose images from Library. Category image available for you to choose. Or upload your image. For the dimension, you can just move your pointer over here and you can just Drag Here the image or Browse to upload your image.
This image may have a Link. Linked to current Feature or Hyperlink URL.
You can add Custom Location Name up to two lines then you can add your website, email, telephone and Add Opening Times.
Then the next step is the Info 1 Tier Feature. Once you Add Feature, then you go in and you will see all of these setting. This one is good for company profile, vision mission statement, terms and conditions for the app.
You can just put that text and images here, you can upload the header image for phone and tablet.
Again the resolution, you can just hover your pointer to the icon here and after that, you can click save for any changes.
The next one Email Photo Feature. This one is good for photo contest, reporting product defects.
Let’s say you have a car, you can also use this feature to sell used cars. Just put the description and send a photo of your cars that you want to sell.
You can also put your sales or business email. Any photo that is taken from this app will be sent to the email that you have provided.
For the subject, you can just put a general one so when you received an email, you will know what is the email is about.
Next is Email Forms Feature, this one is good for enquiry form, surveys and registration form.
Let’s say you would like to create a New Email Form, you can click here.
Then it will direct you to this pop up box which we have ‘Add a field’, ‘Field Properties’ , ‘Form Properties’ and ‘Theme’
Under the ‘Add a Field’, you can add a field you would like to display. For example, Single Line Text, Number, Paragraph Text, Checkboxes, or maybe Drop Down or anything.
Just click, drag and drop Single Line Text field here. Then after add a single line text field, you can edit the field properties. So if you like to edit the Field Properties, just click the field then label it accordingly.
You can also choose whether you would like to make the field required or not, then click Add Another Field.
Once done, if you already have the field for name, email, phone number and enquiries, click on the Form Properties, here you must change the email to which email address you would like this information to be sent every time the user fill up the form.
Here is where you can put the Email Subject.
You will also see the Form Title and Description that will appear here.
Success message will appear once the User manage to submit the enquiry form.
Error Message will appear if the user didn’t manage to submit the form.
Then you can change the Submit Button Label and back button label.
Then make sure that the form is active.
The next one is Website Feature. This one is good to link your website/social media or any third party page is mobile friendly. So if you have a third party app and you have the URL, you can just paste it here.
So Add Feature, choose Web Site, click Select. Add name then Add Web View, you can name it accordingly and paste the URL here.
Then toggle button ON 3 option accordingly, Donations, Allow Printing or Safari Webview.
You can also upload a thumbnail of this website tab by clicking the ‘Add.
Once everything ok, click Add.
Toggle Navigation Bar ON if you want to show navigation bar at the bottom of this Feature. Click Save to keep your changes.
Then if you want this message to appear whenever the user open the app, just toggle ON ‘Prompt Option’.
After that, you can upload an image that as Thumbnail that will appear on the mailing list form by clicking Add.
When you’re done, just click Save.
Next is Image Gallery Feature. We have our custom image gallery but you can also connect to your Flickr, Picasa or Instagram account if you like to do so.
One Feature Tab can only have one image service but let’s say you’d like to another Feature for Instagram then one more Feature for custom gallery. Just create two different image gallery feature then you can just edit accordingly or connect accordingly.
For custom image gallery, let’s say you would like to upload photo, you can just click ‘Customize Your Own Image Gallery’, and click “Add New Gallery”
It’s like creating new album on facebook. Put on the album name and thumbnail image.
You can also choose whether you want it to be Grid or Cover Flow and whether you want to put captions or not for the photo.
Upload the images by click here and Add when you’re done. Save changes.
Then we continue with Message Feature, so basically no set up needed here because this feature is just a storage of past push notification that you sent from your app.
But you do have customize settings on whether you want to hide this message tab or you want to create shortcut to this tab on the Homescreen of your app.
And if you would like to enable subscription for push note service, just toggle from here and Save Changes.
And since you are here, I would like to run through the Push Notification from your app.
I believe you all know what a Push Notification is. It’s just a message that pop up on your home screen if the user choose to enable this function.
To send a push notification, go to Manage Tab at the left side bar, you will see ‘Push Notifications’. Just click it then Push Notifications page will appear.
First you need to go to Message then you need to choose whether you want to send to Android and Apple User or just any of this. Put your message over here. We also have a preview right here so this is how it look like on your user’s point.
Then for Location, we have two options, specific area users and all users. For all users, it will be sent out to all of the people who downloaded your app. For specific area users, it will only apply if you fill in the information on your contact tab about the coordinate of your business location.
You can also put the address and the radius. Let’s say you want to people within 16 kilometers radius from your business service, just put the information here.
Again, specific area users only applicable only when the app user turns their GPS/location function.
Then for content, if you choose none, it will just show the message that you put on the first step.
If you choose website URL, you just need to copy the URL and it will direct the users to the URL once they open the push notification.
Link To A Specific Feature tab within the app is also possible.
Or choose from our Offers.
We can choose to send it now or to schedule it on a particular date.
When you’re done, Send Message.
You can see and manage Scheduled and Send Messages by click here.
Mobile App Walkthrough 4/5
On the Design stage you can manage the appearance of your apps.
We have setting for Home Screen, Navigation Buttons and Screen Styling.
Home screen is for the settings for all the elements of your app home screen.
Home navigation layout can be Bottom Row, Top Row, Slide Columns or Sliding.
You can set the buttons on bottom, top, left or right.
You can also set on how many buttons you want to show on your home screen and show more buttons by Swiping or More Menu.
You can also use the extra buttons, “Call us”, “Direction” and “Tell friend”, available for Bottom Row and Sliding Navigation Type.
Add Shortcut if you want to display larger button on your home screen that serve as a shortcut to your features. Here, you can set whether you want to show the status bar or not.
Status Bar is the bar that shows the battery level and the signal.
Add Branding to upload your company logo or banner image.
Home Screen Background is to set home screen color and background image. Blur Effect is to set your home screen to have blur effect.
We have phone and tablet here and if you see the device classification phone is for iPhone 4 and up and for all Android and the Tablet is for iPad and all the tablets.
If you want to follow the tablet device to follow the phone setting, you can just toggle ON Use Phone Settings option. It’s less troublesome and you don’t need to do extra work when you want to change the background because once you change on phone it will change on tablet as well.
You can use the image from our gallery or you can upload your own.
Let’s say, you want to use this image, just choose the image then click Select button here.
If you would like upload the image just drag image here or click browse here and they have recommended size format for the image.
You can also able see preview of the image from the right side bar.
Animate Images is to create Image Transition between two or more images. You can use Library or Your Images and choose transition type accordingly.
Manual swipe means you swipe it manually.
Sliding means images slide automatically.
Fade means image fade into next image
Parallax and Ken Burns, it’s up to you whether you want to apply that.
Let’s say I want to assign this as my background image. I just need to drag this image to here.
I can remove current background image by click Delete icon here.
So as you can see the image already become the background and all the buttons is here.
Each image can be linked to active Feature.
Don’t forget to click Save.
In Navigation Buttons, you may Show Icon or Show Text and custom their Color.
Here, Screen Styling, we provide Color Scheme template for your app. Also you can choose Customize if you want to custom the scheme.
Header Background is whether you like to have header on the top. You can also able to upload header from here.
Header and Toolbar Color, Header Text and Toolbar Icon Color and Header Text Shadow Color are the custom color you choose for each of their setting.
Global Screen Background sets screen background color and background image. You can use library or upload your image and apply blur effect. Use Phone Settings allows you to use settings from phone section.
For Font, you can choose which one you like to use.
Then if you like to change Text Color, you can also do it here.
List is to customize the color of your list, so that’s how it works.
You can customize the Section Bar, The Odd Row and The Even Row accordingly.
For Buttons, you can also choose whether you want to put Text Color or Background Color on your buttons.
That’s how you update the appearance of your mobile app.
Mobile App Walkthrough 5/5
Now, when your app is ready, its time to Publish your app.
Go to Edit Tab and click Publish, which the last step on app set up.
Make sure you already put all the information here before you submit for publishing.
On publish step, you will see the fields to put the App Icon, App Name, App keywords and so on.
App Icon is the icon that will show on user’s phones and in the App Store/Marketplace.
You will need to come up with an App Icon with the dimension of 1024×1024 pixels in PNG format.
Just click the Add button over here. If you haven’t upload any icon just upload it from your computer then the icon will appear here. Or you may choose from Library.
App name is how you would like your app name to appear on iTunes and Google Play. For example, Ask Alvin Support.
App keywords is those keywords you’d like to use to direct users to your app page on App store or Google Play. Make sure you choose the keywords that is unique and relevant to your app. For example is your brand name, business name, or service name.
For App icon name, we have a limitation that it can’t exceed 12 characters because it’s the name that will appear below the icon. Make sure that it is below 12 characters as it’s the requirements of the iTunes and Google Play store.
App description, you can put greetings to encourage the user to install your app. You can also put what are the functions you have inside the app.
You can put more details of the functions here on the App Store update information.
Example is 24-hrs access to your client support account, View/edit and open support ticket.
And any other functions that you would like to put there.
Minimum, you have to list 4 functions.
Put Contact Email here where you can be contacted.
Put the Phone Number and your Official Website.
For Copyright, you can just put your company name and the year you publish the app.
App Category, just choose business.
App Price, just choose free.
Then for the Loading Screen, you need to upload loading screen for Mobile and Tablet. Just click each of the menu here.
For Mobile phone, the dimension is 640×1136 pixels in PNG format. It can be something that has your logo, your app name or maybe just put “Loading Please Wait”.
This loading screen will appear once the user open the app and before the app is fully loaded.
Please upload for Mobile and Tablet.
Apple Store Rating. Here you don’t need to change any setup. Leave them to None.
Last one is Screenshots step we have few types of phone and tablet which you need to upload the screenshots. iPhone5, iPhone6, iPhone6+ and Tablet.
You can take screenshots on your own using your phone or tablet and upload it to the platform by clicking on the select button but you can also generate from the platform by clicking the Generate Screenshots button.
Normally, what we generate is the Home Screen, More Menu and The First App Tab.
By the way, for the screenshots, make sure you upload different screenshots for each of the device dimension. Let’s say for iPhone5, you upload the screenshots and for Tablet, you upload screenshots, just don’t upload the same tab screenshots.
Now your app is ready to be published. But you can not publish on your own.
Please inform us your app code at firstname.lastname@example.org
We are only able to publish your app once the full payment is received by our finance department.
So before you publish, make sure that the all the payment has been settled.
Any changes you make within steps 1-3 which is the Build Feature, Custom Content and Design will automatically be reflected on the live app so there will be no delay but the user just needs to reopen the app.
However, for the step 4, any information publish under the step 4 which is ‘Publish’ cannot be changed once you already published your app.
So again, please make sure that all your details/information in the step 4 is correct and will not require any changes.