Skincare Landing Page Mockup

Skincare Landing Page Mockup

原始文档

GPT Image 2 · en

{
  "type": "skincare product landing page mockup",
  "design_style": "clean, clinical, trustworthy, modern",
  "color_palette": ["white", "{argument name=\"primary color\" default=\"light blue\"}", "navy blue"],
  "brand_name": "{argument name=\"brand name\" default=\"DERMA CALM\"}",
  "layout": {
    "header": {
      "left": "brand logo",
      "center": {
        "element": "navigation menu",
        "count": 6,
        "labels": ["ABOUT", "PRODUCT", "FEATURE", "INGREDIENT", "VOICE", "Q&A"]
      },
      "right": {
        "element": "action buttons",
        "count": 2,
        "labels": ["マイページ", "今すぐ購入する"]
      }
    },
    "hero_section": {
      "background": "blurred laboratory glassware (beakers, flasks) suggesting scientific formulation",
      "left_column": {
        "headline": "{argument name=\"headline text\" default=\"敏感な肌にも、毎日つづけられる安心ケア。\"}",
        "body_text": "description of low irritation, moisturizing, and barrier support",
        "call_to_action_buttons": {
          "count": 2,
          "styles": ["solid navy blue", "white with navy border"]
        }
      },
      "center_column": {
        "product": "{argument name=\"product type\" default=\"white pump bottle of serum\"}",
        "props": ["dollop of white cream"],
        "floating_badge": "circular badge with text '皮膚科医監修'"
      },
      "right_column": {
        "model": "{argument name=\"model description\" default=\"young Asian woman with glowing clear skin, smiling, touching her cheek\"}"
      }
    },
    "features_section": {
      "container": "white rounded rectangle spanning the bottom width",
      "count": 6,
      "items": [
        "satisfaction rate '95%' with 5 navy stars",
        "shield icon with checkmark (low irritation)",
        "water drop icon (skin barrier support)",
        "crossed-out bottle icon (fragrance-free)",
        "crossed-out flask icon (alcohol-free)",
        "clipboard icon with checkmark (patch tested)"
      ],
      "footer": "small print disclaimers at the very bottom"
    }
  }
}

使用方法

  1. 复制完整原始提示词,并保留其中的参数。
  2. 按需求替换主体、文字和构图要求。
  3. 在兼容的外部工具中使用,核对当前使用条件并检查结果。

开始前需了解

  • 先确认是否需要参考图。标注兼容模型,不代表该示例由这个模型生成。
  • 核对名称、数字与画面文字;不同模型版本的结果可能不同。

相似案例

Skincare Landing Page Hero Section
GPT Image 2en

{ "type": "landing page hero section", "theme": "skincare and beauty", "color_palette": [ "white", "{argument name=\"primary color\" default=\"teal\"}", "light blue" ], "header": { "logo": "{argument name=\"brand name\" default=\"CLEAR RESET\"}", "na

Men's Skincare Landing Page Mockup
GPT Image 2en

{ "type": "Website landing page homepage", "theme": { "style": "Fashionable, Professional, Modern, Dark Mode", "colors": "{argument name=\"primary color theme\" default=\"Dark Navy Blue and Black\"}" }, "layout": { "header": { "logo": "{argument name=\"b

Skincare Landing Page Mockup
GPT Image 2en

{ "type": "Skincare product landing page template", "design_style": "Simple, clinically relevant, trustworthy, modern", "color_palette": [ "White", "{argument name=\"primary color\" default=\"light blue\"}", "Navy Blue" ], "brand_name": "{argument name=\"bra

Skincare E-commerce Landing Page Mockup
GPT Image 2en

{ "type": "Skincare product e-commerce landing page design draft", "brand": "{argument name=\"brand name\" default=\"DERMA CALM\"}", "color_palette": [ "White", "light blue", "{argument name=\"primary color\" default=\"Dark blue\"}" ], "layout": { "heade

Skincare E-commerce Landing Page
GPT Image 2en

{ "type": "The first screen of the e-commerce landing page", "brand": "{argument name=\"brand name\" default=\"CLEAR RESET\"}", "theme": "Refreshing skincare, minimalist aesthetics, bubble background", "color_palette": [ "White", "{argument name=\"primary color\"