How it works
The Settings Screen is split into two main sections;
- The Account Settings
- The App Settings
If your app uses BBC iD, then you must always include the Account module at the top of this screen. Please see Account in Apps for more information on the account module.
A ‘setting’ is anything that you can ‘set’. The App Settings section should include settings that are only specific to your app. What you include in this section and what features are available in your app is largely up to you.
Some common settings are mandatory, either for legal reasons or from a good UX point of view. If your app has a feature linked to any of the below, you should be able to control it.
|Setting Description||Applicable Settings|
|Control over the text size||Text size|
|Control over data and how or when it's downloaded||Restrict data to Wi-Fi only, Allow downloads, Downloads only, Higher quality downloads|
|Allowing us to see your app statistics||Share statistics|
|Control over the parental lock||Parental lock|
|Control over your notifications||Allow notifications, Notification sounds|
If you have lots of settings, you may wish to break them up into categories to add some structure to your screen. All your settings should be able to fit into the following categories (headings are in priority order):
|Header||When to use||Example|
|Personal||Any personal information not yet captured by Account||Age, Name|
|General||Any settings general to your app||Text size, Change location, Compact layout, Carousels, Widget update frequency, Opt into Beta, Sleep timer/alarm, Temperature unit, Wind speed, Flood alerts, Linked music services|
|Notifications||Control over your notifications||Allow notifications, Notification sounds|
|Data Usage||Control over how data is stored, used and downloaded in your app||Restrict data usage to Wi-Fi, Autoplay media, Background app refresh, Download over Wi-Fi only, Allow downloads, Allow higher quality downloads, Clear search history, Sync images for offline use|
|Security & Privacy||Settings such as parental lock and share statistics||Parental lock, Share statistics|
|Start up Screen||Control over how your start up screen appears||Start up screen appearance|
Toggles and checkboxes
A setting can exist in different states. It can either be on or off, or it can offer a multiple choice.
To make your choice easy, you need a control to adjust the setting. If the setting only has two options (e.g. On or Off) then use a Toggle on iOS and a checkbox on Android.
If the setting offers a multiple choice, use checkboxes on iOS and use a dialog box for Android. That box should contain the options in a list, along with radio buttons.
- GEL recommended font sizes should be used.
- Brand colour should be used on toggles, switches, text boxes and titles.
- A white or black background can be used.
- The headers (Account Settings & App Settings) must be written in capitals on iOS and lowercase (with a captial letter at the start of the word) on Android.
- The setting must always sit on the left, with its related control sitting on the right.
The Settings Categories above can be used if you’ve got a lot of Settings and they need breaking up into groups. They can either be used as headings to break up the screen, or as links to a sub-screen (with the relevant settings placed there). The following is recommended:
7 or fewer: Don’t group at all.
8 to 15: Group the settings into their categories, using the category name as the heading.
16 and above: Only show the category names. Each name should then be used as a link to a sub-screen. These sub-screens will be home to that category’s related settings.
If you don’t have a hidden menu in your app (such as a Side Drawer Menu), and so can’t split up Settings and App Information, you can include the App Information in the Settings screen.
Patterns in action
This pattern is currently being used by the BBC+ App, Bitesize App and the Updated Weather App.