黑哥 AI
切换 EN
手机端已适配;查看大图、筛选分类和复制长提示词时,用电脑浏览器访问显示效果更好。

Material 3 旅行预订应用

UI 模拟界面 Material 浅色模式

中文完整提示词

一张遵循 Material Design 3 规范的 现代移动系统 机票与酒店预订 App 浅色模式像素级 mockup。顶部 M3 搜索栏显示 「上海 → 成都 · 8月14日 · 1人」,筛选芯片行,多张航班卡片展示出发/到达时间、中转信息、时长与价格。底部导航栏四个图标,主色为暖沙色搭配深靛蓝强调色,12dp 圆角,「最佳选择」 标签芯片突出显示最优选项。

English full prompt

A pixel-perfect Android mockup following Material Design 3 guidelines for a flight and hotel booking app in light mode. The screen shows a search-results list for flights from Tokyo to Lisbon. At the top, a Material 3 search bar with rounded pill shape shows "Tokyo → Lisbon · Aug 14 · 1 adult". Below are filter chips ("Cheapest", "Fastest", "1 Stop", "Morning") in outlined style with tonal highlight on the selected chip. Each flight card is an elevated surface (2dp) with airline logo placeholder circle, departure/arrival times in large 20px medium weight, layover city, total duration, and price badge in M3 primary color (deep indigo). The bottom navigation bar has four icons: Search, Trips, Saved, Profile. Dynamic color tones use a warm sand primary with deep indigo accents. Cards have 12dp corner radius. Typography is the M3 type scale with Display Small for prices. Status bar shows Android system icons correctly. One card is visually highlighted as "Best Value" with a tonal indigo chip.

相关案例