Your branded app is an extension of your business, and customizing its screens ensures a seamless, engaging user experience. Whether you’re adding a new onboarding page, a custom dashboard, or a feature-specific screen, this guide will walk you through the process.
In this article:
- What screens can I create?
- Add a new screen
- Creating "other" screens
- Customize your screen
- Customizing your navigation
What screens can I create?
In your branded app, screens function as individual pages that display content, guide users, or provide interactive features. By creating and customizing new screens, you can enhance navigation, showcase products, and offer unique experiences tailored to your audience.
What screens can you create? Here are just a few ideas to get you started!
- Home Screen: Use your app home screen to welcome members and visitors to your app, highlight and recommend courses, provide valuable information about your business, and more!
- Custom Product Offering Pages: Showcase your Products and Services in a custom page.
- Introductions/About You: Create a personalized custom page that highlights who you are and your mission.
- Additional Resources: Provide information and resources to assist your customers as they engage with your business.
By leveraging custom screens, you can tailor your app experience to better serve your audience, improve engagement, and enhance usability.
Add a new screen
To create a new screen:
- Select Branded Mobile App from your Kajabi dashboard.
You should see your app Design settings if you’ve fully completed your app setup. - Select the Design tab.
- Click Customize.
- Click Screens to view existing screens and create new ones.
- Select + New screen.
- Enter the title of your screen.
- Select the ion to display for your screen.
- Then, click Save & Publish:
Your newly created screen will initially display an "Add Widgets" button to get you started with building out your custom screen.
Creating "other" screens
In addition to your main screens, you can create "other" screens that serve as hidden or future-use pages within your branded app. These screens can be used in a variety of ways, such as building out content that you plan to release later or creating dedicated spaces that aren't directly accessible through your app’s main navigation.
To create an "other" screen, follow the same process as you would for creating a new screen, then move the screen under the "Other screens" section:
Here’s how you can use “other” screens effectively:
-
Create Hidden Landing Pages: Build a landing page that’s only accessible via a button link. Once the user clicks the button, they’ll be directed to this screen, offering them a unique experience that isn’t visible from the app’s main navigation.
-
Add Widgets to Other Screens: You can customize these other screens with all the available widgets (like images or buttons). Use these screens to showcase specific promotions or custom offers, and point users to them via strategically placed buttons or actions.
-
Utilize "Other" Screens as Lead Magnets: Create screens that provide value, such as free previews or exclusive content, and direct users to them through button links or gallery widget actions. This approach allows you to capture leads or create engagement without making the content permanently visible in the app’s navigation.
-
Future Content Planning: If you're preparing new screens, you can start building the content on “other” screens now and then move them to the main navigation once you’re ready to launch.
By using "other" screens strategically, you can expand the flexibility and functionality of your app, enabling you to test, plan, and offer customized content at your own pace while keeping the user experience smooth and engaging.
Customize your screen
Customizing Your Screen
Once you've created a new screen, customize it with widgets to enhance its functionality.
Available Screen Widgets
Product Widget: Display featured courses, community access, or digital products.
Button Widget: Add call-to-action buttons that direct users to other screens, websites, or resources.
Image Widget: Upload visuals that can be static or linked to additional content.
Gallery Widget: Showcase multiple images in a slideshow or grid format.
Text Widget: Insert text sections for descriptions, welcome messages, or important announcements.
Video Widget: Embed videos with customizable preview images to engage users.
Editing Screen Content
To modify an existing screen:
- Select the Screen you want to edit from the Screens tab.
- Click Add Widgets to open the editor.
- Add or adjust widgets by dragging and dropping them onto the screen layout.
- Configure each widget by updating text, images, links, or videos as needed.
- Click Save & Publish to make your changes live in the app:
Reordering and Managing Screens
Reorder Screens
Drag and drop screens in the dashboard to adjust their order. This determines how they appear in the app’s navigation:
Delete Screens
Click the "X" icon next to a screen to remove it from your app:
Duplicate Screens
If you need a similar layout for another purpose, use the Duplicate option to create a copy:
Customizing your navigation
Change the order of your bottom navigation tabs, customize the navigation names and icons, and customize the screens displayed in your navigation tabs.
To reorder your navigation tabs:
- Select Branded Mobile App from your Kajabi dashboard.
You should see your app Design settings if you’ve fully completed your app setup. - Select the Design tab.
- Click Customize.
- Select the Screens tab from the top-left corner.
- Then, under Navigation Menu drag and drop the screens that you want to be displayed in your bottom navigation tabs.
- Click Save & Publish to make your changes live in the app:
To rename and customize the icon for your navigation tabs on the page editor:
- Select Branded Mobile App from your Kajabi dashboard.
You should see your app Design settings if you’ve fully completed your app setup. - Select the Design tab.
- Click Customize.
- Select the Screens tab from the top-left corner.
- Then, under Navigation Menu select the screen you want to customize.
- On the right, you can enter your custom Tab Title and select your desired icon from Kajabi's icon library:
And that’s how you can create additional screens in your Branded Mobile App! Please vote below and let us know if you found this article helpful. We value your feedback. Thanks for being the best part of Kajabi!