Design beskedkort

Et korts opbygning

Kortets dele, oppefra og ned. Udelad det, du ikke har brug for: et kort med kun en titel er fint.

#github

Besked fra GitHub• acme/web

Pull request #212 oprettet

Åben

Hurtigere søgning i kanallisten

Søgningen kører nu ved hvert tastetryk med 120 ms debounce.

Forfatter

maya

Reviewere

dani, sam

10:03

+86-12

1. Header"Besked fra" og et navn: webhookens navn, eller dit fællesskabs navn ved et kommandosvar. Et svar kan tilføje et badge, som repositoriet.
2. Titel og statusFeltet title, der bliver et link, når du sætter title_url, med status-pillen ved siden af.
3. UndertitelEn anden linje i fed skrift, sub_title.
4. BeskrivelseBrødteksten, i markdown.
5. FelterRækker med etiket og værdi, med en kopiknap.
6. BundTidspunktet, og tilføjede og fjernede linjer, hvis du sender dem.

{
  "message_container": {
    "type": "embed_message",
    "badge": "acme/web",
    "color": "purple",
    "title": "Pull request #212 opened",
    "title_url": "https://github.com/acme/web/pull/212",
    "status": { "label": "Open", "color": "green", "icon": "pull_request" },
    "sub_title": "Faster search in the channel list",
    "description": "Search now runs **per keystroke** with a 120 ms debounce.",
    "fields": [
      { "field": "Author", "value": "maya" },
      { "field": "Reviewers", "value": "dani, sam" }
    ],
    "additions": 86,
    "deletions": 12,
    "files_changed": 3
  }
}

Alle felter

De her hører til i message_container. Et kort skal have en beskrivelse eller en loader. Felter markeret "kommandosvar" fjernes, når du poster gennem en webhook.

Status og diff-statistik

En statuspille fortæller historien, før nogen læser teksten. Den sidder ved siden af titlen, eller i bunden, når der ikke er nogen titel; diff-statistikken vises ved siden af tidspunktet. Begge virker i kommandosvar, og den indbyggede GitHub-integration bruger dem. En webhook fjerner dem.

#github

Besked fra GitHub• acme/web

Pull request #212 merget

Merget

11:20

Besked fra CI• acme/web

Build fejlede på main

Fejler

search.test.js: 2 af 212 tests fejlede.

11:24

Besked fra GitHub• acme/web

maya pushede til main

Commit

11:31

+14-3

{
  "message_container": {
    "color": "red",
    "title": "Build failed on main",
    "status": { "label": "Failing", "color": "red" },
    "description": "`search.test.js`: 2 of 212 tests failed."
  }
}

Ikoner

En mapping, der virker til GitHub

Den indbyggede GitHub-integration bruger disse; kopiér dem til dine egne værktøjer.

Loader og tænkning

Til alt, der tager et øjeblik, som et AI-svar eller et langt job, poster du først et kort med en spinner og erstatter det så med resultatet. Loaderen virker fra webhooks og kommandosvar. I et kommandosvar kan du også lægge modellens ræsonnement i thinking: medlemmerne ser en Vis tænkning-knap i stedet for en mur af tekst.

#assistant

Besked fra Assistant

Tænker…Læser de sidste 50 beskeder

09:02

Først: loaderen

#assistant

Besked fra Assistant

maya: hvornår er standup?

Standup er kl. 09:30 i #daily.

Vis tænkning

Tjekkede de fastgjorte beskeder og den tilbagevendende begivenhed i #daily.

09:02

Så: svaret, med ræsonnementet foldet sammen

{
  "message_container": {
    "type": "embed_message",
    "color": "blue",
    "loader": true,
    "loader_text": "Thinking…",
    "loader_sub_text": "Reading the last 50 messages"
  }
}

{
  "message_container": {
    "type": "embed_message",
    "color": "blue",
    "sub_title": "maya: when is the standup?",
    "description": "Standup is at **09:30**, in #daily.",
    "thinking": "Checked the pinned messages and the recurring event in #daily…"
  }
}

For at skifte loaderen ud med svaret opdaterer du beskeden med et nyt kort uden loader. Hvordan står under liveopdateringer.

Lange beskrivelser

En beskrivelse kan være op til 50.000 bytes. Efter de første 1.000 ser medlemmerne starten og en Vis mere-knap, der henter resten, så en lang rapport ikke oversvømmer kanalen.

Systembeskeder

Sæt "type": "system_message" for en meddelelse i stedet for et botopslag: vedligeholdelsesvinduer, ændrede regler, alt, der taler på vegne af selve fællesskabet. Den tager de samme felter og knapper.

{
  "message_container": {
    "type": "system_message",
    "color": "orange",
    "title": "Maintenance tonight",
    "description": "The build servers are down from 22:00 to 23:00."
  }
}

Farver

Kantens farve er det hurtigste signal på et kort. Brug den samme farve til den samme slags nyhed, hver gang.