Set up the selection screen of the mobile app

Tip! Changes in the selection screen are directly updated on the app, there is no release button. To see changes in the app simply restart the app or swipe down the selection screen.

Edit Society App colours

To edit the colours of the society app home screen, click Colours at the top right of the Home screen layout section. 

The following can be customised:

  • App bar: this is the title bar containing the app name. You might want this bar to be your branding colour.

  • Background: this is the background colour behind the tiles. Choose a neutral colour that matches the event tile background.

  • Event tile background: event tiles have a section that displays the event title and subtitle. This sets the background colour of these tiles.

  • Event tile text: this sets the text colour in the event tile section described above. Make sure you choose a colour that has enough contrast with the event tile background: a dark colour there means a light one here and vice versa.

  • Contrast colour: this is the colour of the buttons on the event info page in the app, for example, Install or Open.

The changes can immediately be seen in the preview. After clicking Save, app users will also see the new colours directly. You do not need to create an app update or release.

Add an event tile

Read this article about how to add an event.

Add an info page

To add an info page tile, click the button Add tile at the top left and choose Info Page. In the page that opens, you can set the details of the tile. After entering the data, click Save to create the tile. 

Status

  • Available/Hidden: if set to Available, all users can see the tile on the selection screen. If set to Hidden, the tile is not visible there.

  • Page can be accessed by: here you can choose between Anyone, Signed-in users only or any of the groups you defined in your community. If set to Available, the tile itself is visible to all users, but only the users that match the criteria will be able to see the tile content when opening it.

Tile data

  • Name: this is the name that will be displayed above the page in the app bar.

  • Edit content: here you can enter the text that will be visible on the page. You can add all kinds of formatting, or even add custom HTML after clicking < />.

  • Link to URL: instead of adding content, you can also link to an existing URL. Default, the URL will open within the app. If for some reason you want to open the link in the external browser, add ?openlinkType=external to the URL.

Tile size

For info tiles, you can choose three sizes: small, medium or large.

Only the image of the selected tile size is required. The rest is optional but might come in handy when you decide to change the tile size later. 

When clicking Add image, a modal opens where you can select the image to upload. The preferred dimensions are shown in the placeholder. When your file does not have the preferred dimensions, you can crop it to the right ratio after selecting it.

Add topical chat

Topical chats are available in society apps and allow app users to chat with each other on an app-wide level, regardless of the event attended. This type of chat can be switched on by adding a tile. 

On the selection screen page, click Add tile and choose Chat from the dropdown menu. As you can only have one topical chat tile, this option disappears from the menu once the tile has been created. In the page that opens, you can set the topics.

Status

  • Available/Hidden: if set to Available, all users can see the tile on the selection screen. If set to Hidden, the tile is not visible there.

  • Page can be accessed by: here you can choose between Anyone, Signed-in users only or any of the groups you defined in your community. The tile is visible to all users (if set to Available), but only the users that match the criteria will be able to see the tile content when opening it.

Chat tile data

  • Name: this is the name that will be displayed above the page in the app bar.

  • Introduction text: here you can add a text of max of 100 characters, which is shown above the topic list. Use this text to explain to your users what they can do within this chat.

  • Topics: here you can define the topics you want to allow your users to chat about. You can add a name and a subtitle for each topic. The order can be changed by dragging them with the arrow on the left. You can delete a topic by clicking the trashcan icon. Please note that when you delete a topic, the existing conversation will remain visible to users that already participated, but new messages can no longer be sent.

Tile size

Just like for info tiles, you can choose three sizes: small, medium or large.

Only the image of the selected tile size is required. The rest is optional but might come in handy when you decide to change the tile size later. 

When clicking Add image, a modal opens where you can select the image to upload. The preferred dimensions are shown in the placeholder. When your file doesn't have the preferred dimensions, you can crop it to the right ratio after selecting it

Add a news tile

To add a news overview tile, click the button Add tile at the top left and choose News. As you can only have one news tile, this option disappears from the menu once the tile has been created. In the page that opens, you can set the details of the page. When you add a news message on app level, it will automatically appear on this page.

Status

  • Available: all users can view the tile and its contents.

  • Hidden: the tile is not visible on the society home screen.

Tile data

  • Name: this is the name that will be displayed above the page in the app bar.

Tile size

For news tiles, you can choose three sizes: small, medium or large.

Only the image of the selected tile size is required. The rest is optional but might come in handy when you decide to change the tile size later. 

When clicking Add image, a modal opens where you can select the image to upload. The preferred dimensions are shown in the placeholder. When your file doesn't have the preferred dimensions, you can crop it to the right ratio after selecting it.

Organise tiles

The preview represents the way the app will look on different devices and orientations: mobile portrait (2 columns), phone landscape/tablet portrait (3 columns) and tablet landscape (4 columns). 

Tip! When creating a new tile, make sure to organise your tiles on all three pages and save these layouts, otherwise, the tiles will appear in the order you created them. After saving, users of the app will directly see the new layout, you do not need to create an app update or release for that.

Set app name

Above the tiles, you can set the name of your app. Clicking the pencil icon will make the title editable. After making changes, click the checkmark to save them. Users of the app will directly see the new name. The colour of the app bar can be set below the Colours button.

Move tiles

You can move tiles around on the preview by keeping down your mouse button on the selected tile and dragging it to the desired position. The rest of the tiles will automatically move along.

Resize tiles

You can resize tiles in two ways.

  • by clicking and dragging the bottom-right corner.

  • by editing the tile info and changing the tile size.

In both cases, make sure that the artwork of the selected size is added and that you check and save the position of the tiles on all three layouts.

Hide tiles

Hiding tiles can also be done in two ways:

  • by clicking the green pencil icon top right and selecting Hide.

  • by editing the tile info and setting the Status to Hidden.

As a result of hiding a tile, other tiles might have been moved. Make sure to check the tiles on all three layouts and save your configuration.