Station Invitation Emails

# Design from Reference: Station Invitation Emails Create an original, high-fidelity visual design inspired by the reference. Prioritize composition, typography, colors, spacing, and component styling over technical implementation. ## Reference - **Product:** Station - **Category:** Invitation Emails - **Screenshot:** https://cdn.prod.website-files.com/5e9dc792e1210c5325f7ebbc/6acbcb768313d4c6c0cc78cf_6acbc9eeceb0f22248311032_cms-e04e04279b8faddde72129e6.webp Analyze the screenshot first. If inaccessible, request it rather than guessing. ## Content {{content.instructions}} {{content.data}} Preserve essential messaging and factual accuracy. Adapt structure and copy length for visual balance; never invent product claims. ## Visual Design ### Overall aesthetic - **Style:** Plain, personable invitation email with a white canvas and a single strong black CTA. - **Character:** Large readable paragraphs, selective bold emphasis, and one centered product screenshot. ### Page composition - **Canvas:** 944 × 974 screenshot px. - **Content column:** Approximately 704px wide, beginning near x=135; generous surrounding whitespace. - **Sequence:** Circular logo, greeting, invitation paragraph, product explanation, centered app image, joining instruction, divider, CTA, unsubscribe. - **Product image:** Approximately 460 × 280 screenshot px. ### Information hierarchy - **Primary:** Invitation and inviter relationship expressed through body copy rather than a large heading. - **Emphasis:** Key phrases are bold within paragraphs. - **Product proof:** Screenshot illustrates the app before the joining instruction. - **Action:** Download Station is the only prominent filled button. ### Typography - **Family:** Arial-like sans serif; exact family unverified. - **Body:** Approximately 20 screenshot px with 30px line-height. - **Emphasis:** Approximately 700 weight within regular paragraphs. - **CTA:** Approximately 20px, bold. - **Unsubscribe:** Approximately 15px, muted. - **Precision:** Screenshot pixel sizes are approximate and do not establish the original email CSS. ### Colors & surfaces - **Canvas:** #FFFFFF. - **Body:** Approximately #202020. - **CTA:** #000000 with white label. - **Screenshot blue:** Approximately #6C8AB8; this belongs to embedded artwork rather than the email surface. - **Divider:** Approximately #EAEAEA. - **Logo:** Small cyan-to-indigo mark inside a white circular surround. - **Precision:** Image compression introduces adjacent shades. ### Components - **Logo:** Circular mark near the top-left of the content column. - **Paragraphs:** Simple text blocks with no enclosing card. - **Screenshot:** Rounded outline with pastel app icons. - **CTA:** Black pill approximately 208 × 56 screenshot px. - **Footer:** Single understated unsubscribe link. ### Visual rhythm - **Spacing:** Large 30–45px paragraph gaps and broad separation around the product image. - **Alignment:** Text, divider, and CTA share a left edge; image is centered within the column. - **Contrast:** Sparse layout lets the black CTA close the sequence clearly. ### Responsive - **Observed:** Single email capture; responsive behavior is unverified. - **Recommendation:** Use fluid email width, comfortable side padding, scalable imagery, and a touch-friendly CTA. - **Copy:** Allow paragraphs to wrap naturally without fixed line breaks. ### Adaptation guidance - **Preserve:** Personal invitation, concise explanation, screenshot, clear joining instruction, and one primary action. - **Privacy:** Replace the inviter and recipient details with the intended content. - **Email design:** Keep layout simple and avoid relying on unsupported decorative effects. - **Content fidelity:** Do not transfer product claims or personal names from the reference. Use this context to reproduce the reference's visual language: layout, typography, colors, spacing, borders, radii, and distinctive elements. The screenshot takes priority if descriptions conflict. ## Direction {{preferences.fidelityInstructions}} ## Output {{output.instructions}} Deliver a polished, cohesive design with precise alignment, hierarchy, and spacing. Produce the requested visual artifact, not just a description. If unsupported, explain the limitation.