Compreendendo elementos de interface do usuário no Discourse

Documentação Usando Discourse
,
1

:bookmark: This resource covers the names for each element of the Discourse user interface.

:person_raising_hand: Required user level: All users

Here’s what Discourse’s interface looks like most of the time. Themes, theme components, and plugins may affect this layout.

Discourse Home Interface
Discourse Home Interface1620×1369 199 KB

Let’s break down the main parts, and then the main parts into smaller parts.

Discourse Home Interface Parts
Discourse Home Interface Parts1620×1380 202 KB

  1. Header
  2. Sidebar
  3. Main content

Header

Header

  1. Sidebar button/toggle (or Hamburger)
  2. Logo
  3. Top right icons:
    a. Chat toggle
    b. Quick search
    c. Notifications Menu / Avatar menu

Sidebar

Sidebar
Sidebar489×1317 21.7 KB

  1. Sections
  2. New Section Button
  3. Keyboard Shortcuts

Main Content

Main Content
Main Content1307×685 50.1 KB

  1. Navigation / Nav bar
    a. Category Selector
    b. Tag selector
    c. Navigation buttons
  2. Topics list headers
  3. Topics list

Topic

Topic
Topic1519×1167 78.9 KB

  1. Title
  2. Category
  3. Tags
  4. Avatar
  5. Username and Name
  6. Edit History Button
  7. Post Date
  8. Post Actions
  9. Reply to Post button
  10. Topic Map
  11. Topic Actions Buttons
  12. Reply to Topic Button
  13. Admin Wrench
  14. Timeline
  15. Reply to Topic Button
  16. Notification State Button

User Card

User Card
User Card884×444 44.4 KB

  1. Location
  2. Badge list
  3. Avatar
  4. Username
  5. Name
  6. Bio
  7. Last Activity Stats
  8. Website
  9. Cakeday (Registration Anniversary)
  10. New Personal Message Button
  11. New Personal Chat Button

Notifications menu

Notifications Menu
Notifications Menu756×883 37.9 KB

  1. Notifications
  2. All notifications
  3. Replies and Mentions
  4. Likes
  5. Personal Messages
  6. Bookmarks Reminders
  7. Chat Notifications
  8. Reviewable Items
  9. Other Notifications
  10. User Menu
  11. See All Notifications Button
  12. Dismiss Notifications Button

Composer

Composer
Composer1899×935 221 KB

  1. Post Type Selector
  2. Topic Title
  3. Topic Category Selector
  4. Topic Tags Selector
  5. Formatting Toolbar
  6. Text Area
  7. Post Creation/Edition Button
  8. Cancel Post Button
  9. Resizing Grip
  10. Fullscreen Toogle
  11. Minimize Toggle
  12. Preview Panel
  13. Preview Panel Toggle
68 curtidas
14

Alguém criou ou está em processo de criar um guia semelhante para o Discourse 3.x com navegação lateral?

2 curtidas
15

Isso é uma mão na roda :raised_hands:

3 curtidas
19

Acho que precisamos dar uma pequena atualizada nisso. Aguente firme e veremos se conseguimos montar algo para você. :slight_smile:

5 curtidas
21

O guia estava muito desatualizado, então o atualizei com novas capturas de tela :slight_smile:
Ele pode ser melhorado, então sugestões são bem-vindas!

5 curtidas
22

Isso é muito bom :hugs: Obrigado @Canapin :heart:

Pequena sugestão: Poderia conter o compositor e o chat também? :slightly_smiling_face:

3 curtidas
23

11 e 12 do menu de notificações estão faltando.

E notei que no cabeçalho é chamado de menu de avatar, mas o título separado diz menu de notificações.

3 curtidas
24

Estou muito preocupado que este tipo de guia, por mais bem intencionado que seja, corra um grande risco de ficar desatualizado, devido às capturas de tela e anotações (meticulosamente) feitas. Tudo o que sei é que o mesmo foi tentado para Facebook e YouTube, etc., mas após alguns meses os usuários não conseguem encontrar certos itens mencionados. Não tenho uma solução melhor, no entanto.

2 curtidas
25

Como é uma wiki, todos podem ajudar quando ela precisa de uma atualização. E mesmo que alguns elementos mudem, ainda é útil saber como os outros elementos são chamados.
Em última análise, qualquer documentação pode ficar desatualizada. Se você não escrever documentação por esse motivo, não terá nenhuma documentação.

4 curtidas