Android and iOS

Android and iOS offer different user experiences due to their unique interface designs. These differences in design have been shaped by comprehensive guidelines written by their respective creators: Google for Android and Apple for iOS. Therefore, the app interface on both of them will also be different.

Note that the Android app and the iOS app are different in design but the same in functionality.

Examples of Interface Differences

From the app builder, you can install the modules you want in the home and side menus, and the app simulator on the left will preview how the feature will look on your app when you use it.

Disclaimer: Kindly be aware that what you're interacting with is merely a simulation of the app, designed to represent the core aesthetic and functionality. Please note that it doesn't fully encompass the breadth and depth of features, interactivity, or design completeness found within the actual application. Your actual app is a far more enriching experience with numerous additional features, complemented by a more comprehensive and interactive design.

In the home menu, you can move from tab to tab by clicking on the app simulator tabs.

In the side menu, you can click any tab from the side menu of the app simulator to access the module settings.

For example, when you click the 'My Groups' tab,

The module settings will show up.

Now, we will compare the Android and iOS interfaces on the actual app.

Home menu

For Android, you can choose between four navigation bar layouts:

Note that this option is only available for Android

• Top-wide: The bar shows at the top of the screen.

• Bottom-wide: The bar shows at the bottom of the screen.

• Top-standard:

You can add icons only

Or title only

but if you added both, the priority would go to the title

• Bottom-standard: It's the same as the top-standard layout, but the bar shows at the bottom of the screen.

This is what the home menu looks like on a mobile device:

Note that the three dots icon on the right top is the default setting in any app built on the nandbox app builder.

For iOS, the home menu bar is at the bottom by default, as it is also a standard iOS design convention according to Apple guidelines.

Side menu

For the Android interface, you can access the side menu by clicking the three-line icon.

For the iOS interface, you can access the side menu by clicking the 'More' button. The 'More' button is a standard iOS design convention according to Apple guidelines, and it was designed for cleanliness and simplicity.

Back Button

Android Preview: You can go back by clicking the back arrow at the top left of the screen or by clicking the normal Android back arrow at the bottom right of the screen.

iOS Preview: You can go back by using only one arrow at the top left, which will direct you to the side menu.

Search

Android Preview: You will find that tabs, icons, and the search bar are large in size. Large space between tabs.

iOS Preview: While iOS tabs, icons, and search bar are small in size, Small spaces between tabs.

Chats

Android Preview: You will not find a search bar to search for a contact to start a chat with.

iOS Preview: You will find a search bar to search for a contact and start a chat with them.

Channels

Android Preview: You can see that the icons are all in one color [category] [Mute Notifications] [Admins].

iOS preview: While iOS's are in different colors [category] [Media and files].

Booking

Android Preview: You will find two buttons [Cancel] [Continue].

iOS preview: You will find only one button [Book Now].

Groups

Android Preview: You can see that the icons are all in one color [category] [Mute Notifications] [Admins] [Participants].

iOS preview: While iOS's are in different colors [category] [Media and files].

Store

Android Preview: You can only go back to your home menu.

iOS preview: You'll have a cart icon on the top right of the screen, and you have the option to go back to your side menu by clicking 'More' at the bottom right of the screen.