Your Designer Profile picture
Product designer @tweeq || Get my UIUX design course with the link below and join 2,500+ students create magic 🪄

Jul 3, 2022, 10 tweets

Design Modern chat list bettter

Documented by @marina_uiux
#uidesign #uiuxdesign #figma

Let’s go…

Press F in figma to draw a frame, use codes below 👇🏿

Add oval or eclipse or circle, add text 16px and message 14px. Follow rest of codes below 👇🏿

Add status tag eg. Mutual, Group etc

Add a drop shadow to it

Add an iPhone frame (preferably iPhone 13 pro max)

Add header, create 2 circles
Add stroke to it
First one fill with: FCFCFD 60%
Add icon: 18px, 130F26
Second one clip a photo

Add chat tags and voila

Pro tip: Always use AUTO LAYOUT.
If you found this helpful, please share to others or save for later.

How to create a Glassmorphism effect in 7mins 🚀 (figma)

Share this Scrolly Tale with your friends.

A Scrolly Tale is a new way to read Twitter threads with a more visually immersive experience.
Discover more beautiful Scrolly Tales like this.

Keep scrolling