Best Chat Screen UI Inspiration | Mobile, Desktop & Video Calls

You are currently viewing Best Chat Screen UI Inspiration | Mobile, Desktop & Video Calls
  • Post category:UI design

Are you looking for inspiration for chat screen UI designs? Here’s a full collection of them! Everything from UI mobile chat screens, to desktop chat designs (both in dark and light mode themes), as well as chat designs for video call applications.

See also: Music Player UI Design Inspiration

Some details I noticed in UI designs for chats are:

  1. Status-indicators (small blobs of colors that indicate if your contacts are online or offline)
  2. Indicator of the number of unread messages from each chat
  3. Sections for file sharing and old files that’s been uploaded
  4. A separation between group-chats and chats with individuals

Mobile Chat UI Design

With smaller screens, designs are limited to the number of features that can fit without overwhelming the user. Stripped down to the essentials, mobile chat designs often only consist of your most frequently talked to contacts and the chat windows.

Malik Abimanyu
Mobile Chat Screen UI
Tannaz Sadeghi
Tomasz Mazurczak

Desktop Chat Designs

With desktop screens, you can fit more elements and “nice-to-have” features, compared to on mobile. For example making a section of the interface dedicated to file sharing and collaboration.

Light mode

Desktop Chat Screen UI
Emy Lascan
Chat Screen UI
Arthur Arapov

Dark mode desktop UI

Filip Legierski
Dark Mode Chat Screen UI
Messenger Dark Theme UI by Alexander Porubov

Video Chat UI Inspiration

Video calls have become really popular since COVID forced people all around the world to adapt to working and studying remotely. It won’t be surprising therefore to see many upcoming applications tailored towards video calls and collaborations. So, here are a few of the best video chat UI concepts that I’ve seen.

One interesting detail I noticed while observing UI designs for video calls is that labels and buttons overlaying the videos are often half-transparent and/or contain a background blur. This is a good idea for minimizing the disturbance on the videos, while still maintaining the actions that one wants to allow the user to take.

Video Chat Screen UI
Karol Kos
Dark Mode Video Chat Screen UI
Mobile Video Call Chat UI Design
Mobile Video Call Chat UI Design by Jinu

Thank you for reading. I hope this was helpful!

Leave a Reply