ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

AI Prompting for Everyone 课程笔记 - P18 使用 AI 构建应用程序 Building Apps

AI Prompting for Everyone 课程笔记 - P18 使用 AI 构建应用程序 Building Apps

文章目录

  • 一、课程核心思想
  • 二、重点知识点
    • 2.1 什么是 Building Apps with AI?
    • 2.2 从描述想法到创建应用
    • 2.3 Functionality vs. Appearance
    • 2.4 Iterative App Development(迭代式应用开发)
  • 三、老师的实际案例(根据公开英文转写稿核实)
    • 3.1 案例一:Fireworks Simulator(烟花模拟器)
    • 3.2 老师提出的 Prompt 框架:Goal + Input + Output
    • 3.3 案例二:Obstacle Game(障碍物游戏)
    • 3.4 案例三:Pomodoro Timer(番茄钟)
    • 3.5 案例四:Bill Calculator(账单分摊计算器)
    • 3.6 案例五:Outfit Picker(穿搭推荐应用)
  • 四、为什么老师建议从简单应用开始?
    • 4.1 相对简单的应用
    • 4.2 相对复杂的应用
  • 五、如何写出更好的 Building Apps Prompt?
    • 5.1 普通 Prompt
    • 5.2 改进后的 Prompt
    • 5.3 为什么第二个 Prompt 更好?
  • 六、Building Apps with AI 的局限性
    • 6.1 AI 不一定一次生成成功
    • 6.2 应用复杂度会影响成功率
    • 6.3 生成应用不等于掌握软件工程
  • 七、重要英文术语
  • 八、实践练习
  • 九、复习问题
  • 十、一页速记版(Quick Review)
  • 参考资源
  • 课程 Slides
  1. The AI Novice and the AI Power User:如何成为 AI 高阶用户
  2. Pretrained Knowledge:AI 已经掌握哪些知识
  3. Web Search:如何获取外部信息
  4. Web Search Sources:如何选择和验证信息来源
  5. Using Deep Research:如何开展复杂研究
  6. Lab Overview:如何通过实验比较不同 AI 使用方式
  7. Brainstorming with AI:使用 AI 进行头脑风暴
  8. Context:上下文
  9. AI Desktop Apps:AI 桌面应用
  10. Reasoning with AI:AI 推理
  11. Sycophancy:谄媚
  12. Writing with AI:用 AI 写作
  13. AI Critique:AI 评价与批判性反馈
  14. Lab Overview: Brainstorming and Critique:实验介绍:AI 头脑风暴与批判性评价
  15. Working with Multimedia Data:处理多媒体数据
  16. Imaging Understanding:图像理解
  17. Imaging Generation:图像生成

一、课程核心思想

上一节 P17 介绍了 Image Generation(图像生成)。我们已经知道,AI 可以根据自然语言生成图片,也可以修改已有的视觉内容。但是,生成一张应用界面图片,与创建一个真正能够交互的应用程序,是两件不同的事情。

例如:

  • 图片可以展示一个计算器,但不能真正执行计算。
  • 图片可以展示一个游戏界面,但不能让玩家控制角色。
  • 图片可以展示一个待办事项列表,但不能真正添加和删除任务。

如果希望这些功能真正运行,就需要软件程序。传统上,开发软件通常需要学习编程语言、开发工具和相关技术。而现代 AI 工具使用户可以通过自然语言描述需求,让 AI 协助生成程序代码,甚至直接提供可以运行的应用原型。因此,本节介绍Building Apps(构建应用程序)。

核心结论:使用 AI 构建应用的关键,不是要求每个用户都成为专业程序员,而是让用户能够清楚描述自己想要的功能,并通过 AI 生成、运行和修改应用,将想法转化为可以实际体验的软件。

二、重点知识点

2.1 什么是 Building Apps with AI?

Building Apps with AI(使用 AI 构建应用) 是指利用 AI 将自然语言描述的需求转化为软件程序。

