Chat App UI for Synapse by Supreet SChat App UI for Synapse by Supreet S

Chat App UI for Synapse

Supreet S

Supreet S

Chat App UI

SYNAPSE: ADVANCED TEAM COMMUNICATION SAAS -
Enterprise communication platforms frequently suffer from visual clutter and poor contrast. I designed a high-performance, dark-themed messaging SaaS tailored specifically for creative agencies and development teams. My primary focus was to craft an immersive, distraction-free environment that prioritizes content legibility and seamless cross-functional collaboration.
Group Call Screen
Group Call Screen

THE PROBLEM & STRATEGIC APPROACH

Traditional chat interfaces often treat dark mode as a simple color inversion. This approach leads to muddy contrast and muddy visual hierarchies. Furthermore, managing external client projects alongside internal team chatter typically results in disorganized workflows and missed updates.
I needed to build a unified solution that elegantly separates contexts while maintaining a sleek, modern aesthetic. My design strategy rested on three foundational pillars:
Dark-Native Architecture: I built the interface specifically for dark mode environments to ensure optimal readability.
Contextual Organization: I implemented clear hierarchical separation between client channels and general messages to keep workflows pristine.
Vibrant Functional Accents: I utilized bold, saturated colors to denote user identity and message direction without overwhelming the deep canvas.
Files
Files

UX MECHANICS & INTERACTION DESIGN

Instead of relying on rigid page structures, I designed the platform as a fluid, interconnected ecosystem of functional layers.

Intelligent Navigation Stack

I developed a dual-layered navigation model to maximize screen real estate. The extreme left rail houses core tool icons for quick context switching. The secondary panel serves as the communication hub. Within this hub, I integrated a unified search bar and segmented chat lists. Users can effortlessly toggle between "Client Projects" and "All Messages". I also integrated live status indicators and real-time typing notifications to keep teams perfectly synchronized.

TYPOGRAPHY & VISUAL SYSTEM

I authored a distinct visual language to give the platform a premium, application-like feel.
Background Palette: I utilized deep obsidian and rich charcoal tones. This absorbs ambient light and makes the text pop effortlessly.
Typography: I selected a highly legible, modern sans-serif typeface. The varying font weights guide the user's eye from primary sender names down to secondary timestamp data.
Action Elements: I designed floating input fields with rounded pill shapes. I paired these with intuitive, minimalist icons for attachments, emojis, and location sharing.

Let’s Create Together

Do you have a vision that needs bringing to life? I am currently open for new collaborations and would love to hear about your upcoming design challenges. You can view more of my work and connect with me directly on my Contra profile at https://contra.com/supreethere. Let us discuss how we can elevate your next project.
Like this project

Posted Jul 22, 2026

Explore my UI/UX case study for Synapse. Discover how I designed a high-contrast messaging SaaS to streamline creative workflows and team collaboration.