别再只对AI说“Apple 风格”了，先给它一个 Figma 参考
很多时候，我们想做一个“像 Apple 一样干净、克制、有高级感”的网站，但真正开始设计时，很容易只停留在感觉层面：大字、留白、黑白灰、产品图、滚动动效。问题是，这些词太抽象，交给 GPT 或设计工具以后，往往会生成一个“看起来像科技官网”的页面，而不是一个真正有 Apple 风格秩序感的网站。
我的做法是：不要只描述风格，先去 Figma Community 找真实设计稿，让 GPT 或设计工具有明确参考。
本文看点
01.先找真实设计稿
02.让 GPT 复用组件
03.用提示词约束输出
01
Figma Community 是一个设计参考库
关于设计稿参考，Figma Community 其实是一个宝藏库。里面有大量官方团队、设计师、产品团队公开分享的 design file，很多质量都很高。
比如我想做一个参考 Apple 风格的网站，就不会只写一句“做成 Apple style”。我会先去 Figma Community 搜索相关关键词，找到接近目标的设计稿、组件库或官网模板，再把它作为参考源。
这里我先截图一个 Adobe 相关项目。它不是为了照抄 Adobe，而是说明：很多成熟品牌的项目在 Figma 里都有结构完整的页面、组件、交互状态和布局方式。
— Figma Community 中的品牌项目示例
这类设计稿最有价值的地方，不是视觉表面，而是它已经把很多设计决策沉淀下来了：按钮尺寸、卡片间距、标题层级、导航结构、组件状态、弹窗样式、输入框边界、hover 反馈。你不需要从零猜一遍。
02
搜索关键词要具体
如果你想找 Apple 风格，可以直接在 Figma Community 搜索这些关键词：
figma-search
apple web
apple website
apple landing page
apple design system
macOS website
iPhone landing page
比如搜索 apple web，结果大概是这样的：
— 搜索 apple web 后的结果页
搜索时不要只看封面好不好看，要点进去看文件结构。一个真正可参考的设计稿，通常会有比较完整的页面，不只是单张海报；会有可复用组件，不只是几个静态画面；最好还能看到 Button、Slider、Select、Tabs、Tooltip、Popover 这些基础控件。
找到一个合适项目后，可以先把地址贴下来，避免后面找不到：
FIGMA FILE
https://www.figma.com/community/file/1527721578857867021
— 可参考的 Apple 风格设计稿详情页
03
重点不是抄，而是让 GPT 有组件依据
很多人用 GPT 做设计时，会直接说：“帮我设计一个 Apple 风格的网站。”这样得到的结果往往不稳定，因为“Apple 风格”对模型来说只是一个模糊标签。
更好的方式是告诉它：参考这个 Figma 文件里的组件和页面结构来做。让它在同一个文件里读取并参考已有组件，然后优先搜索现有基础控件，复用组件实例，而不是重新画一套。
01
视觉更统一
按钮、输入框、卡片、弹窗来自同一套组件。
02
交互更可靠
组件自带尺寸、状态、间距和层级。
03
迭代更稳定
后续改页面时，不会越改越散。
04
可以这样给 GPT 下指令
我会把需求写得更像一个设计执行说明，而不是一句风格描述：
prompt
请参考这个 Figma Community 文件里的 Apple 风格页面和组件。
优先复用文件中已有的 Button、Slider、Select、Tabs、Tooltip、Popover 等组件实例。
保持原组件的尺寸、间距、圆角、状态和交互结构，不要重新画一套新组件。
在此基础上，为我的网站设计首页首屏、功能区、案例区和 CTA 区。
页面要保持 Apple 风格的留白、层级、产品展示感和克制的视觉节奏。
「这段提示词的关键点是：让 GPT 参考具体组件，而不是参考抽象风格。」
05
进阶：用更完整的提示词约束设计输出
如果不是做网站，而是想基于 App 原型截图做 iOS 界面优化，还可以把提示词写得更完整一些。尤其要强调三件事：不改变原有布局、不增删功能模块、不改变核心交互流程。这样 GPT 的工作就不是“重新设计一个新产品”，而是在现有原型基础上做视觉升级。
下面这段提示词来自 @yaohui12138，适合用在“给 App 原型截图做视觉优化，并生成 HTML 原型”的场景：
REFERENCE · @yaohui12138
角色：你是一位顶尖的 iOS UI/UX 设计师，拥有丰富的一线大厂（如 Apple、Google）移动应用设计经验，尤其擅长打造既美观现代又兼顾用户体验的界面。你对 Apple 的 Human Interface Guidelines（HIG）有深刻理解，并能将其原则灵活运用于视觉优化。你的设计理念是“清晰至上、体验为王、细节制胜”。
核心任务：请基于我提供的 App 原型界面截图，在严格遵守不改变现有界面整体布局、不增删功能模块、不改变核心交互流程的前提下，针对视觉美感、信息层级、操作直观性、一致性与品牌感四个维度，为每一屏或关键模块提供具体、可操作的视觉优化建议和设计方向，并且用 HTML 文件生成原型。
视觉美感与现代感：提出更现代、更符合产品主题调性的色彩方案建议，包括主色、辅色、点缀色、中性色；建议更合适的字体系统；优化图标风格、背景、卡片、按钮、分隔线、圆角、阴影、描边和质感。
信息层级与可读性：分析当前信息排版，确保重要信息突出、次要信息清晰；通过对比度、字重、间距和留白提升识别效率，让信息区块更分明。
操作直观性与易用性：针对按钮、标签、列表项等可交互元素，通过颜色、形状、状态变化提升可点击性，并确保选中状态、加载状态等视觉提示清晰且符合用户预期。
一致性与品牌感：通过统一色彩、字体、图标和组件风格，建立连贯视觉体验，并提出一到两个体现产品主题的品牌调性方向或关键视觉元素。
输出要求：使用现代 HTML5 结构生成产品 UI 设计稿；通过 CDN 引入 Google Fonts 字体；图标使用 Font Awesome CDN；响应式设计，适配移动设备；需要图片时使用可靠图片源；使用语义化标签和内联 CSS，并解释建议背后的设计思考。
约束：最重要：绝对不能改变截图所示的界面元素布局、功能分区和基本交互逻辑。所有建议需适用于 iOS 平台，并考虑 HIG 的最佳实践。专注于视觉层面的优化，而非功能性重构。
这段提示词最有价值的地方，是把“设计得好看一点”拆成四个可检查维度：视觉、层级、易用性、一致性。
它也明确限制了模型的发挥边界：只做视觉优化，不做功能重构。对于已经有原型、只想提升质感的场景，这个约束非常重要。
06
我的判断标准
1.看它有没有完整页面。只有单张视觉稿的参考价值有限，完整页面才能看出布局节奏。
2.看它有没有组件。组件越完整，越适合交给 GPT 或设计工具继续复用。
3.看它是不是接近业务场景。Apple 风格可以借鉴，但工具站、SaaS、AI 应用仍要保留清晰的信息结构和转化路径。
写在最后
想做出 Apple 风格的网站，不是靠一句“高级感”解决的。更靠谱的方法是：先去 Figma 找到高质量设计稿，再把它变成 GPT 可以理解、可以复用、可以执行的参考。
简单说，就是把“我想要 Apple 风格”改成“请参考这个 Figma 文件里的组件体系，并复用其中的结构、状态、间距和交互”。这样，设计就不再只是凭感觉，而是有了可以落地的依据。