Mechanical Keyboard Product Page Mockup

This generates a polished desktop e-commerce product page for a premium mechanical keyboard, suitable for product design showcases, storefront concepts, and UI mockups.

プロのメカニカルキーボードブランド{argument name="brand name" default="KeyForge"}用の、クリーンでモダンなeコマース商品詳細ページを作成。白い背景に subtle な light-gray の区切りと広々とした余白を備えた高精細なデスクトップウェブサイトモックアップとして提示。レイアウトは、トップナビゲーションバー、左側の商品サムネイルレール、中央の大きな商品ヒーロー画像、右側の購入情報パネルを含む単一の統合ストアフロントシーン。ヘッダーには、左端に太字のワードマーク、その後に7つのナビゲーション項目「Keyboards」「Switches」「Keycaps」「Accessories」「Sale」「Blog」「Support」、右端に検索、アカウント、カートの3つのアイコンを配置し、カートには小さな黒い通知バッジ「1」付き。中央に表示されるメイン商品は、 pale gray のステージで少し elevated な正面アングルから撮影されたコンパクトな75%メカニカルキーボードで、シルバーのアルミニウムケース、白とグレーのキーキャップ、ラベンダー紫のアクセントキー数個、右上にシルバーの音量ノブ付き。左側の縦ギャラリーには、正確に5つのサムネイル：1つの選択された正面商品ショット、1つのアングルキーボードビュー、1つのメカニカルスイッチクローズアップ、1つのキーキャップテクスチャクローズアップ、1つの円形再生アイコン付きの暗い動画サムネイル。右側の商品パネルには、小さなピルバッジ「NEW」、大きな太字の商品名{argument name="product name" default="KeyForge K75 Pro"}、サブタイトル「75% Mechanical Keyboard」、4.8と「(126 reviews)」の5つ星評価行、大きな太字の価格{argument name="price" default="$129.99"}に続くグリーンの「In Stock」ステータス、およびプレミアムパフォーマンス、ガスケットマウント設計、QMK/VIAサポート、RGBに関する短い2文の説明。その下に、「Switch Type」セレクターを正確に4つのピルボタン「Cherry MX Red」「Gateron Brown」「Gateron Blue」「TTC Gold Pink」付きで最初が選択された状態；「Color」セレクターを正確に3つのピルボタン「White / Purple」「Black / Gray」「Navy / Blue」付きで最初が選択された状態；「Quantity」ドロップダウンを「1」に設定；カートアイコン付きの大きな黒いプライマリボタン「Add to Cart」；ハートアイコン付きのアウトラインセカンダリボタン「Add to Wishlist」。ボタンの下には、小さなアイコン付きの正確に3つの水平サービスハイライト：「Free Shipping」サブテキスト「On orders over $99」、「30-Day Returns」サブテキスト「Hassle-free returns」、「2-Year Warranty」サブテキスト「Peace of mind」。下部コンテンツエリアには、 light な線で区切られた2カラムセクションを作成。左には正確に5つのアイテムの縦タブリスト：選択された「Overview」、その後「Specifications」「What’s in the Box」「Shipping & Returns」「Reviews (126)」。タブの右には、正確に6つの機能ブロックを2行3列で配置した角丸白色機能カードグリッド、各ブロックにシンプルなラインアイコン、太字タイトル、短い説明テキスト：「75% Layout」「Gasket-Mounted」「QMK/VIA Support」「Hot-Swappable」「RGB Backlighting」「Premium Build」。この下部エリアの最右には、正確に7つのバレット付き仕様リスト：「Layout: 75% (82 Keys)」「Switch Type: Cherry MX Red」「Mounting: Gasket-Mounted」「Connectivity: USB-C (Wired)」「Backlight: RGB, South-facing」「Material: Aluminum Case」「Dimensions: 322 x 135 x 42 mm」、さらに最終バレット「Weight: 1.25 kg」。洗練されたミニマルなプロダクトデザイン美学、リアルなUI余白、InterやSF Proに似たクリーンなサンセリフタイポグラフィ、ソフトシャドウ、微かな角丸、モノクロアイコン、洗練されたスタートアップスタイルの家電プレゼンテーションを使用。

機械翻訳 — この作品を生成したのは元のプロンプトです。

✨ 生成 保存 プロンプトをコピー 共有 元の投稿 Hitboard で開く