Shop Home
An e-commerce home: search bar, carousel, product masonry, and bottom tabs.
iOSAndroidHarmonyOSMobile WebCommerceFull screenFlow Version v1.0.0 · Framework targets:html-css / tailwind / react Stale
Component prompts referenced by this scene prompt
- Search Bar Prompt v1.0.0
- Image Carousel Prompt v1.0.0 {{autoplay}} = 自动(可暂停)
- Product Card Prompt v1.0.0
- Masonry Grid Prompt v1.0.0
- Bottom Tab Bar (Mobile) Prompt v1.0.0
Fill in the blanks to build your prompt
This prompt has no fill-in parameters — copy it as is, and replace the bracketed placeholders in the text.
Verification
Pending verification: this prompt has not been run against a live model yet; each one will be re-verified before launch.
Your assembled prompt
Original seven-part text
场景说明
电商 App 首页:搜索、轮播、商品瀑布与底部导航的完整组合。
版式说明
自上而下单列滚动:搜索框吸顶 → 轮播(≤5 张)→ 快捷分类一行 → 商品瀑布流;底部标签栏常驻,购物车标签带角标。
引用的组件提示词
search-bar-promptv1.0.0image-carousel-promptv1.0.0,覆盖参数:{{autoplay}} = 自动(可暂停)product-card-promptv1.0.0masonry-grid-promptv1.0.0mobile-tab-bar-promptv1.0.0
生成顺序
先按版式生成页面骨架,再逐个引用上面的组件提示词生成各部件,最后统一令牌与间距。不要把组件提示词全文复制进本场景——引用 + 覆盖即可(规格 §5.1)。
(验证状态:待复验。本场景尚未经真实模型实测,验证字段如实留空。)