各位教育同仁，大家好！

在日常教学中，我们常常思考如何利用日新月异的技术手段，更有效地激发学生兴趣、优化教学环节、提升学习成效。今天，我想和大家分享一个我近期关注并认为极具潜力的工具——扣子空间（Coze Space），以及如何运用它，特别是通过精心设计的“提示词”，来赋能我们的教学网页设计，真正实现技术为教育服务。

链接：extension://hfaciehifhdcgoolaejkoncjciicbemc/capture.html?id=15&url=https%3A%2F%2Fspace.coze.cn%2Fweb%3Furi%3D7496782662490095679%252F%25E4%25BA%2594%25E5%25B9%25B4%25E7%25BA%25A7%25E6%259C%259B%25E5%25BA%2590%25E5%25B1%25B1%25E7%2580%2591%25E5%25B8%2583%25E7%25BD%2591%25E9%25A1%25B5-1a27e5d448.jsx

一、认识扣子空间（Coze Space）：从“机器人”到“教学应用”的飞跃

首先，我们来厘清一个概念。大家可能听说过“扣子（Coze）”，它是一个强大的 AI Bot 开发平台，我们可以用它来创建、调试和发布各种功能的 AI 机器人（Bot）。你可以把它想象成一个能让你“训练”出专属智能助手的工厂。

而扣子空间（Coze Space），则是在“扣子”能力基础上的进一步延伸和聚焦。如果说“扣子”是制造引擎的地方，那么“扣子空间”更像是利用这些引擎来构建具体应用（Application）的车间，尤其是面向用户交互的应用，比如我们今天要重点讨论的网页应用。它让 AI 的能力不再仅仅停留在对话交互层面，而是能够生成可视化的、可交互的、具有特定功能的网页界面。简单来说：

扣子（Coze）： 侧重于创建和管理 AI Bot 这个“大脑”本身。

扣子空间（Coze Space）： 侧重于利用 AI Bot 的能力，快速构建面向最终用户的应用程序，如网页，让“大脑”有了更具体的“身体”和“展示窗口”。

推荐阅读：扣子空间简介

网址：https://space.coze.cn/

功能：设计小游戏，网页，课件；复杂多任务处理，如旅行规划、数据分析、项目管理、复杂工作流；其他产品功能和智能体交互，例如已集成了地图、飞书文档、表格、天气、图像、语音图像工具，数据库等。

让我们首先看一个简单的案例（网友实测，上百人同时在线使用，毫无压力）

链接：https://space.coze.cn/web?uri=7496759567129296922%2F%E5%B0%8F%E5%AD%A6%E7%94%9FAI%E5%9B%BE%E7%89%87%E7%94%9F%E6%88%90-d0a8d9b36f.jsx

提示词（仅供参考，可以根据需要优化，比如加上歌曲）：制作一个AI图片生成网页，界面要卡通一点，给小学生使用的，我希望输入提示词后，点击生成后，调用拓展工具，生成图片并展示在页面中。

是不是很简单呢？对于我们教育工作者而言，这意味着我们可以利用扣子空间，将复杂的AI 能力，封装成一个个简单易用、直观可见的教学网页，服务于我们的课堂内外。

二、提示词：驾驭AI 进行教学网页设计的“金钥匙”

拥有了像扣子空间这样的强大工具，如何有效驾驭它呢？答案就是高质量的“提示词”（Prompt）。

提示词，本质上是我们与AI 沟通的语言，是我们向 AI 下达指令、描绘蓝图的方式。一个好的提示词，就像一份详尽清晰的教学设计或项目需求文档，能够引导 AI 精准地理解我们的意图，生成符合我们期望的教学网页。反之，模糊、笼统的提示词，则可能导致生成结果偏离目标，效率低下。

尤其是在教育教学网页设计这个场景下，我们不仅仅是要求AI 搭建一个网页框架，更重要的是要让这个网页蕴含教育思想、符合认知规律、服务教学目标。这就对提示词提出了更高的要求。

三、精雕细琢：利用优化模板创作高质量教学网页提示词

为了帮助大家，特别是刚刚接触这类工具的“小白老师”，能够快速上手，生成高质量的教学网页，经过研究，打磨出了一个“中小学教学网页生成提示词模板”。这个模板的核心思想是将一个教学网页的需求，系统化、结构化地拆解为AI 更容易理解和执行的指令。

下面，我将结合多次实践的结果，详细解读如何利用这个模板的各个部分，做好教育教学中的网页设计：