例如:用户希望创建一个简单的待办事项应用。

可以向 AI 提问:

Build a simple to-do list web application. Requirements: 1. Users can add new tasks. 2. Users can mark tasks as completed. 3. Users can delete tasks. 4. The interface should be simple and clean. Create a working application.

AI 可以根据要求尝试生成:

  • 用户界面。
  • 输入框。
  • 按钮。
  • 任务列表。
  • 添加和删除任务的逻辑。

用户不一定需要亲自编写每一行代码。

Traditional Programming vs. Building Apps with AI

对比维度Traditional ProgrammingBuilding Apps with AI
中文传统编程使用 AI 构建应用
主要交互方式编写程序代码使用自然语言描述需求
编程知识要求通常需要简单原型可以不要求
代码生成开发者编写AI 辅助生成
修改方式修改代码可以通过自然语言要求修改
测试方式运行和检查程序同样需要运行和检查
主要优势精确控制程序实现降低原型开发门槛

知识点:AI 可以降低编程的入门门槛,但不会消除对需求理解、功能测试和结果判断的需要。

2.2 从描述想法到创建应用

使用 AI 构建应用时,最重要的第一步是明确想要实现什么。

例如:

Build a game.

这个要求过于宽泛。AI 不知道:

  • 游戏是什么类型?
  • 玩家如何操作?
  • 游戏有什么规则?
  • 如何判断输赢?
  • 是否需要计分?
  • 游戏应该运行在哪里?

因此,可以进一步描述:

Build a simple number guessing game that runs in a web browser. Game Rules: 1. Generate a random number between 1 and 100. 2. Let the player enter a guess. 3. Tell the player whether the guess is too high or too low. 4. Count the number of attempts. 5. Show a success message when the player guesses correctly. 6. Include a restart button.

为什么第二个 Prompt 更好?
因为它明确了应用的主要行为。

Prompt 要素具体内容
Application Type数字猜谜游戏
Platform网页浏览器
User Input玩家输入数字
Game Logic判断数字大小
Feedback提示过高或过低
Success Condition猜中正确数字
Interaction重新开始按钮

学习启示:在 AI 应用开发中,清楚描述用户应该能够做什么,通常比只描述应用应该看起来怎样更重要。

2.3 Functionality vs. Appearance

创建应用时,需要区分两个重要概念:

  1. Appearance(外观)
  2. Functionality(功能性)

Appearance(外观)
指应用的视觉设计。

例如:

  • 颜色。
  • 字体。
  • 按钮形状。
  • 页面布局。
  • 图片。
  • 动画。

Functionality(功能性)
指应用是否能够完成预期任务。

例如:

  • 按钮能否点击。
  • 输入框能否接收数据。
  • 计算器能否正确计算。
  • 游戏能否正常计分。
  • 重新开始按钮能否重置状态。

两者的区别

对比维度AppearanceFunctionality
中文外观功能性
核心问题看起来怎么样?能否真正工作?
主要内容颜色、布局、样式逻辑、数据、交互
评价方法视觉检查实际操作测试
常见问题设计不美观按钮无效、逻辑错误

核心知识点:一个看起来完整的应用,不一定是一个真正能够正常工作的应用。因此,使用 AI 构建应用后,需要亲自运行并测试。

2.4 Iterative App Development(迭代式应用开发)

P12 已经介绍了 Iterative Writing(迭代式写作)。类似地,AI 应用开发也可以采用迭代方式。不必要求 AI 一次性创建包含所有功能的复杂程序。可以先生成一个简单版本,再逐步完善。

Step 1:创建初始应用

Build a simple calculator that runs in a web browser. Support: - Addition - Subtraction - Multiplication - Division

Step 2:运行应用
检查:

  • 页面是否能够正常显示。
  • 数字输入是否正常。
  • 四种运算是否正确。
  • 是否存在明显错误。

Step 3:提出修改要求
例如:

