Home Screen

Your Home page is a user's first impression of the app. AppMachine has made styling this screen very easy.

In the Content tab, you can configure the home screen of your app by selecting the Blue Home block in the list of blocks. As the color settings of the homescreen might differ from the generic theme of your app, you see a Design tab on the right side of the screen to configure the colours and styling for the Home screen. If you want to change the styling of the rest of your app, select the green Theme block at the top of the list of blocks.

Your app's blue "Home" block

Navigation styles

Designing a home screen starts with selecting the best Navigation style for your app. Once you've chosen a template and generated your first app, you will see the settings for the blue Home block. This block controls the settings and design of the first screen of your app. In the Settings tab on the right, you can choose a top image, a navigation style, and usually some further styling options depending on the navigation style you've chosen. In the screenshot, you can see which navigation styles we have available in the platform.

See which navigation styles are available in the app.

Run through the available navigation styles to select the style that best fits your app's needs. For the business app above, here are the different navigation styles compared to one another.

New Navigation styles

We have added new navigation styles for NEW apps. With existing apps you will only see the new navigation styles for the Submenu block.

There are five menu types, each with different layouts, and the option to choose no menu layout.

1. Tab bar

2. Tabs

3. Sliding

4. List

5. Icons

You can switch between layouts and choose from different options, like show icons or show block labels. The tab bar layouts also have the option to be detached from the bottom of the screen.

Menu, Text, Icon, & Icon Background Settings

Depending on the selected navigation style, you may be able to further adjust the design of the selected menu. For example for the advanced icon menu you can upload your own icon backgrounds.

Upload you own icon backgrounds

To change the color settings of your icons in the Icons menu, navigate to Settings > Items and change these two settings to your desired colours.

Change the icon and text colors of the Icons menu.

Top Image

Once you've chosen and perfected your navigation style, go ahead and add a top image. A logo for your event or business would do nicely here.

Design

Design settings for your Home block can be changed in the Design tab. Design settings wil differ significantly from those in the rest of your app. If that is the case, this is the section to change those settings. For more information about the general design settings of your app, please read: Theme