Design d'interface interactive · #137 Image d'exemple

Cliquer pour agrandir · Rendu de référence original

Source de l'exemple

Contenu d'origine préservé. Le résultat final dépend de la version du modèle, des images de référence et des paramètres ; la reproduction exacte n'est pas garantie.

Marques & Logos / PROMPT #137

Design d'interface interactive · #137

InterfaceProduitMarqueTechCommerce

Observez le rendu puis copiez le prompt d'origine ; remplacez les variables ci-dessous avec vos propres éléments.

01 / Personnalisez votre version

"特徴", "成分", "お客様の声", "使い方", "FAQ""敏感肌OK", "高保湿", "朝晩使える""美容成分をしっかり届ける", "ハリ・ツヤのある印象へ", "続けやすいシンプルケア""初回限定で試してみる >", "成分をチェック >""満足度 96%", "美容成分 5種配合", "愛用者 12,000人突破""うるおい", "透明感", "使いやすさ"

02 / Prompt complet · Texte original

{
  "type": "e-commerce landing page hero section mockup",
  "aesthetic": "clean, bright, airy, feminine, floral accents with purple flowers, {argument name=\"primary color\" default=\"soft pink\"} and white color palette, soft lighting",
  "header": {
    "logo": "{argument name=\"brand name\" default=\"LUMEA BEAUTY\"}",
    "navigation_links": {
      "count": 5,
      "labels": ["特徴", "成分", "お客様の声", "使い方", "FAQ"]
    },
    "cta_button": "今すぐ試す"
  },
  "hero_section": {
    "left_column": {
      "headline": "{argument name=\"headline text\" default=\"鏡を見るたび、うるおう透明感。\"}",
      "subheadline": "乾燥・くすみが気になる肌に。美容成分を贅沢に配合した、毎日のための集中保湿美容液。",
      "feature_badges": {
        "count": 3,
        "style": "pill-shaped with small icons",
        "labels": ["敏感肌OK", "高保湿", "朝晩使える"]
      },
      "bullet_points": {
        "count": 3,
        "style": "pink checkmarks",
        "labels": ["美容成分をしっかり届ける", "ハリ・ツヤのある印象へ", "続けやすいシンプルケア"]
      },
      "cta_buttons": {
        "count": 2,
        "labels": ["初回限定で試してみる >", "成分をチェック >"]
      },
      "trust_badges": "送料無料 / 初回限定 / 定期縛りなし"
    },
    "center_subject": {
      "model": "{argument name=\"model description\" default=\"young East Asian woman smiling, touching her cheek\"}",
      "action": "holding a dropper bottle of serum"
    },
    "right_column": {
      "product_display": {
        "count": 2,
        "items": ["{argument name=\"product type\" default=\"moisturizing boost serum\"} dropper bottle", "packaging box"]
      },
      "stat_cards": {
        "count": 3,
        "style": "floating white rounded rectangles with gold accents",
        "labels": ["満足度 96%", "美容成分 5種配合", "愛用者 12,000人突破"]
      }
    }
  },
  "bottom_section": {
    "benefit_cards": {
      "count": 3,
      "style": "horizontal white rounded rectangles with icons",
      "labels": ["うるおい", "透明感", "使いやすさ"]
    }
  }
}

Copiez ce prompt dans votre outil de génération d'images habituel ; ce site sert à explorer et éditer des prompts, sans génération directe d'images.

03 / Vérifications avant génération

Remplacez les variables par des termes précis et vérifiez si une image de référence est requise.
Si l'image comporte du texte, définissez clairement les mots exacts et relisez attentivement après génération.
N'ajustez qu'un seul élément à la fois (sujet, lumière ou composition) pour comparer facilement les résultats.

Consulter le guide des prompts →