Improve the calculator. Changes: 1. Add a clear button. 2. Improve the visual layout. 3. Handle division by zero. 4. Display helpful error messages. Preserve all existing working features.

Step 4:再次测试
检查新功能是否正常。同时确认旧功能没有被破坏。

完整流程

Describe the App (描述应用需求) ↓ Generate Initial Version (生成初始版本) ↓ Run the App (运行应用) ↓ Test Functionality (测试功能) ↓ Identify Problems (识别问题) ↓ Request Improvements (提出修改要求) ↓ Test Again (重新测试) ↓ Working Prototype (获得可运行的原型)

知识点:通过多轮修改,可以逐步完善应用,而不必在第一次 Prompt 中描述所有细节。

三、老师的实际案例(根据公开英文转写稿核实)

3.1 案例一:Fireworks Simulator(烟花模拟器)

这是老师在 P18 中介绍的重要案例,也会在后面的实践实验中使用。
应用目标用户可以在网页上点击鼠标,触发烟花动画。

这个应用可以拆分成三个部分:

  1. Goal(目标):创建一个有趣的烟花模拟器。
  2. Input(输入):用户点击屏幕。
  3. Output(输出):屏幕显示彩色烟花效果。

示例 Prompt

Build a fun interactive fireworks simulator. Goal: Create a colorful fireworks experience that runs in a web browser. Input: The user clicks anywhere on the screen. Output: Display a colorful fireworks explosion at the clicked location. Requirements: - Smooth animation - Multiple firework colors - Simple interface - Interactive mouse controls

为什么这个案例重要?因为它展示了:即使不懂编程,也可以通过描述目标、输入和输出,让 AI 尝试创建一个可交互的程序。用户不需要先学习如何绘制动画或处理鼠标事件。AI 可以辅助完成这些技术细节。

核心知识点:描述应用时,明确 Goal、Input 和 Output,可以帮助 AI 理解应用需要实现什么。

3.2 老师提出的 Prompt 框架:Goal + Input + Output

这是 P18 最值得记住的知识点。

老师明确介绍了构建简单应用时可以考虑的三个组成部分。

  1. Goal(目标)
    说明希望创建什么。

例如:

Create a simple fireworks simulator.
  1. Input(输入)
    说明用户如何与应用交互。

例如:

The user clicks on the screen.
  1. Output(输出)
    说明应用应该如何响应。

例如:

Display colorful fireworks where the user clicks.

三个要素的关系

Goal (应用目标) ↓ Input (用户输入) ↓ Application Logic (应用处理逻辑) ↓ Output (应用输出)

其中 Application Logic 是为了帮助理解而补充的中间环节。

框架总结

要素核心问题烟花模拟器示例
Goal想创建什么?烟花模拟器
Input用户输入什么?点击屏幕
Output应用返回什么?彩色烟花动画

学习启示:对于简单应用,不一定需要一份非常复杂的技术需求文档。先清楚描述目标、输入和输出,就可以开始尝试。

3.3 案例二:Obstacle Game(障碍物游戏)

老师还介绍了一个可以由用户设置障碍物的游戏。

用户可以:

  • 放置障碍物。
  • 设置目标。
  • 运行模拟。
  • 观察游戏结果。

示例 Prompt

Build a simple interactive obstacle game. Goal: Let users design a small obstacle course. Input: Users can place obstacles and define a goal location. Output: Run a simulation showing how the game behaves. Requirements: - Interactive obstacle placement - Clear visual feedback - Restart functionality

为什么这个案例有价值?因为它不仅涉及静态页面,还涉及用户输入和程序状态。

例如:

  • 用户放置的障碍物需要被记录。
  • 游戏需要根据障碍物位置运行。
  • 用户需要看到操作结果。

知识点:AI 可以辅助创建包含交互逻辑的小型应用,而不只是静态网页。

3.4 案例三:Pomodoro Timer(番茄钟)

老师还介绍了一个更加实用的应用:Pomodoro Timer(番茄钟)。它是一种帮助用户管理工作和学习时间的计时工具。

