Welcome to your new app! After the initial setup process, making changes to your app is as easy as editing content in any other module. This article will walk you through what you need to do to get your app up and running and onto the Apple App Store and the Google Play Store.
Before you begin
The iOS/Android app works with the newest Finalsite modules, Messages and Resources. Messages is required to send push notifications, and Resources is necessary for displaying your header and other images. Before construction of your app can start, these modules must be enabled on your site.
If you have not already done so, please refer to the Self-Enabling Messages Guide and the Enabling Resources Guide to complete that process. Don’t worry, you can still use eNotify and File Manager for other things, if you prefer.
Step 1: Complete the survey
As you embark on the app-development journey, your project team will provide you with a survey form to fill out so that they can perform the initial build of your app. Following are some of the details you’ll be asked to provide.
The name of your app is what will appear in the app stores. It should be a short name that easily identifies the app as belonging to your organization.
This short name displays under your app’s icon on the user's devices. Because of space constraints, it should be limited to 12 to 14 characters, depending on the width of individual letters in the name.
Note: If the display name is too long, any spaces will be removed and an ellipsis will be added to replace the overflow text.
The app header is a wide but short area that consists of a logo on a dark background.
The app header logo should be a horizontal logo that can be used on a dark background.
Vector (.eps, .ai, .svg) artwork is preferred, or a .png file with a transparent background that is at least 160 pixels tall.
Note: The logo on your website may not be large enough. Please double-check the dimensions before submitting.
Please provide the hex code of the color you would like to use as the header background.
This color will also be used as the font color elsewhere on the app, so it needs to be dark enough to be legible on a white background.
If you do not know the hex code for the color you’d like to use, you may be able to find it on the Style Guide pages in the Production branch of your site. If you are still unable to locate the code, you may also provide an example of where the color is located on your site.
App icon and loading screen
The app icon and loading screen will share an icon and background color.
The app icon is a square icon that will be used with a solid color background.
Vector (.eps, .ai, .svg) artwork is preferred, or a .png file with a transparent background that is at least 1024 pixels square.
Please provide the hex code of the color you’d like to use as the app icon background, or the location of the color on your site. This can be any color, light or dark, as long as it works behind the icon.
It is also required to include a link to a page on your website where app users can get in touch with you if they require help using your app. This page will be linked in your app’s page in the app stores under “App Support” and will also appear as the "Contact Us" link on the app's More screen.
We suggest that this link go to a page on your website with a form on it. This form should include at least two required fields: a text area field for users to describe what assistance they’re looking for and an email address field so that you can contact them later.
In addition to the support URL, Google requires a support email address for the app. Please provide an email address that app users can use to get help from your organization.
The app can be set up to allow for user login to access private content categories, such as directory information. Constituents can log in using the same credentials they would use to log into their portal accounts on your website.
Home screen content
In the initial app setup, we’ll configure the app home screen to show a posts slideshow and calendar list. Although these can be changed later in the process (and even after you deploy the app), please provide one or more Posts boards and Calendar Manager calendars to use as demo content.
Note: For best results, the posts on the board you supply should have thumbnail images.
Step 2: Select your content
After you submit the survey form and our team completes the initial build of your app, you’ll be given access to the app settings in the Mobile Apps module. Now it’s time to configure your content.
The home screen of your app has a section for Posts and a section for events.
Choose the Posts collection, board, or boards you want to display on the home screen, and decide whether to display them as a poster image (slideshow) or a list.
Choose the calendar(s) you want to display from Calendar Manager, ensuring that at least one is set to public in the “LMS/App Availability” section of the Calendar Settings screen.
For more information, see Mobile app Home screen.
Your main app content comes directly from the content that you’re already displaying on your website, whether it’s from Posts, Resources, Calendar Manager, Athletics Manager, or Constituent Manager. You can also add custom links that go to your website, your LMS, or other helpful locations.
Click on the edit pencil icon next to the section name to edit the label, the content, and the menu icon. A variety of icons is available, but new icons cannot be added.
Note: If you do not want to include any of this content in your app, simply do not select anything for that section. The icon will not appear in the navigation.
Drag and drop the gray bars for each section to reorder the sections in your navigation. The first three icons will appear in the bottom navigation, while the rest will appear in the “More” menu.
The Posts section displays a list of posts from the board(s) you select. See Mobile app Posts screen for more details and best practices.
Display public or private Resources galleries on this tab and allow users to view and share files. See Mobile app Resources screen for more details and best practices.
Select the calendars from Calendar Manager that you wish to display in the app on the Events tab. See Mobile app Events screen for more details and best practices.
Choose teams from the dropdown menu to display a list of athletic events in the app. See Mobile app Athletics screen for more details and best practices.
A constituent directory may be included in your app content. Select the role or roles you want to appear in the directory from the checklist, then use the radio buttons and dropdown menu to determine who each role will be visible to. See Mobile app Directory screen for more details and best practices.
Note: Privacy settings for the directory will follow those set in the Constituent Manager Settings section. Before you make your constituent information available to the public, please check these settings to ensure their privacy is respected.
Click “Add Custom Link” to place an external link in the application that will open in the mobile device’s web browser. These may be external links, such as social media sites, or internal site pages. Enter the label and the full web URL, including https://, for the link you want to create. See Mobile app custom links for more details and best practices.
Custom links may be deleted using the trashcan icon next to the link label.
Step 3: Test your app
If you have an iOS device, you will be able to see your content live on the app before the app is actually live, using an app called Testflight. You will receive a link from your project team to access your app using test flight, and up to five users can download the test app to their iOS device.
Changes you make to your app on the Mobile Apps module, or in any of the content areas linked to the app, will be reflected as soon as the app is refreshed.
Step 4: Deploy your app
Once you are ready to roll out your app to the public, it’s time to submit it to the app stores for approval. Your project team will take care of most of this process for you, but you will need to supply some information.
App store information
The project team will send you another survey form, which asks how you want the app to be described and catalogued in the app stores. If you’ve never thought about this before, that’s OK! You can use the examples provided in the form and customize them to apply to your app.
App store description
This text is displayed as the main app description in each app store. Users who browse to your app will read this to understand what the app will do for them.
This text is displayed as a quick summary of the app. It is only used in the Google Play store. There is a strict 80-character limit for this description.
Keywords are used behind the scenes to help users find your app. Think of a few keywords that may help users search for your app. Your keywords can be up to 100 characters total.
iOS Developer account
To submit the app to the Apple App Store, you'll need to create an iOS Developer account with Apple. Instructions for how to do so are available at Set up an iOS Developer account.
If login is enabled, we’ll need to provide a username and password when submitting the app for approval to Apple/Google. To allow Apple & Google to review the app, Finalsite will create a hidden account on your site. This user will not be visible on your website.