Navigating the Interface

Status: Complete

This page explains the layout of the Chatalot chat interface and how to find your way around.

Desktop Layout Overview

The interface is divided into several areas:

The top bar stretches across the entire width of the screen and contains (from left to right):

Community picker -- Shows the current community name and icon. Click it to switch communities, join a new one, or access community settings.
Channel name -- Displays the name of the active channel (prefixed with #). Click the dropdown arrow to open the navigation sidebar.
Search bar -- A global search field (also accessible with Ctrl+K) that lets you search messages and quickly switch channels.
Toolbar icons -- Bookmarks, recent history, scheduled messages, polls, notifications, and members panel toggle.
User avatar -- Click to open the user menu (status picker, voice controls, changelog, feedback, and sign out).

Click the community name in the top-left to open the community picker. From here you can:

Click the channel name dropdown (next to the # icon) to open the navigation sidebar. It has two tabs:

Community -- Shows all groups in the current community. Each group expands to reveal its text and voice channels. Ungrouped channels (if any) appear at the bottom. You can also discover new groups or join via invite code.
DMs -- Your direct message conversations.

The sidebar includes a Filter search box at the top for quickly finding channels by name.

Tip: The sidebar can be collapsed by clicking the channel name again to give you more room for the chat area.

The center of the screen is the message area. It displays messages in chronological order with:

Click the members icon (people silhouette) in the header toolbar to toggle the members panel on the right side. It shows:

Click on a member's name to view their profile card with display name, bio, pronouns, and status.

At the bottom of the chat area is the message input. It includes:

Attachment button (paperclip icon) -- Upload files
GIF button -- Search and send GIFs
Poll button -- Create a poll
Text input -- Type your message here
Formatting toolbar -- Bold, italic, strikethrough, code, and link buttons below the input
Send button -- Send the message
Schedule button (clock icon) -- Schedule a message for later
Keyboard shortcut hints at the bottom (Enter to send, Shift+Enter for new line)

On smaller screens, Chatalot adapts to a single-column layout.

Key differences on mobile:

The sidebar is hidden by default and opens as an overlay (hamburger menu in the top-left).
The members panel is hidden by default; tap the members icon to open it.
The header is simplified, showing the community icon, channel name, and essential toolbar icons.
The message composer is condensed with a smaller input area and a send arrow button.
Message actions (react, reply, bookmark, edit, delete) appear as an overlay toolbar when you long-press or tap a message.
The formatting toolbar and keyboard shortcut hints are hidden to save space.

Chatalot supports extensive keyboard shortcuts. Here are the most useful ones for navigation:

Shortcut	Action
`Ctrl+K`	Open the quick switcher to jump to any channel or DM
`Up Arrow`	Edit your last message (when the input is empty)
`Escape`	Close open panels, modals, or pickers

Tip: Press Ctrl+/ or look for the keyboard icon in the UI to see the full list of available shortcuts.

Now that you know your way around, continue to Sending Your First Message.