常见的番茄工作法使用:

  • 25 分钟专注工作。
  • 5 分钟短暂休息。

示例 Prompt

Build a simple Pomodoro timer. Goal: Help users manage focused work sessions. Input: Users click Start, Pause, or Reset. Output: Display a countdown timer. Requirements: - 25-minute work session - 5-minute break - Start button - Pause button - Reset button - Clear visual countdown

Goal + Input + Output

要素具体内容
Goal帮助用户管理学习时间
Input开始、暂停、重置
Output倒计时和当前状态

为什么适合初学者?因为番茄钟:

  • 功能明确。
  • 交互简单。
  • 不需要复杂数据库。
  • 容易测试。
  • 可以在短时间内完成原型。

知识点:初学者应该优先选择目标明确、功能简单的应用进行练习。

3.5 案例四:Bill Calculator(账单分摊计算器)

老师还介绍了一个账单分摊工具。假设你和朋友一起吃饭,需要计算每个人应该支付多少钱。

应用目标
根据总账单金额和人数,计算每个人需要支付的金额。

示例 Prompt

Build a simple bill splitting calculator. Goal: Help friends split a restaurant bill. Input: 1. Total bill amount 2. Number of people Output: Display how much each person should pay. Requirements: - Simple input fields - Calculate button - Clear result display - Handle invalid inputs

Goal + Input + Output

要素具体内容
Goal分摊账单
Input总金额、人数
Output每人应付金额

例如:总金额为 120 美元,人数为 4 人。每人应付:
120 ÷ 4 = 30 120 \div 4 = 30120÷4=30

即每人 30 美元。

为什么这个案例重要?因为它说明 AI 不只适合生成娱乐性应用,也可以帮助用户创建日常实用工具。

3.6 案例五:Outfit Picker(穿搭推荐应用)

老师还介绍了一个根据天气帮助用户选择服装的应用。

应用目标
根据天气条件,推荐合适的穿搭。

示例 Prompt

Build a simple outfit picker app. Goal: Help users choose what to wear. Input: - Temperature - Weather conditions Output: Suggest an appropriate outfit. Requirements: - Simple weather input - Clear outfit suggestions - Friendly interface

为什么这个案例值得注意?因为它可以有不同的实现复杂度。

简单版本:用户手动输入天气信息,应用根据预设规则推荐服装。

复杂版本:应用自动获取实时天气数据,再结合用户偏好推荐穿搭。

复杂版本需要额外考虑:

  • 天气 API。
  • 网络请求。
  • 用户位置。
  • 数据更新。
  • API 错误处理。

老师在本节强调初学者应从简单应用开始,因此可以先实现手动输入天气的版本。

四、为什么老师建议从简单应用开始?

这是 P18 的另一个核心观点。老师指出,有些应用相对容易构建,有些则明显更加复杂。

4.1 相对简单的应用

老师举出的例子包括:

  • 简单的平台跳跃游戏(Platformer Game)。
  • 法语词汇练习(French Vocabulary Quiz)。
  • 番茄钟。
  • 账单分摊器。
  • 简单的互动游戏。

这些应用通常具有以下特点:

  1. 目标明确。
  2. 输入和输出清晰。
  3. 功能范围有限。
  4. 不依赖大量外部数据。
  5. 可以在浏览器中快速体验。

4.2 相对复杂的应用

老师举出的例子包括:

  • 通过互联网进行的多人游戏。
  • 能够提供实时 AI 反馈的法语口语练习系统。

这些应用可能需要:

  • 网络通信。
  • 实时状态同步。
  • 用户账户。
  • 音频处理。
  • AI 模型调用。
  • 更多测试和工程工作。

简单应用 vs. 复杂应用

对比维度Simple AppsComplex Apps
中文简单应用复杂应用
功能数量较少较多
输入输出比较明确可能更加复杂
外部依赖通常较少可能较多
测试难度较低较高
初学者适用性更适合入门需要更多迭代与技术支持