【第一部分：设定目标与背景】—— 明确方向，有的放矢

我的角色& 目标学生群体： 这不仅仅是告诉 AI 你的身份，更是在设定教学情境。是小学低年级充满好奇心的孩子，还是初中需要逻辑思辨的学生？不同的用户决定了网页的语言风格、交互复杂度、知识呈现方式。这是个性化教学网页设计的基石。

核心教学目标& 网页主要用途： 这是网页设计的“灵魂”。我们必须清晰地告诉 AI，这个网页最终要帮助学生达成什么学习目标（是掌握知识？培养技能？还是激发兴趣？），以及它在整个教学流程中扮演的角色（是课前引导？课堂探究？还是课后巩固？）。目标明确，设计才不会偏离航向。

【第二部分：定义网页核心内容与结构】—— 内容为王，结构清晰

教学主题/知识点 & 网页标题： 聚焦核心内容，一个好的标题能画龙点睛。

网页板块设计：这是网页的“骨架”。我们需要像设计一堂课的环节一样，规划好网页的逻辑结构。每个板块应该包含什么？

文字内容：这是知识传递的核心载体。是需要AI 整理知识点，解释概念，还是直接呈现原文、案例？模板中提示可以引用【飞书文档】等，这体现了与现有教学资源的整合能力。

视觉元素(AI创作)： “一图胜千言”。教学网页尤其需要借助图片、插画、图表来增强直观性、趣味性。我们要具体描述希望 【图像工具】 生成什么样的视觉内容（是卡通示意图？科学插画？还是意境图？），这能极大丰富网页的表现力。

音频元素(AI创作)： 声音是重要的教学媒介。无论是 【语音合成】 标准的诗歌朗读、单词发音，还是 【音乐生成】 烘托气氛的背景音乐，都能有效调动学生的多种感官。明确需求，让网页“声”动起来。

结构化呈现：将内容分解到不同的板块，并按逻辑顺序列出，保证了信息的条理性和学生的学习路径清晰。

【第三部分：整合外部信息与互动功能】—— 拓展边界，增强体验

外部信息集成：现代教学需要打破信息孤岛。如果需要结合地理位置（【高德地图】）、实时天气（【墨迹天气】）、表格数据（【飞书表格】）等，明确提出，可以让网页内容更丰富、更贴近现实。

互动功能设计：互动是提升参与度和学习效果的关键。即使是简单的选择题反馈、点击显示答案，或是模拟的图片上传区，都能让静态的网页“活”起来，从单向灌输变为双向交流。明确互动形式，让 AI 构建相应的界面元素。

【第四部分：设定风格与布局】—— 视觉引导，美观易用

整体风格& 色彩搭配 & 布局要求： 网页的“颜值”和“骨架”同样重要。是活泼的卡通风，还是严谨的科技风？是暖色调营造温馨感，还是冷色调体现专业性？是卡片式方便浏览，还是时间轴展现历程？清晰的风格描述能确保网页符合教学场景的氛围和学生的审美偏好，良好的布局则保证了信息的易读性和操作的便捷性。

【第五部分：核心需求总结】—— 聚焦重点，画龙点睛

一句话核心需求：这有助于我们自己再次聚焦最重要的目标，也让AI 能在众多指令中抓住主要矛盾，优先确保核心功能的实现。

再来看一个示例：

https://space.coze.cn/web?uri=7496811876756701218%2F%E4%BD%8E%E5%B9%B4%E7%BA%A7%E5%9B%BE%E5%BD%A2%E8%AE%A4%E7%9F%A5%E7%BD%91%E9%A1%B5-ab1fb3a522.jsx

提示词：

“制作一个帮助小学低年级学生认知基本平面图形（圆形、正方形、长方形、三角形）的互动网页。

页面设计：

色彩鲜艳、卡通风格，吸引小朋友注意力。

主要内容：

图形展示区：分别展示四种图形的清晰图像（可利用图像工具生成标准图形）。

图形名称与读音：每个图形旁边标注名称，并配上读音（可利用语音合成）。

特性介绍：用简单的语言描述每种图形的特点（如：正方形有4条一样长的边和4个直角）。

互动小游戏：‘图形匹配’ - 左边随机出现一个图形名称，右边出现多个图形，让学生点击选择正确的图形，并给出反馈。”

使用方法：添加提示词后，扩展中添加：图像工具、语音合成。

提示词参考模板：

1. 教学目标与主题：

适用年级/学科： [例如：小学四年级语文 / 初中物理 / 全校安全教育]

