EN

With thismo companies can create corporate messaging for their teams. Service offers mobile apps for end users. We have created mobile design and developed Android app in collaboration with the client’s back-end team.

Project features

Real-time events are vital for any messaging software. In this project almost all the features rely on them: dialogues, messages and their statuses, “is typing” indicator, etc. The app also has user verification via SMS, can generate and read QR codes and offer profile search and messaging management functions.

Corporate chat app mockup

Navigation design

In the iOS version the client already had navigation was implemented with tabs iOS users are used to. When working on design we started with navigation and tried to find another solution for Android version that would look more natural to Android users.

Navigation with tabs is not the best choice for Android since we have one main activity (My chats) while chat search and profile have less priority for the user. Solution with side-navigation (Drawer) is familiar for Android users but it doesn’t offer the best user experience since navigation elements are hidden in the menu and to access them user needs to perform an extra action.

That’s why we decided to sort navigation elements by their priority. The main activity (messaging) is also the main screen and Floating action button from Material Design gives access to adding new chats. Profile and other low-priority functions were put in the upper Action bar.

Navigation in corporate chat
Grid in chat app

Interface design

We were required to create an app design taking into account corporate identity, iOS version design and requirements of Material Design guidelines. We used 8-box grid, typography and a set of standard icons from Google. It allowed us to speed up further layouting and build elements on the screens with a strictly specified structure.

When creating interface we used elements of Material Design from AppCompat and Support Design libraries only. Thanks to it the app looks and behaves identically on different versions of Android system. Additionally, we implemented animations for user interaction with UI, namely transitions between screens and operations with list elements.

Chat development

Real-time events component was developed in collaboration with the client’s team. We used WebSocket protocol together with advanced Realm mobile database which allowed us to achieve flexibility of data processing and management.

The app is based on Model-View-ViewModel architecture that speeds up the development process and makes product building and testing easier. Plus it simplifies scaling and project support. Ease and reliability of creating screens was achieved by using DataBinding library. In this kind of projects the abovementioned solutions allow developers to create a highly-responsive app without reinventing the wheel.

Apart from socket connections the app relies on the remote RESTful API for authorization and finding other people. We work with it using Retrofit 2.0 library that also improves development speed and efficiency.

If users receive a reply when out of the app, we notify them about it with Google Cloud Messaging push notifications. This way they will never miss important messages.

Mockups of chat for business

Cast:

  • Max Nesteruk Max Nesteruk

    Designer

  • Anton Bevza Anton Bevza

    Android Developer

  • Sasha Krol Sasha Krol

    Android Developer