老师的核心建议:如果刚开始使用 AI 构建应用,可以先尝试简单、有趣且功能明确的项目。通过不断尝试,逐渐形成对哪些任务容易、哪些任务困难的判断。

五、如何写出更好的 Building Apps Prompt?

5.1 普通 Prompt

Build a useful app.

这个 Prompt 没有明确:

  • 应用的目标。
  • 用户需要输入什么。
  • 应用应该输出什么。

因此,AI 需要自行做出大量假设。

5.2 改进后的 Prompt

以课程中的账单分摊器为例:

Build a simple bill splitting web application. Goal: Help a group of friends split a restaurant bill equally. Input: 1. Total bill amount 2. Number of people Output: Show the amount each person needs to pay. Requirements: - Simple and clean interface - Clear input labels - Calculate button - Display results to two decimal places - Handle zero or invalid inputs Make the application interactive and easy to use.

5.3 为什么第二个 Prompt 更好?

Prompt 要素具体内容
Goal计算每个人的账单金额
Input总金额、人数
Output每人应付金额
Requirements界面、按钮、输入检查
Interaction用户可以实际操作

其中,Goal + Input + Output 是老师明确介绍的核心框架。其他要求是我补充的工程实践建议。

六、Building Apps with AI 的局限性

6.1 AI 不一定一次生成成功

即使 Prompt 很明确,生成的应用仍可能出现:

  • 按钮无法使用。
  • 计算结果错误。
  • 页面布局异常。
  • 游戏规则没有正确实现。

因此,需要运行应用并检查结果。

6.2 应用复杂度会影响成功率

通常来说,功能越复杂,涉及的条件和依赖越多,开发和测试难度就越高。

例如:简单的法语单词选择题应用,通常比实时语音对话练习系统容易实现。

因此,不应一开始就要求 AI 构建功能庞大的复杂平台。

6.3 生成应用不等于掌握软件工程

AI 可以帮助用户创建原型,但正式应用还可能涉及:

  • 数据安全。
  • 用户隐私。
  • 性能。
  • 部署。
  • 长期维护。
  • 错误处理。

这些是我的扩展知识,并非 P18 的主要讲授内容。

学习启示:可以先利用 AI 快速验证创意,再根据应用的实际用途决定是否需要更专业的软件工程工作。

七、重要英文术语

English中文解释
Building Apps构建应用利用 AI 创建可运行的软件
Goal目标应用希望实现的目的
Input输入用户提供给应用的信息或操作
Output输出应用返回的结果
Web Application网页应用在浏览器中运行的程序
Interactive App交互式应用可以响应用户操作的应用
Fireworks Simulator烟花模拟器根据点击生成烟花效果的程序
Obstacle Game障碍物游戏允许用户设置障碍物的游戏
Pomodoro Timer番茄钟管理专注和休息时间的计时工具
Bill Calculator账单计算器计算或分摊账单的工具
Outfit Picker穿搭推荐工具根据条件推荐服装的应用
Platformer Game平台跳跃游戏角色在平台间移动的游戏
Vocabulary Quiz词汇测验用于练习词汇的互动程序
Prototype原型用于验证想法的初步程序
Iteration迭代根据反馈不断改进
Functionality功能性应用能否完成预期任务
User Interaction用户交互用户与应用之间的操作和反馈

八、实践练习

Exercise 1:使用 Goal + Input + Output 设计应用
选择一个简单应用,例如:

  • 番茄钟。
  • 账单分摊器。
  • 猜数字游戏。
  • 单词测验。
  • 简单计算器。

按照以下模板编写 Prompt:

Build a simple web application. Goal: [Describe what the app should do.] Input: [Describe what the user provides.] Output: [Describe what the app returns.] Additional Requirements: [List any important requirements.] Make the app interactive and easy to use.

练习目标:掌握老师介绍的 Goal + Input + Output 框架。


