Here’s what Discourse’s interface looks like most of the time.
Let’s break down the main parts, and then the main parts into smaller parts.
- Header
- Sidebar
- Main content
Header
- Sidebar button/toggle (or Hamburger)
- Logo
- Top right icons:
a. Chat toggle
b. Quick search
c. Notifications Menu / Avatar menu
Sidebar
- Sections
- New Section Button
- Keyboard Shortcuts
Main Content
- Navigation / Nav bar
a. Category Selector
b. Tag selector
c. Navigation buttons - Topics list headers
- Topics list
Topic
- Title
- Category
- Tags
- Avatar
- Username and Name
- Edit History Button
- Post Date
- Post Actions
- Reply to Post button
- Topic Map
- Topic Actions Buttons
- Reply to Topic Button
- Admin Wrench
- Timeline
- Reply to Topic Button
- Notification State Button
User Card
- Location
- Badge list
- Avatar
- Username
- Name
- Bio
- Last Activity Stats
- Website
- Cakeday (Registration Anniversary)
- New Personal Message Button
- New Personal Chat Button
Notifications menu
- Notifications
- All notifications
- Replies and Mentions
- Likes
- Personal Messages
- Bookmarks Reminders
- Chat Notifications
- Reviewable Items
- Other Notifications
- User Menu
- See All Notifications Button
- Dismiss Notifications Button
Composer
- Post Type Selector
- Topic Title
- Topic Category Selector
- Topic Tags Selector
- Formatting Toolbar
- Text Area
- Post Creation/Edition Button
- Cancel Post Button
- Resizing Grip
- Fullscreen Toogle
- Minimize Toggle
- Preview Panel
- Preview Panel Toggle