The Design step is where you will create a dynamic design for your app home screen, choose the navigation type, and create each feature's styling, such as the color, background image, and font. While you begin the app building process here, you can add or adjust the design as you please after you have moved onto the subsequent steps.
This article provides a basic overview of how to use the Design step and brief descriptions of the available functions.
The following video describes the Design menu in detail:
You can access the Design menu from the BiznessApp CMS, by navigating to Create > Design. The Design menu has three tabs:
You can select one of the following types of layout for the Homescreen:
- Slide Out Menu
- Grid Menu
- Scrolling Menu
- Tab Bar Menu
You can also customize the following according to your app requirements:
Background Color: This is the color below your home screen background image. If a background is not assigned, this color will show.
Branding: You can upload your company logo or branding image.
Homescreen Background: You can upload an image for your home screen background.
Carousel Images: You can upload up to five images.
Sliding View: You can change the Sliding View to List or Grid.
Menu Hint Text: You can use this option to display a text label next to the menu icon.
Additional Buttons: Add the shortcuts if required: Call Us, Directions, or Share.Notes:
- Directions are pulled from what is configured in the Contact Feature.
- These shortcuts are placed on the Home Screen, and only visible if the Slide Out Menu or Tab Bar Menu is used.
Slide Out Menu Tab Bar Menu
Add Shortcuts: You can add shortcuts to features within the app.
iOS Status Bar: This option enables the iOS Status Bar for the home screen only.
Desktop Home Button Text: You can customize the desktop home button that is used to navigate to the Home screen when viewing on a desktop.
The Navigation tab allows you to customize the navigation style. You can:
- Select Icon Color.
- Select the Menu Text Color and Menu Background Color.
- Choose the Homescreen Shortcut Color.
- Enable or disable Button Text and Button Icons.
- Add a Custom Icon Background Image.
Note: If you notice that the navigation icons are not displaying, have a look at the icon, text, and background colors here and they may be the same therefore seems invisible.
The Global Styling tab allows you to customize all the features throughout your app. You can:
- Choose the Main App Color (The primary brand color of your business).
- Choose the UI Bar Text Color.
- Choose the Main Text Color.
- Choose Background Color. This is the color below your global background images. If a background is not assigned, this color will show.
- Select a Font and Font weight.
- Add a Global Screen Background image.
- Add a Header Background image.
Note: All settings in the Global Styling section will apply to all the features throughout your app. If you wish to create a custom design for one of your features, use the Custom Design option in the Build section.