Was geht

Acht Beispiele. Unter jedem steht der Satz, den man seinem Agenten sagt — und was ASODeck daraus macht.

Jedes Bild ist aus den gezeigten Operationen gerendert. Die App „Tagton“ ist erfunden.

Beispiel: Eine Karte hervorheben

Eine Karte hervorheben

Auftrag„Heb die Auswahl der Stimmung aus dem Screenshot heraus und dunkle den Rest ab.“

Die Reihe liegt als Karte mit Schatten über dem Gerät und ragt über dessen Rand.

Die Operationen dahinter (annotate_panel, apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "beere"
  },
  {
    "op": "annotate",
    "panels": [
      1
    ],
    "items": [
      {
        "kind": "lift",
        "area": {
          "x": 0.04,
          "y": 0.185,
          "w": 0.92,
          "h": 0.11
        },
        "scale": 1.14,
        "dim": 0.45
      }
    ]
  }
]
Beispiel: Privates unkenntlich machen

Privates unkenntlich machen

Auftrag„Verpixle den Text der Mitteilung oben und markier die Uhrzeit der Erinnerung.“

Der Text ist im exportierten Bild verpixelt und nicht wiederherstellbar; um die Uhrzeit liegt ein Rahmen.

Die Operationen dahinter (annotate_panel, apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "nacht"
  },
  {
    "op": "annotate",
    "panels": [
      1
    ],
    "items": [
      {
        "kind": "redact",
        "area": {
          "x": 0.21,
          "y": 0.25,
          "w": 0.74,
          "h": 0.056
        },
        "style": "pixel",
        "strength": 0.025
      },
      {
        "kind": "outline",
        "area": {
          "x": 0.05,
          "y": 0.413,
          "w": 0.9,
          "h": 0.058
        },
        "color": "#FFD60A"
      },
      {
        "kind": "label",
        "at": {
          "x": 0.5,
          "y": 0.442
        },
        "text": "Deine Zeit",
        "fill": "#FFD60A",
        "color": "#1B1B1F"
      }
    ]
  }
]
Beispiel: Schritte zeigen

Schritte zeigen

Auftrag„Zeig mit einem Pfeil auf den schweren Tag im Kalender und nummeriere die zwei Zahlen darunter.“

Ein gebogener Pfeil und zwei Nummern, in Bruchteilen des Screenshots angegeben und auf die Leinwand umgerechnet.

Die Operationen dahinter (annotate_panel, apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "tiefsee"
  },
  {
    "op": "annotate",
    "panels": [
      1
    ],
    "items": [
      {
        "kind": "arrow",
        "from": {
          "x": 1.12,
          "y": 0.24
        },
        "to": {
          "x": 0.8,
          "y": 0.31
        },
        "color": "#FFD60A",
        "curve": 0.3
      },
      {
        "kind": "badge",
        "at": {
          "x": 0.08,
          "y": 0.545
        },
        "value": 1
      },
      {
        "kind": "badge",
        "at": {
          "x": 0.39,
          "y": 0.545
        },
        "value": 2
      }
    ]
  }
]
Beispiel: Den Blick lenken

Den Blick lenken

Auftrag„Stell den ersten Tagebucheintrag scharf und lass alles andere unscharf und dunkler werden.“

Nur der gewählte Bereich bleibt scharf; der Rest ist weichgezeichnet und abgedunkelt.

Die Operationen dahinter (annotate_panel, apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "nordlicht"
  },
  {
    "op": "annotate",
    "panels": [
      1
    ],
    "items": [
      {
        "kind": "focus",
        "area": {
          "x": 0.05,
          "y": 0.2,
          "w": 0.9,
          "h": 0.085
        },
        "dim": 0.45,
        "blur": 0.012
      }
    ]
  }
]
Beispiel: Hintergrund mit Druckeffekt

Hintergrund mit Druckeffekt

Auftrag„Nimm den Verlauf „Abendrot“ als Hintergrund und leg einen Risograph-Effekt darüber.“

Der Effekt trifft nur den Hintergrund — Gerät, Screenshot und Schrift bleiben, wie sie sind.

Die Operationen dahinter (list_backgrounds, apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "abendrot",
    "finish": {
      "kind": "riso"
    }
  }
]
Beispiel: Zeitungsdruck

Zeitungsdruck

Auftrag„Mach den Hintergrund zu einem Zeitungsraster in Dunkelgrün auf hellem Papier.“

Rasterpunkte in zwei Farben, aus dem Verlauf darunter gerechnet.

Die Operationen dahinter (list_backgrounds, apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "nordlicht",
    "finish": {
      "kind": "zeitung",
      "ink": "#0F2A22",
      "paper": "#E9F2E4"
    }
  },
  {
    "op": "update_layer",
    "panels": [
      1
    ],
    "layerId": "headline",
    "patch": {
      "color": "#F4FBF6"
    }
  }
]
Beispiel: Gerät läuft aus

Gerät läuft aus

Auftrag„Lass das Gerät nach unten in den Hintergrund auslaufen.“

Das Gerät blendet über die untere Hälfte in den Hintergrund aus, samt Schatten.

Die Operationen dahinter (apply_operations)
[
  {
    "op": "set_background",
    "panels": [
      1
    ],
    "preset": "graphit"
  },
  {
    "op": "update_layer",
    "panels": [
      1
    ],
    "layerId": "device-1",
    "patch": {
      "fade": "bottom",
      "fadeSize": 0.5
    }
  }
]
Beispiel: Im Browserfenster

Im Browserfenster

Auftrag„Zeig den Mac-Screenshot in einem dunklen Browserfenster mit der Adresse tagton.app.“

Ein gezeichnetes Browserfenster mit Adresszeile statt des MacBooks — aus Geometrie, kein Produktbild.

Die Operationen dahinter (apply_operations)
[
  {
    "op": "set_device_frame",
    "panels": [
      1
    ],
    "frame": "browser-dark"
  },
  {
    "op": "update_layer",
    "panels": [
      1
    ],
    "layerId": "device-1",
    "patch": {
      "address": "tagton.app"
    }
  }
]

Zum Ausprobieren ohne eigene Bilder: im Editor „Beispiel-App“ wählen — sie legt Tagton mit vier Screens, einem Deck und einem Werbeset an und lässt sich mit einem Klick wieder entfernen. Wie man einen Agenten verbindet, steht unter Agent verbinden.

Was geht — Beispiele mit dem Auftrag dahinter — ASODeck