¶ Creating and Customizing The Membership App
Creating and Customizing the Membership App
This Article discusses the Membership Learner App, which can be customized to provide your members a great, portable membership experience!
What Are Progressive Web Apps?
Progressive Web Apps (PWAs) are web applications designed to provide a user experience similar to native apps on Android or iOS. They combine the best features of web and mobile apps to deliver a seamless experience.
¶ Part 1:
¶ Step One: Access
-
Start by navigating to Memberships on the left > Courses at the top > From the dropdown select Settings.
-
Once in Settings, Select “App Settings”.
- Under app settings, set up your branded PWA (Progressive Web Application), which your learners/members can install.
- PWA can be installed on both Desktop and Mobile. This improves speed for your users.
¶ Step Two: Customization
- Name your App
- Select an Icon
Please Note:
We have no control over which image the device OS populates, but we have provided these two options to make the decision more accessible for the OS in the backend. Chrome automatically scales the icon for the device.
Supported file formats for icon images are JPEG and PNG(PNG is recommended for Android Apps).
File Size should not be an issue here if the device accepts it.
- Choose App Colors
Please Note: You are limited to the color options available now. Custom Colors are unavailable (nor advised) as they can break your app’s visual design.
- Save and Enjoy!
Creating and customizing a membership app for your needs is as easy as that.
Supported Operating Systems and Browsers for PWAs
Progressive Web Apps (PWAs) are compatible with various operating systems and browsers. Here’s a summary of current support:
- Mac : Chrome 45 and above
- Windows : Chrome 45 and above, Brave (latest version)
- Android : Chrome (Push Notifications supported)
- iOS : Safari 11.3 and above (Push Notifications not supported)
¶ Part 2: Downloading the App
¶ For Android: Progressive Web Applications are only supported on a Chrome browser on an Android device. You can install them by Adding the PWA to your Home Screen from your Chrome browser.
For an iOS Mobile Device: On an iOS Mobile device, only Safari (versions 11.3+) is supported for PWA. On your iPhone/iPad, open Safari and open the memberships website.
For Windows:
For Mac: Progressive Web Applications are only supported on a Chrome browser on a Mac device.
Depending on your Chrome download preferences, your WPA will be downloaded to your Chrome apps dashboard or to your Mac Desktop.
FAQs
Question: What are Progressive Web Apps (PWAs)?**
**Answer: PWAs are web applications that offer a user experience similar to native apps on mobile devices. They combine the benefits of web and mobile apps to provide a seamless, portable experience. PWAs can be installed on both desktop and mobile devices.
Question: How do I customize my PWA?**
**Answer: To customize your PWA, navigate to Membership > Courses > Settings and select “App Settings.” Here, you can name your app, choose an icon (JPEG or PNG), and select app colors. Note that custom colors are not advised as they may disrupt the app’s design.
Question: Which browsers and operating systems support PWAs?**
**Answer:
- Mac: Chrome 45 and above
- Windows: Chrome 45 and above, Brave (latest version)
- Android: Chrome (Push Notifications supported)
- iOS: Safari 11.3 and above (Push Notifications not supported)
Question: How can I download and install a PWA?
Answer:
- Android: Use Chrome to add the PWA to your Home Screen.
- iOS: Use Safari to open the membership website and add it to your Home Screen.
- Windows/Mac: PWAs can be installed via Chrome. On Mac, PWAs may be downloaded to your Chrome apps dashboard or desktop, depending on your Chrome settings.
Question: What are the requirements for the app icon file format and size?
Answer: The app icon file should be either in JPEG or PNG format, with PNG being recommended for Android apps. The file size should not be an issue as long as the device accepts it.
Question: Why does my app icon look slightly different on different devices?**
**Answer: The platform provides two icon options to help the device’s operating system (OS) make the best choice, but the final rendering is controlled by the OS itself. For instance, Chrome automatically scales the icon to fit the specific requirements of the device it is being installed on.
Question: Can my members access course content offline through the app?
Answer: While PWAs are designed for high performance, a stable internet connection is still required to stream videos and load new lesson content. However, the app will load the user interface (the “shell” of the app) much faster than a standard website because it caches the branding and navigation elements locally.