学习主题/教学目标： [例如：学习古诗《静夜思》并理解其意境 / 掌握物质密度的概念 / 提高交通安全意识]

2. 网页基本信息：

主要面向用户：[例如：本班学生 / 对该主题感兴趣的师生 / 学生及家长]

网页标题建议：‘[例如：静夜思互动学习卡 / 密度的奥秘 / 安全出行我知道]’（可选，留空则由你构思）

3. 网页核心内容与板块结构（这是最重要的部分，请尽量详细）：

板块一：[板块一的标题，如：诗歌原文与作者]

内容说明：[详细描述该板块应展示什么信息、知识点、图片需求（可提示使用图像工具生成）、文字说明等。例如：清晰展示《静夜思》原文及注音，介绍诗人李白生平，配一张李白画像（图像工具生成）。]

板块二：[板块二的标题，如：词语解释与诗意]

内容说明：[同上。例如：解释“床前明月光”、“疑是地上霜”等重点词句意思，用通俗语言讲解全诗大意，配一张月夜思乡意境图（图像工具生成）。]

板块三：[板块三的标题，如：互动小练习]

内容说明：[同上。例如：设置2-3个关于诗歌内容的选择题，要求有明确的选项和答案反馈提示。]

（根据需要继续添加板块四、板块五...）

4. 期望风格与视觉效果：

整体风格：[描述期望的整体感觉，如：清新淡雅的中国风 / 科学严谨的科普风 / 色彩鲜艳的卡通趣味风 / 简洁明了的知识卡片风 / 活泼动感的运动风 等]

色彩偏好（可选）：[例如：以蓝色和白色为主 / 暖色调 / 绿色环保主题色]

5. 需要的特殊功能或元素（请说明，即使是概念性或静态的）：

[例如：需要生成多张图片（图像工具）、需要嵌入音频的占位符、需要展示地图示意图（可用图像工具生成）、需要简单的问答互动形式（选择题/判断题）、需要信息卡片式布局、需要生成表格框架用于记录、需要图片上传区域的样式 等。没有特别需求则填“无”。]

6. 网页主要用途：

[说明这个网页主要用来做什么，如：课前预习引导 / 课堂互动展示 / 课后复习巩固 / 主题活动宣传 / 实验过程记录 / 学习成果展示 / 知识普及查阅 等]

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

你是不是有些心动呢？理论的阐述和模板的构建为我们指明了方向，但鲜活的实例往往更能激发灵感、点亮思路。为了帮助大家更直观地理解如何运用提示词模板进行创作，并能快速上手实践，接下来我将分享一些我们经过思想碰撞出的、覆盖不同学科和教学场景的提示词示例。这些示例既是模板应用的具体参照，也希望能为大家提供一个可供借鉴和改造的起点。请老师们仔细研读，或许其中的某个例子就能直接应用于您的教学设计，或是启发您构思出更具个性化的精彩网页！

提示：使用时一定要加上对应的MCP扩展！如：高德地图、图像工具、音乐生成、语音合成！如果希望精准的生成需求的内容，可以上传你的文档或链接！

1. 制作“古诗词互动学习卡片”网页

提示词:

“请为小学五年级学生制作一个学习《望庐山瀑布》这首古诗的互动网页。页面风格要清新、有中国水墨画元素。

主要内容包括：

诗词原文及注音：清晰展示诗句，并为难字注音。

作者简介：简要介绍李白。

诗词大意：用通俗易懂的语言解释诗句意思。

重点词语解释：如“生紫烟”、“遥看”、“挂前川”。

意境赏析：用图文结合（可调用图像工具生成庐山瀑布相关的意境图）的方式，引导学生感受诗歌的壮丽景象。

互动问答：设置2-3个关于诗词理解的选择题，点击选项后能给出对错反馈。

朗读音频（可选）：如果可能，嵌入一个标准的诗词朗读音频（可调用语音合成）。

整体布局要简洁明了，适合学生在线学习和复习。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

2. 生成“班级植物角观察日记”展示网站

提示词:

“为我们班级的‘植物角’活动创建一个简单的展示网站，用来记录和分享同学们种植的绿豆发芽过程。

网站要求：

首页：标题为‘三（1）班植物角观察日记’，配上活泼的植物插画背景。

主要板块：‘观察日记’。

‘观察日记’板块：

允许上传图片（需要生成支持图片上传和展示的功能区域）。

每个条目包含：学生姓名、观察日期、文字记录（描述植物变化）、上传的植物照片。

