Prompting for a Structured Description

structured UI JSON output

Part of: Screenshot Describer

A paragraph description is nice to read and useless to a program. Lesson 4 generates HTML from what the model saw, and HTML generation needs data, not prose. This lesson turns the description into JSON your code can walk. Design the schema first Before writing the prompt, decide the shape you want back. Here's a UI schema that works: layout is a short label for the overall arrangement. components is a list, each entry an element the model spotted, with its type (button, heading, text, input, image, link) and its visible text. The prompt pins the schema down Naming the exact keys, and the exact allowed type values, is what separates a schema the model mostly follows from one where it improvises a new shape every run. Parse it defensively Models still wrap JSON in a sentence or a code fence sometimes, even when told not to. Slice out the object before trusting it: Finding the first { and the last } throws away any wrapper text and hands json.loads a clean object. It's the same trick you'd use parsing any structured reply. Why this matters Everything from lesson 4 onward reads fields off this dictionary: HTML generation, layout CSS, validation. A vague prompt gives you keys that chang

Challenge: Parse the Structured Reply