/
Channel Header Updates

Channel Header Updates

In-progress

Important Links

MM-33217: RN: Mobile V2 Updated Channel HeaderClosed

Phase 1 Design

New Channel Header Design

The new channel header includes a few key updates to improve usability.

iOS

 

 

 

Android

 

 

Channel Header in Context

 

 

 

Android

 

 

 

 

Channel header

From the channel header, the user can access details about the channel he is in. For now, we will utilize the existing channel info UI within that displays within a modal. In a later iteration, we will update this modal as well.

 

 

 

Search Within Channel Icon

This new search icon will open up the Search modal with the “in” hidden modifier preset to the current channel.

 

 

 

 

 

 

'More' Icon

Tapping on '···' icon will open the bottom sheet with the most popular (important) actions to which users need quick access.

 

 

 

 

Design Details

With the new UI for the mobile app, there is a ‘layered’ aesthetic that allows for more visual depth throughout the app. The channel content below the header appears to sit on top of the channel header with rounded corners and a subtle shadow effect.

 

Related content

Team Sidebar
Team Sidebar
Read with this
Channel Header & Channel Menus
Channel Header & Channel Menus
More like this
Adding a Server
Adding a Server
Read with this
Find Channels
Find Channels
More like this
Multi-Server Support
Multi-Server Support
Read with this
Channel Sidebar Organization
Channel Sidebar Organization
More like this