以卡片或时间线的形式展示不同学生的观察记录。

风格：绿色、自然、充满童趣。

导航：简单清晰，方便学生和家长浏览。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

3. 制作“汉字偏旁部首”学习卡片网页

提示词:

“请为小学低年级学生创建一个学习常见汉字偏旁部首的网页，形式像翻动卡片一样。

要求：

卡片式布局：每张卡片介绍一个偏旁部首。

卡片内容（每张）：

偏旁部首：清晰展示该偏旁（如：氵，亻，木）。

名称：标注其名称（如：三点水，单人旁，木字旁）。

含义/来源（可选）： 简单说明该偏旁通常与什么有关（如：氵与水有关）。

例字：给出2-3个包含该偏旁的简单汉字（如：河、海；你、他；树、林），并配上拼音。

图片辅助（可选）：用图像工具为每个偏旁或例字生成简单的示意图。

包含部首：优先包含“氵、亻、木、口、土、扌、讠、彳、宀、女”。

风格：色彩明快，字体大而清晰，适合儿童认读。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

4. 生成“丝绸之路历史节点”可视化地图网站

提示词:

“为初中历史课创建一个关于‘丝绸之路’的可视化学习网站。

核心功能：

嵌入地图：在网页中嵌入一个中国及中亚区域的地图（可能需要结合地图类工具思路，或生成带有地图图片的静态网页）。

标注关键节点：在地图上标注丝绸之路上的重要城市或地点（如长安、敦煌、撒马尔罕等）。

信息弹窗：点击地图上的标注点，弹出信息窗口，简要介绍该地点的历史意义、相关事件或文化特色（图文并茂）。

时间线（可选）：如果能实现，添加一个简易时间线，展示丝绸之路兴衰的关键时间点。

风格：界面简洁，有历史感，重点突出地图和信息点。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

5. 制作“安全教育（防溺水）”宣传网页

提示词:

“面向小学生制作一个关于‘夏季防溺水’安全教育的宣传网页。

内容要求：

醒目标题：如‘珍爱生命，预防溺水’。

图文并茂：使用卡通图片（可用图像工具生成）和简洁文字，列出常见的溺水危险区域（如河流、池塘、水库）。

‘六不准’原则： 清晰列出防溺水的‘六不准’内容。

求救方法：简单介绍发现同伴溺水时正确的求救方法（大声呼救、找成人帮忙、不盲目下水）。

动画短片（若能支持）：嵌入一个简短的防溺水教育动画（或提示可以后续手动嵌入视频链接）。

页面风格：颜色鲜明，重点突出，信息易于理解和记忆。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

6. 制作“小小科学家实验站”网页——以“水的表面张力”为例

提示词:

“请为小学中年级科学课创建一个关于‘水的表面张力’的小实验指导网页。页面设计得像一个有趣的‘科学实验站’。

需要包含以下板块：

实验名称：水的表面张力真神奇！

实验材料：清晰列出所需材料（如：碗、水、胡椒粉、肥皂/洗洁精、滴管），最好配上简单的材料图标（可用图像工具生成）。

实验步骤：

用编号列出清晰的步骤（① 碗里倒水；② 撒上胡椒粉；③ 观察胡椒粉分布；④ 滴管沾肥皂水；⑤ 滴入碗中央；⑥ 观察现象）。

关键步骤配上简单的示意图（可用图像工具生成）。

“哇！为什么会这样？”（原理简析）： 用儿童能懂的语言简单解释水的表面张力以及肥皂破坏表面张力的原理。

想一想：提出1-2个开放性问题，鼓励学生思考（如：除了胡椒粉，还能用什么代替？生活中哪里还能看到表面张力？）。

安全提示：提醒学生在成人指导下进行实验。

风格：活泼、图文并茂、色彩明亮，激发学生动手操作的兴趣。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

7. 生成“班级图书角”新书推荐与借阅记录网页

提示词:

“创建一个‘四（2）班智慧书角’的班级图书网页，方便向学生推荐新书和简单记录借阅情况。

主要功能区：

新书推荐：以卡片形式展示近期推荐的3-5本书籍。每张卡片包含：

书籍封面图片（需要支持上传或用图像工具生成示意图）。

书名、作者。

一句话推荐语。

我是小小图书管理员（借阅记录区）：一个简单的表单区域，让负责的同学可以输入：借阅日期、书名、借阅人姓名、归还状态（已还/未还）。（注意：这可能生成静态表单，实际记录功能需后续开发或手动维护，但可以生成界面）。