Exercise 2:创建烟花模拟器
使用以下 Prompt:

Create an interactive fireworks simulator. Goal: Let users create colorful fireworks. Input: The user clicks anywhere on the screen. Output: Show a fireworks explosion at the clicked position. Requirements: - Different firework colors - Smooth animations - Simple interface - Restart functionality

运行后检查:

  1. 点击屏幕是否出现烟花?
  2. 烟花是否出现在正确位置?
  3. 动画是否流畅?
  4. 是否存在明显错误?

练习目标:体验通过自然语言创建可交互的程序。


Exercise 3:比较简单应用与复杂应用
首先要求 AI 创建:

Build a simple French vocabulary quiz. Show a French word and four English answer options. Tell the user whether the selected answer is correct.

然后尝试提出:

Build a real-time French speaking practice application. The user should speak French through a microphone. The AI should listen, understand the speech, and provide pronunciation feedback.

比较:

  1. 哪个应用更容易生成?
  2. 哪个需要更多工具或权限?
  3. 哪个更容易测试?
  4. 哪个存在更多潜在错误?

练习目标:理解老师为什么建议从简单应用开始。

以上练习依据 P18 原始案例和核心方法设计,具体 Prompt 为我的教学改写。

九、复习问题

Q1:P18 的核心学习目标是什么?
答:学会通过自然语言向 AI 描述应用需求,让 AI 辅助创建简单、可交互的网站、游戏和应用程序。

Q2:老师介绍的三个 Prompt 要素是什么?
答:Goal(目标)、Input(输入)和 Output(输出)。

Q3:为什么烟花模拟器适合用于演示 AI 应用构建?
答:因为它具有明确的目标、简单的用户输入和直观的视觉输出。

Q4:老师介绍了哪些实用应用?
答:番茄钟、账单分摊器和穿搭推荐工具等。

Q5:为什么老师建议初学者从简单应用开始?
答:因为简单应用通常功能明确、外部依赖少、容易运行和测试,有助于逐步理解 AI 能够完成哪些开发任务。

Q6:AI 能够生成一个应用,是否意味着它一定能正常运行?
答:不一定。仍然需要实际测试,并通过反馈修复问题。

十、一页速记版(Quick Review)

核心思想:Building Apps with AI 让没有编程基础的用户,也能够通过自然语言描述目标、输入和输出,尝试创建简单的交互式应用。

三个重要知识点:

  1. Goal:明确想要创建什么。
  2. Input:明确用户如何与应用交互。
  3. Output:明确应用应该产生什么结果。

三个核心原则:

  1. Specify the goal, input, and output.
    明确应用目标、输入和输出。
  2. Start with simple, well-defined applications.
    从简单、目标明确的应用开始。
  3. Experiment and learn what AI can build.
    通过不断尝试,了解 AI 能够构建什么,以及它的能力边界。

P16 → P19 的知识逻辑

P16 — Image Understanding ↓ AI 如何理解已有图片? ↓ P17 — Image Generation ↓ AI 如何生成和修改图片? ↓ P18 — Building Apps ↓ 如何通过 Goal、Input 和 Output 让 AI 构建简单的交互式应用? ↓ P19 — Data Analysis ↓ 如何让 AI 编写并运行代码, 分析数据和生成图表?

最终总结:P18 的重点不是学习如何手写程序代码,而是理解如何通过自然语言清楚描述应用需求。老师提出的 Goal + Input + Output 框架,是本节最值得掌握的方法。对于初学者,应该从烟花模拟器、番茄钟、账单计算器等简单应用开始,通过实际运行和不断尝试,逐步了解 AI 应用构建的能力与局限。

参考资源

  1. 吴恩达《给所有人的人工智能提示词课程|AI Prompting for Everyone》DeepSeek-v4-pro翻译
  2. DeepLearning.AI — AI Prompting for Everyone 官方课程
  3. Full AI Prompting Course with Andrew Ng — 公开英文转写稿

课程 Slides





返回列表