Social visuals and previews

Create reviewable visuals from a post or brief, for personal work as well as Orbyn announcements. Keep the editable source alongside requested exports. Prefer installed fonts/tools and supplied captures. Report missing export tools or current platform verification without inventing results. The local pinned design reference is optional offline background.

Choose the artifact

Decide whether the request needs a feed approximation, an attached visual, a product demonstration or a website link-preview card. If unspecified, use the supplied material to choose a useful local preview and state the choice.

Drafting or materially rewriting the post belongs to social-content; polishing prose belongs to unslop.

Use approved copy, supplied screenshots and brand assets. For Orbyn visuals, read the relevant stack/token owners and reference assets; do not invent a logo or treat the helper's default colors as official branding. Label conceptual UI and synthetic data as mockups. Keep actual product screenshots faithful; annotations must not imply behavior the captured product lacks.

Design the visual

Choose hierarchy, spacing and a visual explanation before adding decoration. Make each card legible at feed size. Show the product, diagram or concrete result when it explains more than a text card. For original illustration or image edits, use the available image-generation tool; typeset final exact copy separately. Never assume Codex-only tool names exist in Claude or install a provider implicitly.

Render the output

• Quick text/card/carousel layout: use the dependency-free renderer and brief guide. It creates editable HTML with approximate wide/narrow feed views, full post text and ordered cards. Its example brief is a reusable input example, not a brand or personal voice profile. Extend or replace the layout for the actual brief rather than forcing every graphic into its starter template.
• Product screenshot composition: use available browser/layout tools and supplied captures.
• Requested video demo: define the actual demonstrated flow, use an available capture/export tool and inspect playback. A storyboard is not a video.
• Requested subtitled video or engineering catch-up output: use the conditional video method; verify the actual encoded file and frame holds.
• LinkedIn document carousel: export a PDF when requested, using an available PDF/presentation tool or browser print path. Read the relevant host skill when available. The bundled helper itself exports HTML and text only.

Inspect the rendered result

Open the result with an available browser or artifact viewer. Inspect the wide and narrow feed, every card, long words, line breaks, image crops and contrast. Check that sources and limitations survived the visual edit. Revise overflow and cramped copy rather than shrinking everything. Use useful alt text; keep decorative context out of it. Inspect exported PNG/PDF files separately at their actual dimensions, including every PDF page and its order.

Deliver honestly

Return the editable source, requested exports, copyable caption and alt text. Say which outputs were actually rendered and inspected. If the host lacks a renderer or exporter, deliver the source with the missing step explicitly marked; do not claim source inspection proves visual quality or upload readiness.

Feed chrome, line clamps, fonts and viewports are local approximations. Exact LinkedIn truncation, upload behavior and engagement are unverified until checked in the relevant platform. Layout dimensions are design choices; confirm current platform requirements when necessary.

Website Open Graph changes belong to the owning website task, and product flow/layout changes to orbyn-ui-design. Faux product UI for a page hero or feature card belongs to product-illustration. Do not create a site, publish, schedule or modify account settings as a side effect of preview generation.