阅读之星：展示本月阅读量最高的几位同学名字和照片（需支持上传）。

页面风格：温馨、简洁，有书香气息，色彩柔和。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

8. 制作“英语语法小课堂——名词复数规则”学习网页

提示词:

“为小学英语设计一个专门讲解‘名词复数规则’的互动学习网页。

内容结构：

标题：名词复数变变变！

规则一：一般情况加-s （配例子：book -> books, cat -> cats，最好有图片配合，可用图像工具）。

规则二：以s, x, sh, ch 结尾加 -es （配例子：bus -> buses, box -> boxes）。

规则三：辅音字母+y 结尾，变 y 为 i 加 -es （配例子：baby -> babies, city -> cities）。

规则四：不规则变化（配例子：man -> men, child -> children）。

小练习：提供5个单数名词，让学生写出其复数形式（生成输入框和提交按钮，或直接做成选择题），并给出答案核对。

发音提示（可选）：对-s 和 -es 的不同发音做简单说明，或用语音合成给出示例读音。

风格：英文学习风格，图文清晰，规则明确，互动性强。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

9. 生成“红领巾广播站”节目预告与在线收听（链接）网页

提示词:

“为学校‘红领巾广播站’制作一个节目预告和往期节目收听（提供链接）的网页。

页面板块：

本周节目预告：显示本周每天的广播主题、主持人和播出时间。

往期精彩回顾：

以列表或卡片形式展示往期节目标题。

每期节目提供一个‘点击收听’的按钮（需要能链接到存储音频文件的地址，提示词中说明需要预留链接位置）。

可以配上当期节目相关的图片（用图像工具生成或上传）。

我是小主播（投稿区）：简单介绍投稿要求和联系方式（或生成一个简单的文本提交框用于收集建议）。

风格：阳光、向上，体现少先队特色，色彩可以用红、黄为主。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

10. 制作“走进故宫”线上研学前置学习网页

提示词:

“为配合初中生‘走进故宫’线上研学活动，制作一个前置学习网页。

核心内容：

故宫简介：简述故宫的历史地位（明清皇宫、世界文化遗产）。

主要建筑导览：

展示故宫平面图（可用图像工具生成或用现有素材提示）。

重点介绍几个核心宫殿（如太和殿、乾清宫、御花园），点击名称或图片区域，弹出文字介绍和代表性图片（可用图像工具生成相关风格图片）。

趣味知识问答：设置3-5个关于故宫历史或建筑知识的选择题，检验预习效果。

研学任务提示：列出线上研学过程中需要重点观察和记录的内容。

风格：古典、庄重，有中国传统文化韵味，信息结构清晰，便于学生预习。”

请根据以上要求，生成一个结构清晰、内容丰富、符合教学需求的网页。

各位同仁，扣子空间（Coze Space）及其网页生成能力，为我们提供了一个前所未有的机遇，让我们能够以更低的门槛、更高的效率，将先进的 AI 技术融入日常教学，创造出个性化、交互式、富媒体的教学资源。而掌握以结构化模板为代表的高质量提示词撰写方法，正是我们驾驭这一强大工具的关键。

这并非要求每一位老师都成为编程专家或AI 大师，而是鼓励我们以教育者的智慧，去引导和塑造 AI 的能力，让它真正服务于我们的学生，服务于我们的课堂。

从今天起，让我们尝试使用这个模板，将我们的教学创意转化为一个个生动实用的教学网页。在这个过程中，我们或许会遇到挑战，但更多的是探索的乐趣和创新的可能。我相信，只要我们勇于尝试，善于思考，定能借助AI 的翅膀，在信息技术与教育教学深度融合的道路上，飞得更高，走得更远，共同谱写智慧教育的新篇章！

理论的光芒，终究要在实践中绽放。令人欣喜的是，在我们积极探索的社群中，已经有先行者开始了精彩的尝试。下面您将看到的这个富有创意的提示词示例，正是来自我们社群的“一个夸克”朋友的热情分享。榜样就在眼前，心动不如行动，您是否也准备好亲自体验一番，开启属于您的AI教学网页创作之旅了呢？

链接：https://space.coze.cn/web?uri=7496807281808457763%2F%E7%BD%91%E7%BB%9C%E8%A1%8C%E4%B8%BA%E7%AD%94%E9%A2%98%E7%B3%BB%E7%BB%9F-8d01b128d0.jsx

期待与各位同仁一起，在实践中不断探索，分享更多精彩的应用案例！

更多提示词，可以前往我们的知识星球！