How we “simplified” UI/UX by 20% in SAMA chat client

📑Release notes 1.0.0

Oleksandr Chabaniuk
SAMA communications

--

✈️ Large-scale client upgrade

During this time, we did not sit idle 🥏, but developed and implemented a new design for our client.

Using time efficiently ⏳, we developed a new unified design concept for navigation elements and panels. Based on the choice of a universal theme for all devices, the black and white theme was combined into one single one.

When developing the new design, our focus 🔍 was on separating ourselves from the leading giants of the chat industry and creating our own interface feature.

✔️ We believe we have succeeded in this effort .

All pages were redesigned🎨, including the authorisation page and the main hub for all interactions.

We also did not forget about those who like to use the browser/chat with only half the screen expanded, which is why we improved the optimisation for different screens, including the view for mobile phones📱.

* You can try it by yourself right now: app.samacloud.io

🔷 New interesting features

A lot of things have been improved, so let’s take a look at the most important and biggest ones:

🔹The menu for sending and attaching attachments 📦 has been improved with easy view of all files to send as a list and delete them if necessary.

The carousel🎞 for viewing attachments in chat has also been improved.

🔹The next feature is that we have divided the chat creation window into two full-fledged windows 🪟, where in the first one you specify the name of the chat, and in the next window you search for the necessary users and add them to the list 📃.

Done. You are now in the newly created group 👥.

🔹Also, contextual windows 📄 have been added for some components, making interaction with active actions much faster and easier.

🔹New friends — new chats 🤝. That’s why searching for users is now always easy to access and looks clear and simple.

✏️Enter a username ⇨ 🔍 find a user ⇨ 💭 start a chat.

🔹Information windows 📢 are divided into separate containers, including group chat and user information. They can close dynamically when the screen size is changed.

* You can try it by yourself right now: app.samacloud.io

🔶 Important functional improvements

You might think that’s all, but we’ve also improved a lot of features and components to make our interface not only visually appealing, but also easy and comfortable to use.

Check out the list below:

  • Added loads in the places of data download
  • Added skeleton for basic client windows
  • Added support for links in the text of messages
  • Added support for automatic login after registration
  • Added a pop-up window for requesting notifications
  • Implemented support for third-party (custom) protocols for the server architecture
  • Improved screen and logic for editing user or chat data
  • Implemented the maximum speed of activity status exchange between users
  • Implemented a list of users in group chat
  • Improved support for heic image format
  • Implemented the ability to add or remove users from the chat
  • Improved chat and user account deletion logic
  • Improved synchronisation of active actions (adding/removing a user from the chat, etc.)
  • Improved optimisation of the interface for different screen sizes
  • Unlocked sending up to 10 files at once
  • Updated icons all over the client
  • Fixed many inaccuracies and offsets of small objects

* You can try it by yourself right now: app.samacloud.io

🔧 Fixed possible bugs

Having worked out a large number of possible use cases, we have found and fixed almost all possible problems and errors that our user may face.

List of fixed bugs:

  • Fixed the display of the size of atchments
  • Fixed distortion of the size of attributes when loading
  • Fixed display of images in chat with different resolutions
  • Fixed a bug with double notifications when the user is logged in
  • Fixed the loss of focus from the input when sending messages and reloading the page
  • Fixed permanent user logout at any screen resizing
  • Fixed the loss of subscription to user activity after the rack reload
  • Fixed incorrect redirect to chat when clicking on a notification
  • Fixed redirect to pages when using the ‘Back’ and ‘Next’ system buttons
  • Fixed an incorrect change in the size of the inbox for message text
  • Blocked the ability to create a chat with yourself

📃 Conclusion

With a lot of effort and time, we have improved 💪🏻 the visual component of the project, as well as our client, where you, as users, can get acquainted with most of the available functionality of our API ⚒.

On the server side, we have developed support for integrating third-party protocols ⚙️ so that you can easily integrate our API into your existing or new project.

All of these changes have powerfully strengthened the foundation for the further development of our idea. That is why, while you are reading this article, we are actively developing new features and improving the existing ones 👀.

So check out our repositories, you might find something new there 😉.

🔻Link to the web client for self-viewing: app.samacloud.io

And also our repositories, we are waiting for you there👇🏼

📌 Try SAMA

To run SAMA server locally — follow https://github.com/SAMA-Communications/sama-server. Frontend app is available at https://github.com/SAMA-Communications/sama-client.

Discover, enjoy, and all feedback is welcome. We will be thankful a lot for every GitHub star, issue, or comment!

--

--