UI・Web素材 / #156

アプリ画面のモックアップ

UI mockup / Screen / Wireframe

本物のUIに見せたいなら、余白とタップ領域の指定が効きます。

PROMPT

スマートフォンアプリの画面デザインを1枚作成して。縦位置 9:16。
構成:上部にヘッダー、その下に大きなカードが1枚、下部にタブバーが4項目。
カードには写真の領域と、その下にテキスト行を模した3本のグレーのバー(長さがそれぞれ違う)。
角丸は12px相当で統一、要素間の余白は広く均等に。
配色は白背景、グレーの階調、アクセント1色のみ。
実在するアプリやブランドのロゴ、実際の文章は入れない。

TIPS

  • テキストは「グレーのバー」で表すと、文字崩れを完全に回避できます。
  • 実在アプリの模倣にならないよう、ロゴやブランド名は入れないでください。
#UI#モックアップ#アプリ#画面

Related

UI・Web素材の他のプロンプト

App icon / Rounded square / Simple

Hero / Web / Copy space

Device mockup / Presentation / Studio

Banner / Multi-size / Layout

Seamless / Tile / Pattern