White shadow chat room

Posted by / 10-Mar-2020 05:37

This concept is a little more compact, with the “View Profile” and “Report User” buttons as static icons to the right of the messages.

I played with the idea of not having a “Send” button here, and instead make use of the send button on the i OS keyboard.

There are three options here: a black bar, a low transparency black bar or the silver bar.

The people button shows a list of users currently in the chatroom, and I have readopted the idea of having the slide to view more features element (like the Twitter app) to allow the user to view the user’s profile or report them.

With this done, it’s time to move on to putting something together in Photoshop!

In this particular case I searched for “fun” and within seconds I was presented with lots of different options and inspiring palettes to use as a base for my design. It is important to think about what colors you will need when selecting a palette; I find picking something light, something dark, and something bright is always a good starting point.

It’s important to have good contrast in your design.

White shadow chat room-18White shadow chat room-76White shadow chat room-54

Inspired by the original Twitter UI for i Phone, this UI allow users to swipe on a message to view more options, such as “View Profile” and “Report User” — a fun and space-saving way to allow more content on this screen.