<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0">
    <channel>
        <title><![CDATA[00's blog]]></title>
        <description><![CDATA[A blog about technology and life]]></description>
        <link>https://tophci.com</link>
        <generator>RSS for Node</generator>
        <lastBuildDate>Mon, 16 Feb 2026 10:41:47 GMT</lastBuildDate>
        <atom:link href="https://tophci.com/feed.xml" rel="self" type="application/rss+xml"/>
        <item>
            <title><![CDATA[生成式 UI：框架、协议与实现类型]]></title>
            <link>https://tophci.com/posts/260207-genui-framework</link>
            <guid isPermaLink="true">https://tophci.com/posts/260207-genui-framework</guid>
            <category><![CDATA[Agent]]></category>
            <category><![CDATA[UI]]></category>
            <category><![CDATA[GenUI]]></category>
            <category><![CDATA[Coding]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 05 Feb 2026 16:00:00 GMT</pubDate>
            <content:encoded>
生成式 UI 是由 AI 根据用户的上下文、意图和数据，实时动态地创建和调整的用户界面，目标是提供适应用户需求与场景的个性化体验。

Generative UI 的核心是从&quot;设计界面&quot;转变为&quot;设计能够生成界面的系统&quot;。

| GenUI 优点                                                                                                                                                                                                                                        | GenUI 挑战                                                                                                                                                                                                                               |
| :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **个性化**：提供针对用户角色、偏好和工作流程定制的界面。&lt;br /&gt;**快速原型设计**：即时从提示生成 UI，加速设计迭代过程。&lt;br /&gt;**动态适应性**：用户界面可根据上下文或用户行为实时改变。&lt;br /&gt;**设计到开发成本降低**：缩小设计、开发和部署之间的差距。 | **质量控制风险**：生成的 UI 不一定符合品牌或无障碍标准。&lt;br /&gt;**安全问题**：运行时生成的动态用户界面引入了风险。&lt;br /&gt;**性能开销**：若未经过优化，实时生成可能会拖慢性能表现。&lt;br /&gt;**用户体验一致性**：若缺乏约束，界面体验可能不一致。 |

目前 GenUI 做得比较好的产品：

|              | **Gemini-Visual Layout**                                                                                                                         | 灵光-全模态内容                                                                                                                   | **Gemini-Dynamic View**                                                                                    | 灵光-闪应用                                                                                                |
| :----------- | :----------------------------------------------------------------------------------------------------------------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------- |
| 截图         | ![260207-genui-1-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/260207-genui-1-s.png)**互动杂志**Server Driven UI/DSL实现（组件/模块级) | ![260207-genui-2-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/260207-genui-2-s.jpg)**互动杂志**HTML 实现（像素/标签级) | ![260207-genui-3-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/260207-genui-3-s.png)**迷你 App** | ![260207-genui-4-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/260207-genui-4-s.jpg)**迷你 App** |
| **主要目标** | “看”：优化信息的阅读和浏览体验。                                                                                                                 |                                                                                                                                   | “用”：通过交互来探索数据或完成任务。                                                                       |                                                                                                            |
| **原理**     | 将文本、图片、视频进行美学排版，整理成模块化卡片。                                                                                               |                                                                                                                                   | LLM/Agent 实时编写代码，生成一个可交互可独立部署的 html， iframe 嵌入到页面中呈现                          |                                                                                                            |
| **典型场景** | 旅游攻略、产品对比、购物清单、灵感搜集。                                                                                                         |                                                                                                                                   | 交互式图表、计算器、学习模拟器、个性化选品。                                                               |                                                                                                            |

## **生成式 UI 如何工作**

GenUI 解读意图（来自用户指令、系统状态或历史数据）并生成相应的界面组件。

1. 用户输入或上下文触发：可以是文本指令、语音命令，或诸如用户行为、应用状态等上下文数据。
2. AI 推理：模型解析输入，以理解用户的**意图**。
3. 界面生成：系统根据意图编排或直接生成定制的 UI 元素。
4. 渲染与执行：使用前端框架（如 React）渲染 UI，并动态连接到业务逻辑或 API。

其中也包括自适应的界面更新 adaptive UI，根据不断变化的用户需求来调整界面。

**关键要素**

![260207-genui-5](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/260207-genui-5.png)

## Agent 协议和框架

生成式 UI 的核心是 **Agent 驱动的动态界面生成与交互**。Agent 是决策核心，其框架定义了能力边界，协议则保障了交互的稳定性与扩展性。

| **维度**     | **框架/协议相关要素**                                                          | **对应的生成式 UI 能力**                                            | **典型示例**                                                                               |
| :----------- | :----------------------------------------------------------------------------- | :------------------------------------------------------------------ | :----------------------------------------------------------------------------------------- |
| 核心驱动逻辑 | 框架的核心模块（意图识别、任务规划、工具调用、上下文记忆）                     | 动态理解用户需求，智能规划界面组件与布局，实现个性化交互            | 用户输入“生成数据分析仪表盘”，Agent 解析需求后规划图表、筛选器等组件生成适配界面           |
| 通信交互保障 | 核心协议（Function Call、JSON Schema、gRPC）                                   | 确保 Agent 与前端、后端、第三方工具的信息传递准确，界面渲染正常     | Agent 按 JSON Schema 输出组件描述，前端精准解析并渲染；多 Agent 协作时通过协议高效传递信息 |
| 场景适配扩展 | 框架扩展性设计（模块化、插件机制、多记忆模块）                                 | 适配多终端（PC/移动端）、多业务场景（电商/医疗/办公），对接多数据源 | Agent 加载数据库插件，使生成式 UI 对接业务数据库；切换记忆模块实现用户偏好记忆             |
| 可靠性与安全 | 安全机制（权限校验、任务审核、上下文隔离）；协议规范约束（参数校验、格式限制） | 规避生成内容不可控、权限滥用等风险，保障界面生成与交互安全          | 通过协议限定 Agent 可调用工具列表；通过框架权限模块控制数据访问范围，防止恶意组件生成      |

### Agent 协议

&gt; 用来“让不同Agent/组件能互通”的消息/事件/数据格式规范——Agent 之间怎么对话、前后端怎么对话、UI 怎么描述、事件怎么流、用什么传输等等。

目前主流的协议包括：

| **特性 / 协议** | **MCP**                                                                                 | **Agent2Agent (A2A)**                                                      | **[Agent Protocol](https://agentprotocol.ai/about/)** |
| :-------------- | :-------------------------------------------------------------------------------------- | :------------------------------------------------------------------------- | :---------------------------------------------------- |
| **核心目标**    | 连接 LLM 与数据/工具 (Universal Adapter)                                                | Agent 间协作与发现(Interoperability)                                       | 标准化 Agent 控制 API (REST Interface)                |
| **架构模式**    | 中心化 Client - Server：含 Host（统筹）、Client（通信代理）、Server（能力提供）三大组件 | 去中心化 P2P 对等架构，以 Agent 为核心，通过 Agent Card 实现动态发现与直连 | 任务导向的 Client-Server 模式，侧重于任务生命周期管理 |
| **通信协议**    | Client - Host - Server                                                                  | HTTP + JSON                                                                | REST API (OpenAPI Spec)                               |
| **传输层**      | Stdio (本地), HTTP+SSE (远程)                                                           | HTTP / WebSocket                                                           | HTTP (REST)                                           |
| **典型用例**    | 让 Claude 读取本地 Git 仓库或 PostgreSQL                                                | 多 Agent 寻找彼此并协作                                                    | AutoGPT 跑分评测                                      |
| **主要维护者**  | Anthropic (Open Source)                                                                 | Google / Linux Foundation                                                  | AI Engineer Foundation                                |

MCP：“Agent/AI 应用 ↔ 工具/数据”的**连接协议**

A2A：“Agent 彼此聊天协作”的 agent-to-agent **通信协议**

### Agent UI 协议

&gt; Agent 与 UI 层、上下游系统的 “通信规则”，确保各方数据传递和指令交互的一致性、准确性。

| 概念         | MCP                                                          | MCP Apps                                                                                     | A2A                                                               | A2UI                                                                     | [AG-UI](https://docs.ag-ui.com/introduction)                                                |
| :----------- | :----------------------------------------------------------- | :------------------------------------------------------------------------------------------- | :---------------------------------------------------------------- | :----------------------------------------------------------------------- | :------------------------------------------------------------------------------------------ |
| **作用**     | 定义 Agent 如何调用外部工具 / 数据源（tool/data）            | 把 “工具返回交互 UI” 标准化进 MCP（ui://、可审计、双向通信）                                 | 让不同 AI Agent 互相发现、握手并协作完成任务的通信协议            | Agent 输出 JSON 描述意图，客户端用原生组件渲染（跨端、安全、非任意代码） | 让 Agent App 可靠地 “边跑边同步”：生命周期、文本流、工具调用、状态快照 / 增量等统一成事件流 |
| **生态位**   | 工具连接层 (Connector)                                       | 能力提供方 (Provider)                                                                        | 协作层 (Network)                                                  | 渲染层标准 (Spec)                                                        | 展示层 (Vision)                                                                             |
| **层级**     | Agent ↔ 工具的连接层                                         | MCP 的 UI 标准                                                                               | Agent 间协作层                                                    | UI 描述 / DSL 层                                                         | 运行时交互 / 会话协议层                                                                     |
| **简单类比** | “Agent 的工具插座：Agent 想查数据，MCP 帮它插对数据库的接口” | “带 USB 接口的智能设备：比如支持 AI 读取的数据库软件，既能返回数据也能给 Agent 展示操作界面” | “AI 界的微信 / Slack：我不会订票，但能发消息给‘订票 Agent’让它做” | “Agent 发乐谱 (JSON)，浏览器用钢琴 (React/Flutter) 把它弹出来”           | “魔法报纸：内容和排版根据看报人的操作自动变化，边看边更新”                                  |

### Agent 框架

&gt; 用来“写/跑 agent 逻辑”的代码库或运行时——编排、多 agent 协作、工具调用、状态/记忆、容错、部署等

- LangChain / LangGraph：面向生产的 agent 编排/运行时与图式工作流。
- AutoGen：多 agent 会话/协作框架。
- CrewAI：多 agent 编排框架。
- Google ADK：Google 的 agent 开发/部署框架。

### Agent UI 框架

&gt; 是界面开发的 “骨架” 与 “能力引擎”，定义了 Agent 如何与 UI 组件联动、如何驱动界面动态生成和交互

Agent UI 框架/SDK

- **Vercel AI SDK（含 UI 能力）**：更偏“AI 应用开发工具箱”，把工具调用结果映射到前端 UI 的路径很成熟，但它本身不等同“agent 编排框架”。
- **assistant-ui / CopilotKit / Tambo / Crayon**：主要解决“怎么把 agent 交互做成产品级 UI”，属于 UI SDK/前端框架范畴。
- **Chainlit / Streamlit / Gradio**：更像“快速把 agent 跑起来给人用”的 UI 容器/原型框架。
- **[Open WebUI](https://github.com/open-webui/open-webui)**：成品外壳/平台型 UI。

## 生成式 UI 的实现类型

|                          | **A. 客户端代码生成** **（Micro-App）**                                                                                                                                                                                                                                                                             | **B. 服务的驱动的结构化 UI** **（SDUI / DSL / Catalog）**                                                                                                                                                                                                                                              | **C. 工件编辑器** **（Canvas Editor）**                                                                                                                                                                                                                                                   |
| :----------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | :----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **核心逻辑**             | 写代码                                                                                                                                                                                                                                                                                                              | 填参数                                                                                                                                                                                                                                                                                                 | 改文档（Edit Artifact）                                                                                                                                                                                                                                                                   |
| **代表产品 / 框架/协议** | Claude Artifacts；Gemini Dynamic View；蚂蚁灵光-闪应用![img](https://bytedance.larkoffice.com/space/api/box/stream/download/asynccode/?code=NjEzMjljMTI3OGE5YTlmZGFjNmQ4ZGIzNzEwZmVhMWRfZGVUaUpycU1aZkdDVFJ0aXpETnVzWjkyY01NZEtuV1NfVG9rZW46WXFwdmJhNVROb1ppMkR4eUZkcmMwN1dmbjViXzE3NzAzODYxMDU6MTc3MDM4OTcwNV9WNA) | Gemini Visual Layout；蚂蚁灵光-对话；A2UI![img](https://bytedance.larkoffice.com/space/api/box/stream/download/asynccode/?code=OWVjNzJjNTE3YTAxM2NiNTc3YTQxODE2OWQ0YjFlNWVfVXpzWVJlTVhGSE81ZTFnT2U5T21xREtyeXlaTFlKUUhfVG9rZW46U2NraGIwUE9Kb0x2WUR4bmVjbWNKM1JrbmlkXzE3NzAzODYxMDU6MTc3MDM4OTcwNV9WNA) | Gemini Canvas；OpenAI Canvas![img](https://bytedance.larkoffice.com/space/api/box/stream/download/asynccode/?code=NGY4ZDk3ZjZkY2Y2ZTY5YThjYjEyM2Y5ODU4ZWVkYzRfeHBuSm5jUHR0cTlQRW1nNlppQk5qaTZVbExmRmhtUmZfVG9rZW46WXh3VWJzZUlZbzFLZVV4eFhmUmMzRVBubkhiXzE3NzAzODYxMDU6MTc3MDM4OTcwNV9WNA) |
| **LLM 输出什么**         | 可执行前端代码                                                                                                                                                                                                                                                                                                      | 结构化 JSON/DSL：组件树 / 布局 / 数据绑定 / 动作（输出意图和参数，不是代码）                                                                                                                                                                                                                           | 对文档 / 代码状态的编辑指令（diff/patch/ 重构）、可运行的代码 / 内容                                                                                                                                                                                                                      |
| **前端渲染什么**         | 沙箱里跑的独立小应用                                                                                                                                                                                                                                                                                                | 本地预置的组件库（Design System）拼装出的 UI 原生 / 网页                                                                                                                                                                                                                                               | 编辑器 + 运行容器                                                                                                                                                                                                                                                                         |
| **交互闭环怎么做**       | UI 事件在沙箱内部处理；需要时把状态 / 结果回传对话                                                                                                                                                                                                                                                                  | UI 事件编码成结构化消息回给 agent；agent 决策后输出新的 JSON/patch                                                                                                                                                                                                                                     | 用户选区 / 标注 → 模型做局部修改 → 持续迭代                                                                                                                                                                                                                                               |
| **实现模式**             | iframe/webview sandbox；CSR 运行 + 热更新                                                                                                                                                                                                                                                                           | - CSR 映射（客户端服务器渲染映射）； - 跨端 native renderer； - RSC stream 也能做但少见                                                                                                                                                                                                                | LLM 拥有对文档 / 代码状态的读写权限。编辑器模型 + 预览容器；Web 常是 CSR；代码预览可能用 sandbox / 容器                                                                                                                                                                                   |
| **优势**                 | 自由度极高：能做新交互、游戏、复杂可视化                                                                                                                                                                                                                                                                            | 稳定、安全、品牌统一、跨端、可治理；在 schema 约束下低幻觉、可校验                                                                                                                                                                                                                                     | 最适合长任务、局部编辑、版本化与协作                                                                                                                                                                                                                                                      |
| **代价**                 | - 稳定性（代码报错 / 样式崩） - 安全（执行不可信代码） - 一致性（风格分裂） - 成本（token / 推理）                                                                                                                                                                                                                  | - 创造力受组件库限制； - 要维护 catalog/schema/renderer； - 复杂交互要扩展协议                                                                                                                                                                                                                         | - 不一定 “每轮都生成 UI”； - 更像创作环境； - 实现细节复杂                                                                                                                                                                                                                                |

- CSR（Client-Side Rendering）：客户端渲染模式下，LLM 输出 JSON 数据，前端根据预定义映射表决定渲染哪个组件。逻辑位于客户端。
- RSC（React Server Streaming）：在服务器模式下，LLM 在服务器生成 React 组件并流式传输到前端渲染结果。客户端无需将数据映射到组件，只需接收 UI 树。

## Q&amp;A

### MCP Apps 和 A2UI 有什么不同？

- MCP Apps：先定义组件/App。
- A2UI：由模型实时驱动生成的动态 UI 的协议。

| 维度           | MCP Apps                                                                                                                                                                                                         | A2UI                                                                                                                                                                                                                                                             |
| :------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **基本形态**   | 在 MCP 上扩展获取 &quot;UI 资源&quot; 能力                                                                                                                                                                                 | Agent 输出声明式 JSON UI 蓝图，客户端以本地组件库渲染                                                                                                                                                                                                            |
| **架构**       | 以 HTML/JS 为主的 &quot;远端 UI&quot;，把**可交互页面作为一种可获取的资源**，嵌入 Agent 对话 / 工作流中                                                                                                                    | 以**数据描述 UI + 客户端原生渲染**为核心，确保跨端一致性与安全可控                                                                                                                                                                                               |
| **功能定位**   | 让工具调用不仅返回文本和数据，也能返回可交互界面                                                                                                                                                                 | 告诉前端“要什么样的界面”（声明式、跨端渲染），让应用能够接入可由 Agent 生成的界面。                                                                                                                                                                              |
| **适用于**     | 更适合“工具侧提供 UI 模板”，Host 加载呈现；可做“开箱即用”的工具 UI。                                                                                                                                             | 更适合“Agent 按上下文生成 UI 意图”，Host 负责渲染与交互闭环。                                                                                                                                                                                                    |
| **设计表现力** | UI 作为资源（页面）返回，表现力可以接近 Web 上限（图表、动画、媒体、复杂布局均可）                                                                                                                               | 组件树声明式 JSON，Agent 能直接“表达 UI 意图”。表现力取决于 Host 组件库丰富度。更适合做“增量更新 UI”（修改某字段、局部刷新、动态添加组件）。                                                                                                                     |
| **关键机制**   | - MCP Server 预声明 UI 资源，并把 UI 与 Tool 元数据关联 - Host 在需要时拉取 UI 内容（text/html）并渲染 - UI 通常以 iframe 沙箱方式运行，隔离宿主环境 - UI 与宿主 / 工具之间通过 MCP 的 JSON-RPC 通道进行双向通信 | - Agent 回复不发送 HTML / 可执行代码，而是发送 UI 组件树的 JSON 描述（结构、属性、事件等） - Host / 客户端内置组件目录和渲染器，将 JSON 映射为 Web/Flutter/iOS/Android 等平台的原生组件 - 传输层可与 A2A、AG-UI 或其他消息管道结合，强调 &quot;格式标准化 + 传输解耦&quot; |
| **典型场景**   | **对话内嵌业务 UI**：权限配置、审批流、客服信息收集、运维操作面板等。 **工具结果可视化**：数据分析图表、报表、仪表盘的交互呈现。 **复杂输入收集**：多字段表单、多步骤 wizard、批量选择等。                       | **即时生成表单/控件**：预订、填报、筛选、对比等对话场景中动态生成 UI。 **跨端一致体验**：同一套 UI 描述可落地到 Web/Flutter/移动原生。 **多代理协作**：子代理能产出 UI 蓝图，被主代理/宿主理解与组合（更利于互操作）。                                           |
| **开发优势**   | - 前端门槛低，Web 技术栈成熟。 - UI 表达力强，易做复杂界面与快速迭代。 - 对已有 MCP 系统可渐进增强（兼容纯文本）。                                                                                               | Host 提供组件库与渲染器，Agent 输出 JSON 蓝图： - 原生渲染一致性好，可访问性与平台体验更统一。 - 组件化扩展清晰：新增组件类型即可扩展表达力。 - 可用模板 + 数据减少 LLM 结构生成难度。                                                                           |
| **挑战**       | 跨宿主一致性与样式融合需要额外工程。安全审核与沙箱策略需要严格执行。                                                                                                                                             | 需要理解并实现组件映射/渲染层（初期成本较高）。规范早期阶段可能存在变动，需跟进版本演进。                                                                                                                                                                        |

- MCP 解决 Agent 如何调用外部工具/数据源的问题，属于 **Agent ↔ 工具** 的连接层。
- A2UI 让 agent 输出**声明式 JSON UI 意图**，客户端用本地组件库渲染，属于**UI 描述/DSL 层**。

两者可以同时存在：一个用于“工具自带的交互面板”，一个用于“Agent 临场生成的跨端界面”。

![260207-genui-6-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/260207-genui-6-s.png)

### Agent skills 和 A2UI 有什么不同？

- Agent skill：让 agent **“会做事”**（把任务变成可复用、可执行、可观测的能力单元）。
- A2UI：让 agent **“会表达界面”**（把 UI 变成可控的声明式意图，让客户端拼装）。

| 维度       | Agent skill                                    | A2UI                                                   |
| :--------- | :--------------------------------------------- | :----------------------------------------------------- |
| 核心问题   | 任务怎么做、怎么稳定做、怎么复用               | UI 怎么说、怎么安全渲染、怎么交互闭环                  |
| 所在层     | **行为/流程层**（planning → tool use → state） | **呈现层**（UI intent → renderer → event loop）        |
| 面向对象   | Agent 自身能力（步骤、策略、边界、容错）       | 客户端 UI 组件目录（catalog）+ UI 描述（DSL/JSON）     |
| 输出形态   | 通常是：计划/步骤、工具调用、状态更新、产物    | 通常是：组件树描述、数据绑定、事件定义、增量 patch     |
| 稳定性来源 | SOP/策略约束、工具契约、重试回退、测试与监控   | schema 约束、catalog 白名单、renderer 控制、事件协议   |
| 失败模式   | 做错事：调用错工具、流程跑偏、状态不一致       | 表达不对：组件选错、参数不对、布局不佳（但不会“跑崩”） |
| 治理方式   | 版本管理、评测、回放、权限/工具白名单          | schema 校验、catalog 版本、渲染兜底、禁用任意代码      |
| Token 成本 | 主要花在推理与工具编排                         | 主要花在 UI 描述（可通过短 ID/patch 大幅压缩）         |
| 典型用途   | 把“复杂任务”封装成可调用能力（像函数/流程）    | 把“下一步交互”变成 UI（卡片/表单/对比/向导等）         |

&gt; **Skill = 行为逻辑 + UI 合约（A2UI 风格）+ 事件回路**

把 A2UI 当作某些 skill 的“输出/交互壳”：

- skill 负责：识别意图 → 拉数据/调用工具 → 产出“候选方案/状态”
- A2UI 负责：把候选方案变成 UI（对比卡、筛选器、Stepper、确认面板）
- 用户点选/提交 → 事件回流 → skill 继续执行下一步
</content:encoded>
        </item>
        <item>
            <title><![CDATA[A2UI - 智能体自动生成 UI 界面的全新协议]]></title>
            <link>https://tophci.com/posts/251222-a2ui</link>
            <guid isPermaLink="true">https://tophci.com/posts/251222-a2ui</guid>
            <category><![CDATA[Agent]]></category>
            <category><![CDATA[A2UI]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[UI]]></category>
            <category><![CDATA[Coding]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 21 Dec 2025 16:00:00 GMT</pubDate>
            <content:encoded>
## A2UI 是什么？

A2UI 是由 Google 开源的一个“**UI 语言 + 传输/渲染协议**”。智能体可以根据对话内容，自动从组件库中生成定制化的 UI。

![a2ui](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/a2ui.png)

| **维度**       | **A2UI 是什么**                                                                                    | **A2UI 不是什么**                                                                               |
| -------------- | -------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------- |
| **本质定义**   | 一种面向 AI 智能体的**开源协议和标准格式**，让智能体能够生成跨平台的交互界面。                     | 它**不是**一个独立的 UI 设计工具或终端应用程序，而是智能体与前端通信的“语言”。                  |
| **数据格式**   | 采用**声明式 JSON** 描述界面的意图、结构和数据。                                                   | 它**不是可执行代码**，严禁智能体发送任意脚本。                                                  |
| **渲染方式**   | **原生优先**。由宿主应用将抽象描述映射为本地原生组件（如 Flutter 挂件或 React 组件）。             | 它**不是 iframe** 或不透明的沙盒网页，不会产生视觉割裂感，能继承宿主应用的设计风格。            |
| **安全机制**   | **基于白名单的安全设计**。智能体只能调用组件目录中预先批准的受信任组件。                           | 它不是不受控的 UI 注入。通过禁止执行代码，从根本上杜绝了 XSS 等安全风险。                       |
| **交互体验**   | **动态且流式的**。支持基于 ID 的增量更新，允许界面随大模型推理过程“渐进式渲染”。                   | 它不是静态的“文本墙”或简单的 Markdown 表格，而是具备交互能力的实时应用界面。                    |
| **平台兼容性** | **框架无关**。一份 JSON 描述可以在 Web、移动端和桌面端通用渲染。                                   | 它**不绑定于特定的生态系统**。虽然由 Google 发起，但支持 Angular、Flutter、Lit 等多种前端框架。 |
| **生态角色**   | 它是**基础设施协议**。可以与 AG-UI 或 Vercel AI SDK 等框架协同工作，解决跨信任边界的 UI 传输问题。 | 它不是一个框架。它专注于**解决“意图如何描述”**，而非“如何管理对话状态”。                        |

这是一个类似实时对讲机式的界面传输协议。

## A2UI 要解决什么问题？

&gt; 智能体如何能安全地跨信任边界发送丰富的用户界面？

![a2ui-solve-problem-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/a2ui-solve-problem-s.png)

A2A 协议给界面设计带来了挑战：如果智能体在应用里，它可以直接控制界面。但在多智能体协作的场景中，执行任务的智能体通常在远程（如后台服务或其他公司），无法直接控制界面，只能通过发送消息来交互。

传统做法是发送 HTML 或 JavaScript 代码，然后用 iframe 运行。但这会让系统变得复杂，界面看起来和应用不协调，而且安全管理也很麻烦。我们需要一种既安全（像传输数据那样），又灵活（像运行代码那样）的新方法。

## **解决方案：把界面当作消息来传输**

A2UI 提供了一种标准**格式**，让 AI 智能体可以创建和更新用户界面。它支持通用组件和客户端自定义的组件，可以组合成完整的界面布局。这些布局**用消息来传输，而不是直接运行代码**，然后让客户端用原生 UI 组件进行渲染。这样客户端就能完全控制样式和安全。

![agent-send-description-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/agent-send-description-s.png)

```
- 不传可执行代码，而是传声明式 JSON；客户端用自有组件渲染，所以样式/可访问性/安全都可控。
- A2UI 是一种“UI 语言”，或者说是一个可被 agent 驱动的状态机外壳，而不是一个 UI 框架。
```

![a2ui-analogy](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/a2ui-analogy.png)

## A2UI 的工作原理

![how-a2ui-work-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/how-a2ui-work-s.png)

A2UI 把 UI 当成一串 JSONL 消息（常用 SSE 传输），客户端进行**渐进式渲染，**降低等待感。

- 服务器到客户端一共四类消息：`surfaceUpdate`、`dataModelUpdate`、`beginRendering`、`deleteSurface`。

​ ![a2ui-message](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/a2ui-message.png)

- 用 `surfaceId` 管理多个 UI 区域（例如：聊天流里每条 agent 回复各一个 surface，右侧再有一个持久侧栏 surface）。并且 每个 surface 有自己的 data model，避免键名冲突。
- 用**扁平组件列表**，靠 `id` 引用组织层级（adjacency list），因为嵌套 JSON 树对 LLM 太容易出错，也不利于局部更新。这是为 LLM 的生成特性量身定做的：更容易增量生成、也更容易按 id patch。

## **A2UI 的优势：设计即安全，模型友好，框架无关，渐进式渲染**

### 安全

直接运行 AI 生成的代码很危险。A2UI 只是数据格式，不是代码。你的应用有一个预先批准的组件清单（比如卡片、按钮、输入框），智能体只能使用这些组件。这样可以防止恶意攻击。

- agent 只能“请求渲染”客户端 catalog 里**预批准的组件**，不能注入任意脚本。
- 可以有标准 catalog，也可以自定义/扩展；并且有 catalog negotiation：server 在 Agent Card 里声明支持哪些 catalog，client 在每条消息 metadata 里声明自己能渲哪些 catalog。

### 适合 AI 且可以逐步更新

界面用带编号的组件列表来表示，方便 AI 一步步生成，用户体验更流畅。随着对话继续，智能体可以根据新需求快速调整界面。

### 跨平台通用

A2UI 把界面结构和具体实现分开。智能体发送组件描述和数据，应用负责用自有控件来显示。同一份 A2UI 数据，可以在不同技术的应用（网页组件、Flutter、React、SwiftUI）上显示。

## 小结

A2UI 所倡导的“Agent 驱动界面”范式，为解决长期存在的交互复杂性问题提供了 一把锋利的“奥卡姆剃刀”。它将 UI 生成能力下放给最理解上下文的 Agent，同时将渲染和安全控制权牢牢掌握在客户端手中，巧妙地平衡了灵活性与安全性。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[永远不要自己写 Skill，除非你看完这一篇——深度拆解 Claude 官方 Skills[附清单下载]]]></title>
            <link>https://tophci.com/posts/251206-how-to-write-skills</link>
            <guid isPermaLink="true">https://tophci.com/posts/251206-how-to-write-skills</guid>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[Claude code]]></category>
            <category><![CDATA[Skills]]></category>
            <category><![CDATA[Agent]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 05 Dec 2025 16:00:00 GMT</pubDate>
            <content:encoded>

## 为什么 Skill 很重要？它和 prompt、command 有什么区别？

我们使用 AI 时，习惯了&quot;问一句，答一段&quot;——把它当成输入框后面一个更聪明的搜索引擎。但真正能让 AI 产生价值的，不只是每次想出好问题，而是有没有一套可重复使用、不断改进的 **Skill**。

**Skill 的核心价值：它不是聊天内容，而是&quot;打包好的能力&quot;。**

![1-what-is-skill](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-what-is-skill.png)

Prompt 往往是一次性的对话指令，斜杠命令更像按一次按钮，解决的是&quot;现在做什么&quot;。而 Skill 是系统中常驻的 **“能力模块”**，它等待被模型发现、读取并复用，解决的是&quot;以后遇到这类事情该怎么做&quot;。

&gt; **Prompt**：一次性的聊天指令。
&gt;
&gt; **Command** ：常用的「代码片段」。
&gt;
&gt; **Skill：**：一整套「SOP + 工具包」。

## 什么是好的 Skill？

首先当然是看是否满足需要。skill 文档的开头的 name + description 部分需要回答三个问题：① 它帮我干什么活？② 什么时候它该出场？③ 和我现在的项目有没有关系？

官方与高质量社区 Skill，很喜欢用几种固定的“骨架模式”：

| **类型**                             | **结构**                                               | **适用场景**                                                 |
| ------------------------------------ | ------------------------------------------------------ | ------------------------------------------------------------ |
| **Workflow-based（流程型）**         | `Overview → Workflow decision tree → Step 1 → Step 2…` | 适合「有固定顺序」的任务（比如 DOCX Skill 的&quot;先决定是读/写/编辑，再按步骤走&quot;） |
| **Task-based（任务菜单型）**         | `Overview → Quick start → Task 1 → Task 2…`            | 适合「同一领域多种操作」的 Skill（比如 PDF：提取文本 / 合并 / 拆分 / 表格识别…） |
| **Reference / Guidelines（规范型）** | `Overview → Guidelines → Specifications → Usage…`      | 用来固化「品牌规范、写作规范、代码风格」这类标准             |
| **Capabilities-based（能力清单型）** | `Overview → Core capabilities → 1,2,3…`                | 用于&quot;产品管理 / 数据分析&quot;这类综合性系统能力                  |

如果我们自己要写 skill，也可以考虑选用哪一种框架。

好的 skill 要遵循 Claude 官方建议的 progressive disclosure 信息组织原则：

- **SKILL.md 主体**：保持简洁，建议控制在 500 行左右，多了就拆文件，但要注意避免多层嵌套引用。
- **Bundled Resources**，需要时再读取：
  - `scripts/`：重复写的代码、需要确定性执行的逻辑。
  - `references/`：大块文档、API、schema、长规范。
  - `assets/`：模板、pptx、html boilerplate、字体等。

值得提醒的是，在 skill 中要写清楚判断条件和出错后怎么办，这样 AI 遇到问题时才知道如何处理。比如：需不需要先检查？如果失败了该提示什么？怎么返回上一步？

下面我们就来看看 Claude 官方提供的 Skill，详细拆解优质的 skill 到底长什么样。

## 如何写好设计类 Skill？

00 做了很多年 UX 设计，对设计类 skill 应该还是有鉴赏能力的，所以下面重点拆解这一类 skill。在 [Claude 官方提供的 skills](https://github.com/anthropics/skills/tree/main/skills) 中， 典型的设计类技能是这两个：`algorithmic-art`, `canvas-design`。

### algorithmic-art

```markdown
name: algorithmic-art
description: 使用p5.js通过种子随机性和交互式参数探索创建算法艺术。当用户要求使用代码、生成艺术、算法艺术、流场或粒子系统创建艺术时使用此技能。创建原创算法艺术，不要复制现有艺术家的作品以避免版权侵权。
```

![2-mood-canvas](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-mood-canvas.jpg)

完整的 skill 请访问：https://github.com/anthropics/skills/blob/main/skills/algorithmic-art/SKILL.md



通读这个 skill 文档，00 为你总结了几个炸裂💥的技巧：

#### 1. 提高天花板：不是“画一张图”，而是“创立一个流派”

一上来就不是说“帮我用 p5.js 画图”，而是：

&gt; Algorithmic philosophies are computational aesthetic movements that are then expressed through code.

把任务从“生成一张作品”提升到“创建一个美学流派 + 对应的算法体系”。这可太高明了，这是在提醒模型：**输出要成体系，而不是一次性灵感**。让后续所有指令都围绕“这是一门流派”展开，而不是“某个 pattern”。



#### 2. 双阶段结构：哲学 → 实现

Skill 明确要求分两步：

- Algorithmic Philosophy Creation (.md)
- Express by creating p5.js generative art (.html + .js)

而且强调：“理念先行，代码只是表达工具”。这里值得借鉴的地方是：

- **强制抽象层在前**：避免模型直接掉进“写代码、调数值”的局部最优。

- 把“哲学”规定为 4–6 段，有明确结构和要素（噪声、粒子、场、时间、参数、涌现）。

  

#### 3. 哲学写作范本：又诗性又工程化

这一段特别能体现领域专家的深厚功底：

&gt; To capture the ALGORITHMIC essence, express how this philosophy manifests through:
&gt;
&gt; - Computational processes and mathematical relationships
&gt; - Noise functions and randomness patterns
&gt; - Particle behaviors and field dynamics
&gt; - Temporal evolution and system states
&gt; - Parametric variation and emergent complexity

值得借鉴的地方：

1. 用**问句/维度**约束内容，告诉模型思考的方向。

2. 每个点都同时是**美学语言 + 技术对象**（噪声、粒子、场），方便后面直接映射成代码结构。

3. 避免空洞的“文艺废话”，因为每句都要可算法化。

4. 重要的规则集中在 “CRITICAL GUIDELINES” 中强调：

   - **Avoid redundancy**：硬性规避同一个概念反复啰嗦。

   - **Emphasize craftsmanship repeatedly**：强调“精工细作、顶级匠人、无数次迭代”。告诉模型不是在写某个 demo，而是在写一个看起来花了几百小时精心打磨出的算法。

     

#### 4. 示例：概念 → 数学结构 的翻译模板

比如 “Organic Turbulence”：

- 概念句：Chaos constrained by natural law…
- 算法句：Flow fields driven by layered Perlin noise… thousands of particles following vector forces… color emerges from velocity and density…

在 Skill 中没有直接说“用 flow field”，而是用例子示范一遍，留下可泛化的模式。我们写 skill 时也可以用这种“一个哲学 + 一段算法表达”的结构 举 3–5 个例子。



#### 5. “概念种子”：把主题嵌进参数，而不是嵌进文案

这段非常妙：

&gt; The concept is a subtle, niche reference embedded within the algorithm itself – not always literal, always sophisticated… Think like a jazz musician quoting another song through algorithmic harmony.

把用户原始主题定义为“quiet conceptual DNA”，要求嵌在**参数、行为、模式**里，而不是写在画面上。并且用比喻（爵士乐里偷引用一段旋律）告诉模型：要有致敬，但要藏得深。同时兼顾“懂行的人能感觉到，不懂的人只会觉得好看”。

这对任何创意类任务都非常好用。



#### 6. 模版化：把自由创作嵌在系统里

“STEP 0: READ THE TEMPLATE FIRST”，这里明确要求：**不要自己新写 HTML**，必须读取 `templates/viewer.html`，保持品牌样式。同时要明确自由度，清楚划分哪些是 FIXED（布局、品牌、seed 控件、按钮），哪些是 VARIABLE（p5 算法、参数 UI、颜色区域）。

这样每次生成的作品都有统一 UI 体验，对模型来说也知道“改哪里 / 不动哪里”，减少预期外的”惊喜“。

![3-模版化结构](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3-%E6%A8%A1%E7%89%88%E5%8C%96%E7%BB%93%E6%9E%84.png)

#### 7. 把“匠人审美”写成 checklist

下面几段基本是把 generative art 的 best practices 变成了规则清单：

- 必须使用 seed：`randomSeed` / `noiseSeed`，保证可复现。
- 参数设计以“物理属性”为中心（数量、尺度、概率、比率、阈值），不要用“pattern 类型”这种靠近结果的概念。
- 工艺要求：平衡、层次、色彩和谐、性能优化、复现性。

&gt; This is NOT random noise – this is CONTROLLED CHAOS refined through deep expertise.

这句话也是点睛之笔，把**随机性 → 可控混沌 → 专业度**整个路径串起来。PUA 说不上，但指挥模型干活的鼓励师是没跑了。



### canvas-design

这个 skill 跟 `algorithmic-art` 结构类似。

#### 1. 拔高定位：这是“视觉哲学”，不是 PPT 模板

&gt; These are instructions for creating design philosophies – aesthetic movements that are then EXPRESSED VISUALLY. Output only .md, .pdf, .png.

短短一句话，信息量不少：：

- **只允许视觉相关格式**（pdf/png），禁止模型跑偏去写长文。
- 再次使用“两步走”：Visual philosophy → Canvas creation。
- 强调：**文本是视觉的从属，不是内容的主体**。

#### 2. “MINIMAL TEXT” 的强约束

哲学部分提出几条原则，让信息活在设计里：

&gt; Minimal text as visual accent. Information lives in design, not paragraphs. Text is rare, powerful gesture.

这会让模型任何时候都先考虑“构图/空间/色块/节奏”，文案只是“点睛的线条”，而不是“堆字”。

#### 3. 哲学 + 示例

和前一个 skill 类似，它给了几个极具画面感的例子：Concrete Poetry / Chromatic Language / Analog Meditation / Organic Systems / Geometric Silence。每个都是一句 philosophy 总领（比如“Communication through monumental form and bold geometry”）。然后是一整段 visual expression：

- 形状（massive blocks, rounded forms, grids）
- 色彩（chromatic fields, natural palettes）
- 字体角色（huge single words / tiny labels / whispered typography）
- 参考风格（Polish poster, Swiss formalism, Japanese photobook…）。

它的聪明之处在于既给参照，又不具体到“抄某个设计师”，注重原创性。

#### 4. 强调“匠心” &amp; “留白”

&gt; Repeatedly emphasize “meticulously crafted”, “painstaking attention”, “master-level execution”。 Text is always minimal and visual-first… nothing falls off the page, nothing overlaps, proper margins are non-negotiable.

平面设计里的专业感，其实就在细节中：不出血、不挤压、不重叠；版心、边距、对齐都被严格校验。这样就把设计师心里的洁癖规范翻译成模型可执行的 checklist，把抽象审美拆成具象行为（不要 overlap / 保留边距 / 检查所有文本）。

#### 5. 科学文本 + 情绪主题

Canvas creation 这一段非常有意思：

&gt; Treat the abstract philosophical design as if it were a scientific bible, borrowing the visual language of systematic observation — dense accumulation of marks, repeated elements, layered patterns… sparse, clinical typography, reference markers… artifact that proves something ephemeral can be studied, mapped, and understood…

它在做一个概念拼贴：

- 主题：人类经验 / 情绪 / 抽象哲学 → 很虚。
- 视觉语言：科学手册 / 技术图解 / 实验记录 → 很实。

这引导模型把“不可见的东西”当“可测量的数据”去做信息图。

#### 6. 字体与资源

Skill 强制要求必须去 `./canvas-fonts` 目录找字体，字体要作为画面元素，而不是普通排版。

这体现了来自实践的设计经验：字体从来不是“默认变量”，而是核心设计决策。对模型来说，“请认真选字体”需要具体行为约束（去某个目录、用不同 font），不然可能就出现 AI 味很重的 Arial、Inter 字体了。

#### 7. 最后一轮精修：不做加法做乘法

最后的 FINAL STEP 部分让我觉得有点眼熟：

&gt; It isn’t perfect enough. It must be pristine…
&gt;
&gt; To refine the work, avoid adding more graphics; instead refine what has been created… If the instinct is to call a new function or draw a new shape, STOP…

![4-设计总监](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4-%E8%AE%BE%E8%AE%A1%E6%80%BB%E7%9B%91.png)

用 SKILL 把这种“最后 10% 的工艺感”也编码进去，是非常聪明的做法。

比如我们可以让模型自行检查：

&gt; 如果下一步的本能是“多加一个 icon / 多加一层特效”，请暂停。
&gt;
&gt; 问自己：有没有可以删掉的东西？有没有可以对齐、合并、强化的关系？
&gt;
&gt; 只允许修改已有元素的位置、间距、权重和颜色。

这能让作品整体观感直接提升一档。



### 小结

总结一下，设计类的 skill 技巧：

![5-如何写出优质的设计类 Skill](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-%E5%A6%82%E4%BD%95%E5%86%99%E5%87%BA%E4%BC%98%E8%B4%A8%E7%9A%84%E8%AE%BE%E8%AE%A1%E7%B1%BB%20Skill.png)



## 优质 skill 检查清单

为了方便大家使用，00 整理了一个 skill 的 checklist，可以用来检查 AI 生成的 skill 是否符合要求。

![00_skill_checklist-pre](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/00_skill_checklist-pre.png)

小 tips：可以直接把文档丢给 AI 让它自己检查 👌

**下载方法**：

```
在「零反思」公众号回复”技能清单“，即可获得下载链接。
```
</content:encoded>
        </item>
        <item>
            <title><![CDATA[Claude 官方讲解 Agent Skills——快速上手工作流最新秘密武器]]></title>
            <link>https://tophci.com/posts/251118-claude-skills-intro</link>
            <guid isPermaLink="true">https://tophci.com/posts/251118-claude-skills-intro</guid>
            <category><![CDATA[Coding]]></category>
            <category><![CDATA[Claude code]]></category>
            <category><![CDATA[Skills]]></category>
            <category><![CDATA[Agent]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 17 Nov 2025 16:00:00 GMT</pubDate>
            <content:encoded>
## **什么是 Skills？**

技能是一个个独立的功能包，它们能给 Claude 或编程环境添加**专业知识、工作流程和工具**。你可以把技能想象成某个专业领域的&quot;使用手册&quot;——能让 Claude 从一个什么都懂一点的助手，变成一个掌握特定专业知识的专家。

一个 Skill 可能包含

1. **工作流程** - 针对特定领域的多步骤程序
2. **工具** - 用于处理特定文件格式或 API 的说明
3. **领域知识** - 特定知识、架构、业务逻辑等
4. **资源** - 用于复杂和重复任务的脚本、参考资料和资产

在 Claude code 的 skill 文件夹中，包含一个必需的 `SKILL.md` 文件和可选的资源：

```
skill-name/
├── SKILL.md (必需)          ← YAML元数据 + Markdown指令
│   ├── YAML frontmatter metadata (必需)
│   │   ├── name: (必需)
│   │   └── description: (必需)
│   └── Markdown instructions (必需)
├── scripts/ (可选)          ← 可执行代码 (Python/Bash等)
├── references/ (可选)       ← 参考文档 (按需加载)
└── assets/ (可选)          ← 资源文件 (模板/图片/字体等)
```

**最少必要信息**

`SKILL.md` 文档顶部的 YAML 中的 `name` 和 `description`，决定了 Claude 何时使用该技能。要具体说明该技能的**作用**以及**何时使用**。应使用第三人称（例如 &quot;This skill should be used when...&quot; instead of &quot;Use this skill when...”）进行描述。

![skill-skill](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/skill-skill.png)

**捆绑资源（可选）**

**脚本**：用于需要确定性可靠性或反复重写的任务的可执行代码（Python/Bash/等）。

![skill-scripts](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/skill-scripts.png)

**参考资料**：可根据需要加载到上下文中，以指导 Claude 的流程和思维。

![skill-references](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/skill-references.png)

**资源**：文件不是为了被加载到上下文中，而是用在 Claude 生成的输出中。

![skill-assets](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/skill-assets.png)

### **渐进式披露原则**

skill 使用三级加载来高效管理 context：

1. 元数据（名称 + 描述）- 始终在 context 中（~100 字）
2. 技能触发时的 `SKILL.md` 正文（&lt;5000 字）
3. 资源 - 根据需要加载

## **技能创建流程**

![skill-process](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/skill-process.png)

### **第 1 步：通过具体示例理解技能**

要创建好用的技能，首先要知道具体的使用例子，可以是用户提供的，也可以是你想出来后让用户确认的。

比如，做一个图像编辑技能时，可以问这些问题：

&gt; 这个技能要支持哪些功能？比如编辑、旋转，还有别的吗？
&gt;
&gt; 能举几个使用这个技能的例子吗？
&gt;
&gt; 用户可能会说&apos;去掉照片的红眼&apos;或&apos;旋转这张图&apos;。还有其他用法吗？
&gt;
&gt; 用户会怎么说来使用这个技能？

别一次问太多问题，先问最重要的，需要的话再追问。

### **第 2 步：规划可复用的技能内容**

想要把具体例子变成实用的技能，方法是分析每个例子：

1. 想想如何一步步完成
2. 找出哪些脚本、参考文档和资源可以重复使用

例子 1：PDF 编辑技能

```bash
当用户说&quot;帮我旋转这个 PDF&quot;时：

1. 每次旋转 PDF 都要写一样的代码
2. 可以把 `scripts/rotate_pdf.py` 脚本保存在技能里，下次直接用
```

例子 2：网页应用构建技能

```bash
当用户说&quot;做一个待办事项应用&quot;或&quot;做一个步数统计页面&quot;时：

1. 每次写网页应用都要用同样的 HTML/React 基础代码
2. 可以把基础模板 `assets/hello-world/` 保存在技能里，下次直接用
```

例子 3：数据查询技能

```bash
当用户问&quot;今天有多少人登录过&quot;时：

1. 每次查询 BigQuery 都要重新查找表格结构
2. 可以把表格结构说明 `references/schema.md` 保存在技能里，下次直接查
```

总结：分析每个具体例子，整理出可以重复使用的内容，包括脚本、参考文档和资源文件。

### **第 3 步：创建技能文件**

创建全新技能时，可以运行官方提供的 skill-creator 技能中的 [ `init_skill.py` 脚本](https://github.com/anthropics/skills/tree/main/skill-creator/scripts)。

```
scripts/init_skill.py &lt;技能名称&gt; --path &lt;保存位置&gt;
```

这个脚本会自动创建一个技能文件夹，里面包含所需的基础文件。

- 生成一个 SKILL.md 模板文件，里面有格式和待填写的部分
- 创建三个示例文件夹：`scripts/`（脚本）、`references/`（参考资料）和 `assets/`（资源文件），包含一些示例文件，可以根据需要修改或删除

创建后，再根据实际需要修改。

### **第 4 步：编辑技能**

编辑技能时，要记住这个技能是给另一个 Claude 用的。重点写下那些对 Claude 有用但它不知道的信息。想想什么知识、专业细节或可以重复使用的文件能帮助 AI 更好地完成任务。

**从可重用的内容开始**

开始制作时，先处理脚本、参考资料和资源文件。这一步可能需要用户提供材料。比如做 `brand-guidelines` 技能时，用户可能要提供品牌素材或模板放到 `assets/` 里，或提供文档放到 `references/` 里。

**更新 SKILL.md 文件**

写作风格：整个技能都要用命令式写法（比如&quot;做 Y 来完成 X&quot;），不要用&quot;你应该&quot;这样的说法。用客观、说明性的语言（比如写&quot;要完成 X，做 Y&quot;，而不是&quot;应该做 X&quot;或&quot;如果需要做 X&quot;）。

完成 SKILL.md 文件时，回答这些问题：

```mermaid
graph TD
    A[完成 SKILL.md 文件] --&gt; B[这个技能是做什么的？]
    A --&gt; C[什么时候用这个技能？]
    A --&gt; D[Claude 实际使用时该怎么做？]
    A --&gt; E[是否已删除无用到的模版文件]

    D --&gt; D1[说明怎么用前面准备的内容]
    D1 --&gt; D2[如何使用它们]

    style A fill:#e1f5ff
    style B fill:#fff4e6
    style C fill:#fff4e6
    style D fill:#fff4e6
    style E fill:#fff4e6
```

1. 这个技能是做什么的？用几句话说明。
2. 什么时候用这个技能？
3. Claude 实际使用时该怎么做？要说明怎么用前面准备的内容，让 Claude 知道如何使用它们。
4. 是否已删除不需要用到的模版文件

### **第 5 步：打包技能**

技能准备就绪后，可将其打包为可分发的 zip 文件。

```
scripts/package_skill.py &lt;path/to/skill-folder&gt;
```

打包流程会首先自动验证，以确保满足要求：

- YAML 前置元数据格式和必填字段
- 技能命名规范和目录结构
- 描述的完整性和质量
- 文件组织和资源引用

如果验证通过，将创建一个以技能命名的 zip 文件，包含所有文件和正确的目录结构。如果验证失败，脚本将报告错误并退出，需要修复错误并再次运行打包命令。

### **第 6 步：不断改进**

用过技能后，你可能会发现需要改进的地方。改进步骤：

1. 在真实工作中使用这个技能
2. 记下遇到的问题或不方便的地方
3. 想想需要修改 SKILL.md 文件或相关资源的哪些部分
4. 修改完成后再测试一遍

---

下一篇我们来仔细拆解 Claude 官方的 Skills，加速学习进度 🚀。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[情感计算新范式：语义空间论]]></title>
            <link>https://tophci.com/posts/251014-semantic-space-theory</link>
            <guid isPermaLink="true">https://tophci.com/posts/251014-semantic-space-theory</guid>
            <category><![CDATA[情感计算]]></category>
            <category><![CDATA[HCI]]></category>
            <category><![CDATA[Emotion]]></category>
            <category><![CDATA[Research]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 13 Oct 2025 16:00:00 GMT</pubDate>
            <content:encoded>
在人机交互研究中，当我们讨论“情绪”，往往会陷入“六大基本情绪”和二维“Valence-Arousal”坐标的拉扯。可是在 AI 与多模态数据时代，这样的框架还够用吗？这篇文章试图用“语义空间论”搭一座桥：从争论已久的旧范式，走向可被数据反复检验、能直接驱动产品落地的新范式。先从“为什么关注”开始，随后快速浏览研究脉络，再进入核心思想与三大维度，最后回到可计算化与应用场景。读完你会对下一代情感计算方法有更多了解。

## 为什么关注语义空间论

情绪研究中主流理论和模型主要产生于上世纪 70-80 年代，缺乏严谨的定量验证，两大情绪理论已争论数十年，在 AI 时代需要新的研究方法和理论框架。

为了把问题从“旧争论”带入“新证据”，我们先明确当下的三个重要动因：

- 情绪的内在复杂性：是否可以用 2/3 维来准确刻画？
- 情感计算领域发展的新范式：数据驱动、多模态、动态计算、与 AI 模型结合
  - 需要使用大规模、数据驱动的方法
  - 如果能结合实时生理传感与生成式模型，语义空间论有望成为“情绪-智能交互”系统的核心理论
- 理论经过规模化验证：理论 → 大规模数据验证 → 工业界应用
  - VAD 存在预设维度、数据验证不足等问题
  - 语义空间论的数十篇论文提供了数据规模、跨模态、跨文化、神经和生物进化等方面的有力证据

所谓新的范式，这仅是命名游戏，而是可验证、可复现、可落地的范式迁移。接下来，让我们回溯这一迁移中的关键节点与人物。

## 研究脉络和研究者

情感计算领域的奠基之作

![affective computing](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/affective%20computing.png)

| 理论/框架                       | 代表作与年份                                                    | 核心命题                        | 可计算化要点                             | 关键标准化                              |
| ------------------------------- | --------------------------------------------------------------- | ------------------------------- | ---------------------------------------- | --------------------------------------- |
| PAD（三维 V-A-D）               | Mehrabian &amp; Russell, 1974                                       | 在 V-A 上加入支配/控制维        | 三维 VAD 作为统一标签空间                | SAM 量表/环境心理学与 HCI 评估          |
| FACS 面部动作编码 + 基本情绪    | Ekman &amp; Friesen, 1978; Ekman et al., 2002; Ekman, 1992          | 用 AU 编码肌肉动作/离散基本情绪 | AU 中间语义层 → 分类与检测任务           | FACS 手册/训练体系/表情库与评测         |
| 环形模型（Circumplex）          | Russell, 1980                                                   | 效价 × 唤醒二维连续空间         | 连续情感回归/标注的坐标系                | 与 SAM/GEW/连续标注协议共振             |
| OCC 模型（评价本体）            | Ortony, Clore &amp; Collins, 1988                                   | 基于事件/行为/对象的评价结构    | 生成/判断情绪的可执行规则本体            | 虚拟人/游戏/教育代理情感逻辑            |
| Affective Computing             | Picard, 1997                                                    | 计算机应识别/表达/调节情绪      | 将情绪识别与调节定义为工程任务与接口范式 | 催生多模态识别/调控任务、挑战与系统设计 |
| Core Affect（核心情感）         | Russell, 2003                                                   | 核心情感是体验的连续基底        | V-A 作潜在态，时变与生理/自报对齐        | 移动经验取样/连续标注方法论             |
| Appraisal→EMA（计算化评价理论） | Lazarus, 1991; Smith &amp; Ellsworth, 1985; Gratch &amp; Marsella, 2004 | 情绪源自目标相关的情境评价      | EMA 将评价变量形式化为可模拟系统         | 情感推理/交互仿真框架                   |
| 组件过程模型（CPM）             | Scherer, 2005                                                   | 情绪=评价驱动的多组件动态过程   | 评价变量 → 生理/表达/动机的流程映射      | GEW/多组件测量框架与协议                |
| 情绪构建论（CAT/TCE）           | Barrett, 2006; 2017                                             | 核心情感 × 概念知识构建情绪     | 跨语义/跨文化标签不变性与对齐            | 对标签体系与泛化设定的校正              |
| 语义情绪空间（高维连续）        | Cowen &amp; Keltner, 2017–2021                                      | ≥25/27 类在高维语义上渐变       | 自然刺激+大样本标注 → 连续嵌入           | 跨文化/模态扩展，影响任务设定           |

感兴趣的朋友可以看看主流情绪理论论战背景：[情绪大辩论——基本情绪论 vs 情绪建构论](https://www.tophci.com/posts/250915-emotion-debate)

| **理论类型** | **核心主张**                                                                       |
| ------------ | ---------------------------------------------------------------------------------- |
| 基础情绪理论 | 5-8 种离散情绪，边界清晰                                                           |
| 建构主义理论 | 情绪基于 2-3 维核心情感（效价 / 唤醒度），具体的情绪概念由语言建构，因人和情境而异 |

为了看清“从奠基到收敛”的路径，下面这条时间线聚焦于语义空间论如何一步步补全证据版图。

| **阶段**                       | **核心思想**                                                                                                                                                 | **关键论文**                                                                                                                                                                                                  |
| ------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **第一阶段：奠基与探索**       | 挑战传统离散情感类别，通过大规模数据分析，揭示情感体验的**高维连续性**。构建了包含 27 个维度的“情感地图”，并证明不同情感间存在平滑的梯度过渡。               | - (2017) Self-report captures 27 distinct categories of emotion bridged by continuous gradients&lt;br /&gt;- (2019) Mapping the Passions: Toward a High-Dimensional Taxonomy of Emotional Experience and Expression |
| **第二阶段：理论的正式提出**   | 正式提出“语义空间理论”，将其作为一个统一的**计算框架**。主张情感由高维语义特征定义，并将主观感受、面部表情、声音语调等不同模态的情感信息映射到该统一空间中。 | - (2020) Semantic Space Theory: A Computational Approach to Emotion                                                                                                                                           |
| **第三阶段：理论的深化与应用** | 将语义空间理论用于**解释和整合**传统情感理论。证明了“基本情绪”在语义空间中是范围更广、密度更高的区域，从而统一了离散类别与连续维度的观点。                   | - (2022) Semantic Space Theory: Data-Driven insights Into Basic Emotions                                                                                                                                      |

语义空间论的提出者是 [Alan S. Cowen](https://scholar.google.com/citations?hl=en&amp;user=-i9gbsAAAAAJ&amp;view_op=list_works&amp;sortby=pubdate)，了解他的背景，能帮助我们更好地评估对语义空间论的发展和潜力。

| 维度           | 详细信息                                                                                                                                                                                                                                                                                      |
| -------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **教育背景**   | • 本科：耶鲁大学认知科学 &amp; 应用数学双学位&lt;br /&gt;• 博士(2013-2016)：加州大学伯克利分校心理学，师从 [Dacher Keltner](https://scholar.google.com/citations?user=oqw_lMkAAAAJ&amp;hl=en&amp;oi=sra)，主攻计算情绪科学                                                                                      |
| **学术贡献**   | - 创立“语义空间论”(2017)并在多模态、多文化数据上验证。&lt;br /&gt;- 首批使用 &gt;1 万条跨国视频/音乐/表情数据库探测情绪几何结构。                                                                                                                                                                      |
| **产业化路径** | 1. Google(2018-2020)：创建 Affective Computing 团队，研发面部-声学情绪识别引擎。&lt;br /&gt;2. Facebook (顾问)：为情感理解模型提供算法咨询。&lt;br /&gt;3. **Hume AI**（创始人兼 CEO/Chief Scientist）：推出 Expression API、Octave、多语种 Empathic Voice Interface (EVI 2)，让 LLM 具备情绪表达与“聆听” |

## 语义空间论核心思想

接下来让我们把“脉络”转为“方法”，梳理出语义空间论（Semantic Space Theory, SST）的核心内容：

| 核心要点         | 说明                                                                                                                                                                                                                                                                                                                                                     |
| ---------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **出发点**       | 情绪研究两大流派都围绕“六大情绪”一对一映射展开，忽视了大量真实情绪信息，难以解释人类体验的丰富渐变(“六大”与 V-A 仅捕获 ≈30 % 信息)                                                                                                                                                                                                                       |
| **基本假设**     | 情绪体验、表情、声纹、姿态等**共同**存在于一个高维连续语义空间；情绪之间并非孤岛，而是被渐变梯度连接。                                                                                                                                                                                                                                                   |
| **数据驱动方法** | 大规模跨文化数据收集 → 受试者对多模态刺激进行自由标签或情绪强度评分 → 以非线性降维（t-SNE、UMAP、Diffusion Maps）寻找情绪几何结构 → 计算机自动聚类与可视化。                                                                                                                                                                                             |
| **关键发现**     | - 观看 2185 段影片，自报告稳定聚成 **27 种**情绪簇，且簇之间由连贯梯度连接，而非离散断裂 ([PubMed](https://pubmed.ncbi.nlm.nih.gov/28874542/))。&lt;br /&gt;- 在音乐领域，可复现 **13 种**跨文化一致的情绪维度 ([PubMed](https://pubmed.ncbi.nlm.nih.gov/31907316/?utm_source=chatgpt.com))。&lt;br /&gt;- 面部表情也呈现 **28-30** 类以上的情绪簇，且兼具混合形态。 |
| **对比传统模型** | - **基本情绪论**：主张只有少数离散情绪（6 ～ 8 类基本情绪）、边界清晰；SST 发现类别远多于 6 ～ 8，且边界模糊。 &lt;br /&gt;- **建构论**：认为核心影响因子是 valence-arousal，具体情绪由文化与语言建构；SST 证明需要十几维以上才能保持心理语义差异。                                                                                                            |
| **应用**         | - 细粒度情绪识别 API（如 Hume AI）&lt;br /&gt;- 情感音乐推荐、广告创意测试、跨文化情绪本体构建。                                                                                                                                                                                                                                                               |
| **常见质疑**     | 自报告偏倚；受试者多来自在线众包（文化代表性不足）；高维空间如何映射到脑机制仍在探索。                                                                                                                                                                                                                                                                   |

&gt; 语义空间论将情绪视作一张**连续**、彩色的**高维**地图

![](https://directus.hume.ai/assets/0fb0ab99-8b7f-44de-8a58-fda55189ec68/blogembed.jpg?width=1332&amp;height=1240&amp;quality=75&amp;format=webp&amp;fit=inside)

&gt; 利用自然语料/视频/音乐等大规模刺激 + 自由标签 + 多维可靠性分析，在不预设类别的条件下揭示维度结构。

为避免概念停留在概念，我们把镜头拉近到具体的三大关键，将语义空间论落到任务定义与评测指标上。

语义空间论的三大关键

| 关键点                     | 核心问题                  | 关键点                                                                                         |
| -------------------------- | ------------------------- | ---------------------------------------------------------------------------------------------- |
| **Dimensionality 维度**    | 情绪有多少可区分维/类别？ | 需 **25 种以上离散情绪**才能很好解释人类情绪变异                                               |
| **Distribution 分布**      | 类别边界是离散还是连续？  | 多数情绪间无绝对边界，存在连续梯度（如敬畏与兴趣的过渡态）及混合态（如厌恶 + 恐惧、爱 + 渴望） |
| **Conceptualization 概念** | 最佳注解单位是什么？      | 情绪类别是核心解释变量，效价 / 唤醒度仅能解释 30% 变异                                         |

## SST 的方法和证据

**方法革新：构建高维情绪研究的新范式**

| **研究焦点** | **传统模型方法**   | **高维情绪研究方法**                           |
| ------------ | ------------------ | ---------------------------------------------- |
| 情绪范围     | 仅关注 “基础六种”  | 开放探索多情绪及混合态（如敬畏、胜利感）       |
| 数据来源     | 依赖科学家假设     | 基于实证数据（民族志、自由反应、自然场景观察） |
| 测量维度     | 仅测量面部肌肉运动 | 多模态测量（面部 + 身体 + 声音 + 凝视 + 触摸） |
| 统计方法     | 计算情绪识别准确率 | 多维可靠性分析、t-SNE 可视化、机器学习建模     |

&gt; 证据力度：大规模、跨模态、跨文化、神经&amp;生物

![](https://directus.hume.ai/assets/804d54b7-7134-487f-9c6b-e5336ddb8dca/Fig1RR.jpg?width=1920&amp;height=1048&amp;quality=75&amp;format=webp&amp;fit=inside)

### 1.人类的情感体验和表达是高维、连续的

| **证据简述**                                                                                                                                                                                           | **备注**                                                                                                                                                                 | **Reference**                                                                                                                                                                                                                                                                                                                  |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **情感体验的高维证据**：通过对 2185 个短视频的反应进行分析，研究识别出 27 种不同的情感体验维度                                                                                                         | 证据的代表性极强，使用了海量、多样的情感诱发材料，远超传统研究。方法（SH-CCA）和数据（提供交互式地图）公开透明，可验证性高。该证据直接、有力地支持了“高维性”主张。       | Keltner, D., Brooks, J. A., &amp; Cowen, A. (2023). Semantic Space Theory: Data-Driven Insights Into Basic Emotions. Current Directions in Psychological Science, 32(3), 242–249. [https://doi.org/10.1177/09637214221150511](https://doi.org/10.1177/09637214221150511)                                                           |
| **情感边界的模糊性证据**：情感语义空间图显示，不同情感类别（颜色区域）之间存在大量混合与渐变，而非清晰的边界。例如，认知评估（如“努力”）可以连接“厌恶”和“愤怒”等不同情感。                             | t-SNE 可视化方法本身会扭曲距离，但局部结构的连续性清晰可见，可验证性较好。它直观地反驳了基本情感理论的“离散性”假设，极具说服力。                                         | 同上                                                                                                                                                                                                                                                                                                                           |
| **情感的混合与渐变性**：研究发现，传统上被视为离散的情感类别（如恐惧和惊讶）之间存在平滑的过渡梯度，形成了复合的、可被识别的混合情感表达。                                                             | 证据具说服力，论文提供了交互式地图的链接，允许读者亲自验证和探索数据，可验证性非常高。                                                                                   | Cowen, A. S., &amp; Keltner, D. (2021). Semantic Space Theory: A Computational Approach to Emotion. Trends in Cognitive Sciences, 25(2), 124–136. [https://doi.org/10.1016/j.tics.2020.11.004](https://doi.org/10.1016/j.tics.2020.11.004)                                                                                         |
| **传统模型的局限性**：六基本情感模型和二维环形模型最多只能解释情感体验与表达中[30%的系统性变异](https://bytedance.larkoffice.com/docx/ZDJsdIYDqoMXj6xcOEmcDkrwnie#share-Z5u0dp0vfoiCdbxRqYBcAGtxnAf)。 | 通过量化现有模型的解释力差距，直接凸显了探索新模型的必要性。数据来源于对该领域研究的元分析总结。                                                                         | Cowen, A., Sauter, D., Tracy, J. L., &amp; Keltner, D. (2019). Mapping the Passions: Toward a High-Dimensional Taxonomy of Emotional Experience and Expression. Psychological Science in the Public Interest, 20(1), 69–90. [https://doi.org/10.1177/1529100619850176](https://doi.org/10.1177/1529100619850176)                   |
| **可识别情绪种类远超 6 种**：人类通过面部、身体、姿态和声音的组合，可以表达超过 20 种不同的情感状态。                                                                                                  | • 视觉：2185 个视频刺激需 27 种情绪类别解释变异&lt;br /&gt;• 声音：2032 个声音片段可传递 24 种情绪，跨 14 种文化验证&lt;br /&gt;• 面部/身体：1500 个自然场景表情可识别 28 种情绪     | 同上                                                                                                                                                                                                                                                                                                                           |
| **语义空间映射法**：介绍了一种新的研究方法，即利用大规模统计建模和机器学习，将人们对情感的描述映射到一个高维“语义空间”，从而系统地识别和组织情感类别。                                                 | 这既是证据也是方法论的展示。通过引入一种能够处理高维复杂性的新方法，作者证明了探索情感丰富性在技术上是可行的。方法论清晰，引用了具体应用研究。                           | 同上                                                                                                                                                                                                                                                                                                                           |
| **情绪体验与关系评估的关联证据**：引用多项研究证明，特定的主观情绪体验与相应的关系需求评估高度相关。例如，同情与他人的安全需求相关，自豪感与地位提升相关，愤怒与不公平感相关。                         | 证据来源于大量实证研究的综述，覆盖了多种情绪和关系，代表性强。虽然是二手引用，但引用的文献均为该领域的代表性成果，因此说服力高，直接支撑了“情绪体验追踪关系需求”的原则。 | Keltner, D., Sauter, D., Tracy, J. L., Wetchler, E., &amp; Cowen, A. S. (2022). How emotions, relationships, and culture constitute each other: Advances in social functionalist theory. _Cognition and Emotion_, _36_(3), 388–401. [https://doi.org/10.1080/02699931.2022.2047009](https://doi.org/10.1080/02699931.2022.2047009) |
| **情绪认知引导社会行动的证据**：特定的情绪会系统性地改变个体的认知（如注意、记忆、判断），从而引导出符合当前关系需求的社会行为。例如，同情心会让人更关注弱者并倾向于提供帮助。                         | 基于大量实证研究综述的证据。它清晰地展示了从“内在感受”到“外在行动”的转化路径，有力地支撑了“情绪认知指导关系行动”的原则。                                                 | 同上                                                                                                                                                                                                                                                                                                                           |

### 2.是否跨模态研究（早期的情绪理论仅关注面部表情）

| **证据简述**                                                                                                                                       | **备注**                                                                                                                                         | **Reference**                                                                                                                                                                                                                                                                                                    |
| -------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **声音表达的丰富性**：引用多项研究证明，人类声音（如笑、哭、叹息、呻吟等）可以传达超过 24 种不同的情感，并提供了可交互的在线声音情感地图作为实例。 | 证据非常具体，不仅引用了多项研究，还提供了可供读者亲身体验的交互式地图，代表性和可验证性极高，有力地证明了情感表达远超六种。                     | Cowen, A., Sauter, D., Tracy, J. L., &amp; Keltner, D. (2019). Mapping the Passions: Toward a High-Dimensional Taxonomy of Emotional Experience and Expression. _Psychological Science in the Public Interest_, _20_(1), 69–90. [https://doi.org/10.1177/1529100619850176](https://doi.org/10.1177/1529100619850176) |
| **多模态表达的多样性**：引用综述性研究指出，人类通过面部、身体、姿态和声音的组合，可以表达超过 20 种不同的情感状态。                               | 证据来自权威的综述文章，整合了多个研究的发现，具有较好的代表性。                                                                                 | 同上                                                                                                                                                                                                                                                                                                             |
| **情感识别的基线有效性**：实验结果表明，在 34 种情绪中，有 29 种的全身动态表达能够被被试以远超随机猜测的准确率识别出来。                           | 证明了实验范式（全身动态表达）的有效性，说明后续的组间比较（性别、族裔、阶层）是建立在一个可靠的测量基础之上的。样本量大，情绪种类多，代表性强。 | Monroy, M., Cowen, A. S., &amp; Keltner, D. (2022). Intersectionality in emotion signaling and recognition: The influence of gender, ethnicity, and social class. _Emotion_, _22_(8), 1980–1988. [https://doi.org/10.1037/emo0001082](https://doi.org/10.1037/emo0001082)                                            |
| **情感表达的多模态性**：论文引用多项研究证明，情感通过面部、声音（语调和非词汇声音）、身体动作、凝视、手势和触觉等多种渠道表达。                   | 综合了跨越多种模态的研究，证据基础广泛。引用的研究均可查证，有力支持了“表达是多模态的”这一核心论点。                                             | Keltner, D., Sauter, D., Tracy, J., &amp; Cowen, A. (2019). Emotional Expression: Advances in Basic Emotion Theory. _Journal of Nonverbal Behavior_, _43_(2), 133–160. [https://doi.org/10.1007/s10919-019-00293-3](https://doi.org/10.1007/s10919-019-00293-3)                                                      |

### 3.是否跨文化验证

| **证据简述**                                                                                                                                                                                                 | **备注**                                                                                                                                                                 | **Reference**                                                                                                                                                                                                                                                        |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **可识别情感数量的扩展**：引用跨文化研究表明，通过声音爆发等非语言线索，超过 20 种情感可以被不同文化背景的参与者可靠地识别。                                                                                 | 引用了大规模跨文化研究（10 个国家），代表性强。研究方法清晰（如将故事与声音匹配），可验证性高，是支撑核心主张的强力证据。                                                | Keltner, D., Sauter, D., Tracy, J., &amp; Cowen, A. (2019). Emotional Expression: Advances in Basic Emotion Theory. Journal of Nonverbal Behavior, 43(2), 133–160. [https://doi.org/10.1007/s10919-019-00293-3](https://doi.org/10.1007/s10919-019-00293-3)              |
| **社会阶层的显著影响**：统计分析明确显示，来自较低社会阶层（通过麦克阿瑟量表测量）的个体，其情绪表达被识别的准确率更高（是更好的表达者）；同时，他们在识别他人情绪时也表现出更高的准确率（是更好的识别者）。 | 数据分析清晰，结果显著。它将社会阶层这一社会经济变量与基本的情感能力联系起来，为交叉性理论提供了强有力的实证支持。样本主要来自美国，在文化上代表性有一定局限。           | Monroy, M., Cowen, A. S., &amp; Keltner, D. (2022). Intersectionality in emotion signaling and recognition: The influence of gender, ethnicity, and social class. Emotion, 22(8), 1980–1988. [https://doi.org/10.1037/emo0001082](https://doi.org/10.1037/emo0001082)    |
| **性别差异的缺失**：无论是在情绪表达的清晰度（女性 vs. 男性被识别的准确率）还是在情绪识别的能力（女性 vs. 男性识别者的准确率）上，均未发现显著的性别差异。                                                   | 它是在一个比以往研究更复杂、更生态化的范式下得出的，直接挑战了“女性在情绪识别上更有优势”的传统观点。样本覆盖了 155 名表达者和 555 名识别者，代表性好。                   | 同上                                                                                                                                                                                                                                                                 |
| **族裔“群内优势”的缺失**：研究未发现识别者在判断自己族裔（亚裔、拉丁裔、欧裔美国人）的表达时比判断其他族裔的表达更准确。即预期的“群内优势”效应没有出现。                                                     | 该结果对“文化塑造了情绪表达的方言”这一观点提出了挑战，至少在这种全身表达的情境下不适用。                                                                                 | 同上                                                                                                                                                                                                                                                                 |
| **具体情感概念的首要性证据（跨文化层面）**：跨文化研究（如比较美国和印度对语音语调的识别）显示，具体情感的识别具有更高的一致性（相关性更高），而效价和唤醒度的跨文化一致性则相对较低。                       | 证据覆盖了语音、音乐等多个领域和中美、美印等多个文化对，代表性好。文中数据和统计方法清晰呈现，可验证性高。该证据有力地表明，具体情感是跨文化交流中更稳定、更核心的信号。 | Keltner, D., Brooks, J. A., &amp; Cowen, A. (2023). Semantic Space Theory: Data-Driven Insights Into Basic Emotions. Current Directions in Psychological Science, 32(3), 242–249. [https://doi.org/10.1177/09637214221150511](https://doi.org/10.1177/09637214221150511) |
| **具体情感的跨文化首要性**：跨文化研究（美国、中国、印度）显示，具体情感（如愤怒）的归因比效价和唤醒度的归因在不同文化中更一致。                                                                             | 该证据直接挑战了建构主义的核心观点，即效价和唤醒度是首要的。研究涉及多个文化，增加了代表性。                                                                             | Cowen, A. S., &amp; Keltner, D. (2021). Semantic Space Theory: A Computational Approach to Emotion. Trends in Cognitive Sciences, 25(2), 124–136. [https://doi.org/10.1016/j.tics.2020.11.004](https://doi.org/10.1016/j.tics.2020.11.004)                               |
| **古代艺术中的情感表达**：对古美洲雕塑的研究发现，其面部表情与西方人对特定情境下（如战斗、痛苦）的情感预期一致，暗示了情感表达的普遍性。                                                                     | 这是一个有趣的辅助证据，但样本量（63 个雕塑）相对较小，主要用于支持情感表达的普遍性，对核心主张的支撑力中等。                                                            | 同上                                                                                                                                                                                                                                                                 |

### 4.是否有神经/进化层面的证据

| **证据简述**                                                                                                                                                                                                     | **备注**                                                                                                                                                                                       | Reference                                                                                                                                                                                                                                                                                                                                                                                        |
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **神经解码分析**：成功地从多个脑区的 fMRI 活动模式中，准确预测出与视频相关的数十种具体情绪的评分。                                                                                                               | 该证据直接表明，不同情绪类别在大脑中有可区分的、独特的神经信号模式，这是“高维度”和“类别化”主张的核心支持。                                                                                     | Cowen, A. S., Keltner, D., Amiriparian, S., Christ, L., König, A., Cowen, A., Meßner, E.-M., Cambria, E., &amp; Schuller, B. W. (2020). The Neural Representation of Visually Evoked Emotion Is High-Dimensional, Categorical, and Distributed across Transmodal Brain Regions. _Emotion_, _23_(5), 101060. [https://doi.org/10.1016/j.isci.2020.101060](https://doi.org/10.1016/j.isci.2020.101060) |
| **编码模型对比分析**：构建了基于“情绪类别”和“情绪维度”的两种模型来预测每个体素的活动。结果显示，在绝大多数脑区，“情绪类别”模型比“情绪维度”模型能更好地解释大脑活动。                                             | 这是最有力的证据，直接将两种对立的理论（类别论 vs. 维度论）置于实证检验之下，并得出了明确支持类别论的结论。                                                                                    | 同上                                                                                                                                                                                                                                                                                                                                                                                             |
| **无监督聚类分析**：对与情绪相关的大脑活动模式进行降维和聚类，发现这些活动模式自然地形成了与特定情绪类别相对应的簇状结构，并且簇之间存在连续的梯度。                                                             | 该证据不依赖于预设的标签，从数据驱动的角度揭示了大脑表征的内在结构，进一步证实了“类别化”和“梯度过渡”的观点。                                                                                   | 同上                                                                                                                                                                                                                                                                                                                                                                                             |
| **具体情感概念的首要性证据（神经科学层面）**：引用神经科学研究（fMRI 等）指出，大脑对情感的表征在时间上是先识别出具体情感，稍后才形成效价/唤醒度的抽象概念；并且，具体情感类别能更好地解释大脑各区域的活动模式。 | 证据来自第三方研究，增强了论证的客观性，但其本身的样本代表性需审视原文献。引用的文献清晰可查，可验证性好。来自神经科学的证据为作者的心理学主张提供了生理层面的支持，构成了强有力的跨学科印证。 | Keltner, D., Brooks, J. A., &amp; Cowen, A. (2023). Semantic Space Theory: Data-Driven Insights Into Basic Emotions. Current Directions in Psychological Science, 32(3), 242–249. [https://doi.org/10.1177/09637214221150511](https://doi.org/10.1177/09637214221150511)                                                                                                                             |

- **分布表征**：情绪类别信息分布于默认模式网络（DMN）及下丘脑-边缘系统，而非单一脑区。
- **时间进程**：大脑对声音情绪的表征中，**具体情绪先出现**（早期神经响应），效价 / 唤醒度后出现（晚期 “抽象化” 响应），反驳建构主义 “先有核心情感，后建构具体情绪” 的主张。
- **脑区覆盖**：在所有皮层/皮下区域，具体情绪对脑激活模式的解释力均强于效价 / 唤醒度，说明即使是皮层下的基础情绪加工，也以具体情绪为核心。

与哺乳动物情绪行为的相似性：人类的 12 种情绪在哺乳动物的行为和神经生理学中有相似之处

| **情绪**            | **哺乳动物中相似的行为和神经生理表现**                                                   |
| ------------------- | ---------------------------------------------------------------------------------------- |
| 娱乐、玩耍          | 非人类哺乳动物的玩耍表情、笑声和玩耍行为，大脑刺激引发的欢乐笑声                         |
| 愤怒、攻击          | 哺乳动物中类似咆哮的同源行为，下丘脑的攻击机制                                           |
| 焦虑、紧张          | 非人类动物的替代行为（如自我梳理），黑猩猩的安慰缓解，猕猴中抗焦虑药物的缓解作用         |
| 厌恶、反感          | 灵长类对酸 / 苦味的面部反应，小鼠的面部表情和神经相关物，岛叶在厌恶识别 / 体验中的作用等 |
| 狂喜、愉悦          | 新生儿 / 灵长类的享乐反应，小鼠的面部表情和神经相关物                                    |
| 恐惧、警报          | 非人类动物的警报叫声，杏仁核对尖叫样声音的反应等                                         |
| 爱、 bonding        | 动物的亲子触摸，催产素在大鼠 / 田鼠 / 绢毛猴等的 bonding 中的作用等                      |
| 疼痛（身体 / 共情） | 非人类动物的疼痛鬼脸，前扣带皮层（ACC）在疼痛识别 / 体验中的作用等                       |
| 骄傲、地位          | 猿的直立姿势和双足大摇大摆                                                               |
| 悲伤、失落          | 黑猩猩的哭泣表情和呜咽，中脑对婴儿哭声的反应                                             |
| 羞耻、顺从          | 哺乳动物甚至非哺乳动物的姿势收缩和缩小的顺从展示                                         |
| 同情、安慰          | 动物的安慰行为，对痛苦叫声的照顾反应等                                                   |

## 语义空间论给我们带来了什么

- 一个判断框架：当模型只在 V-A 上做回归时，问一句“是否丢失了大部分语义差异？”
- 一个工程抓手：把“情绪类别与梯度”作为标签与指标，支持多模态一致性评估。
- 一个落地方向：将 SST 视作“情绪-智能交互”的通用语义底座，从实验到产品闭环。

## 参考文献

Baird, A., Tzirakis, P., Brooks, J., Kim, L., Opara, M., Gregory, C., Metrick, J., Boseck, G., Keltner, D., &amp; Cowen, A. (2022). State &amp; Trait Measurement from Nonverbal Vocalizations: A Multi-Task Joint Learning Approach. _Interspeech 2022_, 2028–2032. [https://doi.org/10.21437/Interspeech.2022-10927](https://doi.org/10.21437/Interspeech.2022-10927)

Brooks, J. A., Kim, L., Opara, M., Keltner, D., Fang, X., Monroy, M., Corona, R., Tzirakis, P., Baird, A., Metrick, J., Taddesse, N., Zegeye, K., &amp; Cowen, A. S. (2024). Deep learning reveals what facial expressions mean to people in different cultures. _iScience_, _27_(3), 109175. [https://doi.org/10.1016/j.isci.2024.109175](https://doi.org/10.1016/j.isci.2024.109175)

Brooks, J. A., Tiruvadi, V., Baird, A., Tzirakis, P., Li, H., Gagne, C., Oh, M., &amp; Cowen, A. (2023). Emotion Expression Estimates to Measure and Improve Multimodal Social-Affective Interactions. _International Cconference on Multimodal Interaction_, 353–358. [https://doi.org/10.1145/3610661.3616129](https://doi.org/10.1145/3610661.3616129)

Cordaro, D. T., Sun, R., Kamble, S., Hodder, N., Monroy, M., Cowen, A., Bai, Y., &amp; Keltner, D. (2020). The recognition of 18 facial-bodily expressions across nine cultures. _Emotion_, _20_(7), 1292–1300. [https://doi.org/10.1037/emo0000576](https://doi.org/10.1037/emo0000576)

Cowen, A. S., Elfenbein, H. A., Laukka, P., &amp; Keltner, D. (2019). Mapping 24 emotions conveyed by brief human vocalization. _American Psychologist_, _74_(6), 698–712. [https://doi.org/10.1037/amp0000399](https://doi.org/10.1037/amp0000399)

Cowen, A. S., Fang, X., Sauter, D., &amp; Keltner, D. (2020). What music makes us feel: At least 13 dimensions organize subjective experiences associated with music across different cultures. _Proceedings of the National Academy of Sciences_, _117_(4), 1924–1934. [https://doi.org/10.1073/pnas.1910704117](https://doi.org/10.1073/pnas.1910704117)

Cowen, A. S., &amp; Keltner, D. (2017). Self-report captures 27 distinct categories of emotion bridged by continuous gradients. _Proceedings of the National Academy of Sciences_, _114_(38). [https://doi.org/10.1073/pnas.1702247114](https://doi.org/10.1073/pnas.1702247114)

Cowen, A. S., &amp; Keltner, D. (2020a). Universal facial expressions uncovered in art of the ancient Americas: A computational approach. _Science Advances_, _6_(34), eabb1005. [https://doi.org/10.1126/sciadv.abb1005](https://doi.org/10.1126/sciadv.abb1005)

Cowen, A. S., &amp; Keltner, D. (2020b). What the face displays: Mapping 28 emotions conveyed by naturalistic expression. _American Psychologist_, _75_(3), 349–364. [https://doi.org/10.1037/amp0000488](https://doi.org/10.1037/amp0000488)

Cowen, A. S., &amp; Keltner, D. (2021). Semantic Space Theory: A Computational Approach to Emotion. _Trends in Cognitive Sciences_, _25_(2), 124–136. [https://doi.org/10.1016/j.tics.2020.11.004](https://doi.org/10.1016/j.tics.2020.11.004)

Cowen, A. S., Keltner, D., Amiriparian, S., Christ, L., König, A., Cowen, A., Meßner, E.-M., Cambria, E., &amp; Schuller, B. W. (2020). The Neural Representation of Visually Evoked Emotion Is High-Dimensional, Categorical, and Distributed across Transmodal Brain Regions. _Emotion_, _23_(5), 101060. [https://doi.org/10.1016/j.isci.2020.101060](https://doi.org/10.1016/j.isci.2020.101060)

Cowen, A. S., Keltner, D., Schroff, F., Jou, B., Adam, H., &amp; Prasad, G. (2021). Sixteen facial expressions occur in similar contexts worldwide. _Nature_, _589_(7841), 251–257. [https://doi.org/10.1038/s41586-020-3037-7](https://doi.org/10.1038/s41586-020-3037-7)

Cowen, A. S., Laukka, P., Elfenbein, H. A., Liu, R., &amp; Keltner, D. (2019). The primacy of categories in the recognition of 12 emotions in speech prosody across two cultures. _Nature Human Behaviour_, _3_(4), 369–382. [https://doi.org/10.1038/s41562-019-0533-6](https://doi.org/10.1038/s41562-019-0533-6)

Cowen, A., Sauter, D., Tracy, J. L., &amp; Keltner, D. (2019). Mapping the Passions: Toward a High-Dimensional Taxonomy of Emotional Experience and Expression. _Psychological Science in the Public Interest_, _20_(1), 69–90. [https://doi.org/10.1177/1529100619850176](https://doi.org/10.1177/1529100619850176)

Demszky, D., Movshovitz-Attias, D., Ko, J., Cowen, A., Nemade, G., &amp; Ravi, S. (2020). _GoEmotions: A Dataset of Fine-Grained Emotions_ (No. arXiv:2005.00547). arXiv. [https://doi.org/10.48550/arXiv.2005.00547](https://doi.org/10.48550/arXiv.2005.00547)

Keltner, D., Brooks, J. A., &amp; Cowen, A. (2023). Semantic Space Theory: Data-Driven Insights Into Basic Emotions. _Current Directions in Psychological Science_, _32_(3), 242–249. [https://doi.org/10.1177/09637214221150511](https://doi.org/10.1177/09637214221150511)

Keltner, D., &amp; Cowen, A. (2021). A taxonomy of positive emotions. _Current Opinion in Behavioral Sciences_, _39_, 216–221. [https://doi.org/10.1016/j.cobeha.2021.04.013](https://doi.org/10.1016/j.cobeha.2021.04.013)

Keltner, D., Sauter, D., Tracy, J., &amp; Cowen, A. (2019). Emotional Expression: Advances in Basic Emotion Theory. _Journal of Nonverbal Behavior_, _43_(2), 133–160. [https://doi.org/10.1007/s10919-019-00293-3](https://doi.org/10.1007/s10919-019-00293-3)

Keltner, D., Sauter, D., Tracy, J. L., Wetchler, E., &amp; Cowen, A. S. (2022). How emotions, relationships, and culture constitute each other: Advances in social functionalist theory. _Cognition and Emotion_, _36_(3), 388–401. [https://doi.org/10.1080/02699931.2022.2047009](https://doi.org/10.1080/02699931.2022.2047009)

Monroy, M., Cowen, A. S., &amp; Keltner, D. (2022). Intersectionality in emotion signaling and recognition: The influence of gender, ethnicity, and social class. _Emotion_, _22_(8), 1980–1988. [https://doi.org/10.1037/emo0001082](https://doi.org/10.1037/emo0001082)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[用 DSPy 框架构建可自动优化的 AI 系统（上）]]></title>
            <link>https://tophci.com/posts/250923-dspy-intro</link>
            <guid isPermaLink="true">https://tophci.com/posts/250923-dspy-intro</guid>
            <category><![CDATA[Agent]]></category>
            <category><![CDATA[DSPy]]></category>
            <category><![CDATA[Coding]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 22 Sep 2025 16:00:00 GMT</pubDate>
            <content:encoded>
## DSPy 是什么

DSPy（Declarative Self-Improving Python）是一个构建模块化 AI 系统的声明式框架。

- 给定任务和少量训练数据，框架能**自动**优化提示词和模型权重，指导模型高质量输出。
- 适合 RAG、Agent、复杂多步任务。

&gt; **核心理念：通过可组合、可测试、可优化的 Python 模块，用算法优化和调整 LM 提示和权重，最小化人工 prompt。**

| **核心概念**  | **作用**                                                                 | **关键问题**                                           | **例子**                                                                            |
| ------------- | ------------------------------------------------------------------------ | ------------------------------------------------------ | ----------------------------------------------------------------------------------- |
| **Signature** | 定义 LLM 的输入/输出规范（schema）                                       | • 给模型输入什么&lt;br /&gt;• 期望模型输出什么               | • 输入：用户 query 和任务、GUI 知识&lt;br /&gt;• 输出：高成功率低用户成本的自动打车操作流 |
| **Module**    | 通过自定义逻辑与 LLLM 交互的接口。对 Signature 应用推理策略。            | • 程序由哪些模块组成&lt;br /&gt;• 这些模块负责干什么         | 任务理解，状态检查，解空间构建，不确定性评估，澄清，安全确认                        |
| **Optimizer** | 根据标注数据，自动编译成 Few-Shot 示例、Prompt 模板，或微调 LoRA/FT 参数 | • 评估标准是什么，用哪些数据&lt;br /&gt;• 模型用什么方法优化 | • 评估标准：任务完成率，交互成本&lt;br /&gt;• 数据：成功打车的 trace&lt;br /&gt;• 方法：MIPROv2 |

![https://qdrant.tech/blog/dspy-vs-langchain/](https://qdrant.tech/blog/dspy-vs-langchain/process.jpg)

DSPy 用 **Signature + Module 把任务拆成可组合步骤，然后用 Optimizer 编译整条流水线**，自动生成高质量指令/示例/权重。

**类比：DSPy 可以替代厨师，自动迭代出最佳菜品**

- 点菜单 — Signature
- 厨房工序 — Module
- 机器人主厨 — Optimizer

| **DSPy 元件**      | **厨房角色**            | **细节 &amp; 过程**                                                                                                                                                                                                                                                                     | **优势**                                                       |
| ------------------ | ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------- |
| **Signature**      | 点菜单                  | - 顾客需求：`主料=海鲜,意面` `酱=番茄` `口味=鲜甜`&lt;br /&gt;- 只声明“要什么”，不写做法。                                                                                                                                                                                                | **声明式**：只关心输入/输出，屏蔽实现细节。                    |
| **Module**         | 厨房工序：炉台 &amp; 配菜区 | `if 海鲜不足: 退到冷柜补货先焯虾仁，再煸蒜末 → 倒番茄酱 → 收汁` &lt;br /&gt;业务规则（焯水 → 煸香 → 收汁）写入程序；&lt;br /&gt;“什么口味用户喜欢”交给 LLM 生成和试验。                                                                                                                         | **逻辑/语言解耦**：可单元测试，不怕 LLM 升级。                 |
| **Optimizer**      | AI 总厨反复试味         | 1. **搜示例**：把 20 份历史好评菜谱组合成不同 few-shot 套餐；&lt;br /&gt;2.**尝味评分**：每次做完请品控员打分（准确率、成本、咸淡）；&lt;br /&gt;3.**进化搜索**：把高分菜谱微调——加罗勒？换意面粗细？&lt;br /&gt;4.**LoRA 微调**：相当于给 AI 总厨加“秘密调味包”，在 100 份评价数据上再训练味觉偏好。 | **自动优化**：示例、提示、超参、权重一站式搜索；不用人肉调味。 |
| **compile() 产物** | 最终菜品                | - 保存：最优 prompt +示例，温度/检索 k，LoRA 权重……&lt;br /&gt;- 点菜时直接调用，出菜稳定可复现。                                                                                                                                                                                         | **可版本化 &amp; 热插拔**：JSON+LoRA 文件随时上新或回滚。          |

用流程图表示就是：

![dspy-kitchen](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dspy-kitchen.png)

示例：简单 QA 系统

```python
import dspy

# 1. 配置语言模型
dspy.settings.configure(lm=dspy.OpenAI(model=&quot;gpt-3.5-turbo&quot;))

# 2. 定义任务签名
class BasicQA(dspy.Signature):
    &quot;&quot;&quot;基于给定上下文回答问题。&quot;&quot;&quot;
    context: str = dspy.InputField(desc=&quot;与问题相关的段落&quot;)
    question: str = dspy.InputField(desc=&quot;用户的问题&quot;)
    answer: str = dspy.OutputField(desc=&quot;问题的答案&quot;)

# 3. 创建具有思维链推理的模块
qa = dspy.ChainOfThought(BasicQA)

# 4. 使用它
context = &quot;巴黎是法国的首都。&quot;
question = &quot;法国的首都是什么？&quot;
result = qa(context=context, question=question)

print(result.answer)  # 输出：巴黎
```

## 如何用 DSPy 构建可自动调优的 AI 系统：从声明到编译

1. **定义任务**：用 Signature 描述任务；用 Module 实现“先检索再生成”等逻辑。
2. **定义指标**：如 accuracy、BLEU、自定义 cost。
3. **选择优化器**：BootstrapFewShot、COPRO、K-NN Few-Shot 等。
4. **`compile()`**：DSPy 自动搜索示例 / 生成 synthetic data / 微调，小到 prompt 大到权重。
5. **评估/迭代**：当模型或数据变了，再次编译即可。`dspy.Evaluate` 支持 A/B 对比与持续学习。

典型场景与示例

- RAG 管道：官方教程展示了 Tech QA 任务，在同一段代码里组合 Retriever + Generator，并用优化器同时调检索和生成提示，显著提升 F1。
- 多步 Agent / 工具调用：DSPy 模块可嵌套循环，配合 self-consistency 或外部工具形成反思-执行代理，对推理链进行一致性投票减少幻觉。
  - **ReAct 代理**：把工具列表（如“读屏/点按/输入/抓取订单状态”等）交给 `dspy.ReAct`，让模型在“思考 → 行动 → 观察”的循环中选择工具；再用 MIPROv2 或 BootstrapFewShot 端到端优化。

极简打车助手 Agent

```python
import dspy

# 1) 选择模型（可换）
dspy.configure(lm=dspy.LM(&quot;openai/gpt-4o-mini&quot;))

# 2) 定义任务（签名与模块）
class JudgeStep(dspy.Signature):
    &quot;&quot;&quot;判断一个代理步骤是否合理，并提出改进建议&quot;&quot;&quot;
    context: str
    action: str
    verdict: bool
    critique: str

judge = dspy.ChainOfThought(JudgeStep)

# 3) 组装成程序
class AgentStep(dspy.Module):
    def forward(self, context):
        # 这里可以先 Predict 再 ReAct，这里为演示省略
        return judge(context=context, action=&quot;tap(&apos;打车&apos;)&quot;)

program = AgentStep()

# 4) 定义指标（玩具版：只要 verdict=True 算 1 分）
def metric(example, pred) -&gt; float:
    return 1.0 if getattr(pred, &quot;verdict&quot;, False) else 0.0

# 5) 少量训练/验证样例（真实项目用你的回放数据）
trainset = [dspy.Example(context=&quot;已定位到公司门口, 需要叫车&quot;).with_inputs(&quot;context&quot;)]

# 6) 选择优化器并编译
from dspy.teleprompt import MIPROv2
opt = MIPROv2(metric=metric)
compiled = opt.compile(program, trainset=trainset)   # 返回“已优化程序”

# 7) 推理
pred = compiled(&quot;已定位到公司门口, 需要叫车&quot;)
print(pred.verdict, pred.critique)
```

## DSPy 的优势

在平时的 PE 优化中，你可以也会遇到这些痛点：

| **维度**          | **传统 Prompt 优化**                  | **使用 DSPy 后的做法**                                         |
| ----------------- | ------------------------------------- | -------------------------------------------------------------- |
| **核心思路**      | 人工修改长 prompt，靠经验调顺序、示例 | **声明式 Signature + 模块化代码 + Optimizer 自动搜索最优方案** |
| **提示模板改写**  | 人工重写，多轮 AB 测试                | `COPRO / GEPA` 演化提示，遗传 + 自反思                         |
| **业务逻辑**      | 混在一段大 prompt 里，难以单测        | 业务逻辑写在 Python Module；LLM 仅补语言                       |
| **参数调优**      | 通过实验脚本手动网格搜索              | Optimizer 将超参视为可学参数一并搜索                           |
| **在线反馈利用**  | 另写 ETL → 手动改 prompt              | 日志 → `trainset_increment` → 夜间 compile() 自动增量学习      |
| **安全/风险控制** | 人工列规则，手工检查 prompt           | 规则写在 Module；`risk_penalty` 纳入 metric                    |
| **可观测性**      | 需自建日志系统；难还原完整 prompt     | `inspect_history()` 一键查看历史消息                           |
| **协作成本**      | Design ↔︎ Dev ↔︎ Ops 多角色协调       | DSL (Signature/Module) 代码即文档                              |
| **维护难度**      | 模型升级 → 全部 prompt 回归           | 大部分规则在 Python，提示自动再编译                            |
| **长期性能**      | 靠人工定期复盘，效果波动              | 每日自动编译，自监督渐进提升                                   |
| **投入估算**      | 早期人力小；数据增多后维护爆炸        | 初期写代码&amp;指标；后期维护自动化                                |

通过提供结构化模块、自动优化和组合模式，DSPy 使开发者能够构建：

- **更可靠**：结构化代码比字符串提示更不易出错
- **更可移植**：易于更换模型并适应新需求
- **更可优化**：通过编译和优化自动改进
- **更可维护**：清晰、模块化的结构易于理解和修改

DSPy vs LangChain

| 评估维度                 | LangChain | DSPy | 说明                      |
| ------------------------ | --------- | ---- | ------------------------- |
| 上手速度                 | 9         | 6    | LangChain 文档 + 示例丰富 |
| 生态丰富度               | 9         | 5    | DSPy 更聚焦内核           |
| 自动优化能力             | 4         | 9    | DSPy 核心竞争力           |
| 可编译/可重构性          | 6         | 9    | Signature → Program       |
| 工具/Agent 生产案例      | 9         | 5    | LangChain 成熟            |
| 推理质量迭代潜力         | 6         | 9    | DSPy 算法化               |
| 学术/研究友好            | 6         | 9    | 声明式 + 可控实验         |
| 成本精细化管理           | 7         | 7    | 均需自建策略              |
| 易与现有后端集成         | 8         | 7    | LangChain 适配器多        |
| 长期可维护性（结构清晰） | 7         | 8    | DSPy 结构化语义更清晰     |

（分值仅用于相对直觉，不是客观指标）

- LangChain：像一个“拼装厂” + “适配层”——让各种资源（模型、向量库、工具、Agent、工作流）快速跑通。
- DSPy：像一个“编译器 + 优化器”——把 LLM 互动抽象为可声明、可训练、可演化的程序。
- 选型核心分界：是在“解决集成问题”还是“解决质量/推理优化问题”。

也许 DSPy 最有潜力的地方，是它的理念非常贴合新的产品研发范式：**基准和评测先行，工程化模块保证可控，高质量学习数据是关键。**
</content:encoded>
        </item>
        <item>
            <title><![CDATA[情绪大辩论——基本情绪论 vs 情绪建构论]]></title>
            <link>https://tophci.com/posts/250915-emotion-debate</link>
            <guid isPermaLink="true">https://tophci.com/posts/250915-emotion-debate</guid>
            <category><![CDATA[Emotion]]></category>
            <category><![CDATA[情绪]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 14 Sep 2025 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; **不同文化的人是否共享相同的基本情绪表情？**

一个看似简单的问题，引发了关于情绪本质长达数十年的大辩论。这场关于“**情绪是天生还是后天建构**”的论争，如同一个跌宕起伏的故事。

本文介绍两大主要理论流派——基本情绪理论与情绪建构论——的发展历程和争议焦点，尝试整理情绪科学的发展脉络，为情感建模和计算提供理论参考。

![1-debate-insideout](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-debate-insideout.jpg)

两大情绪研究流派的核心差异

| 对比维度           | 基本情绪理论（[Paul Ekman](https://scholar.google.com/citations?hl=en&amp;user=ADetnc0AAAAJ)） | 情绪建构理论（[Lisa Feldman Barrett](https://scholar.google.com/citations?user=WF5c0_8AAAAJ&amp;hl=en&amp;oi=sra)） |
| ------------------ | ------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------- |
| **情绪本质**       | 天生的、进化而来的基本类别                                                                 | 大脑实时构建的、连续的情绪体验                                                                              |
| **普遍性**         | 情绪跨文化共享，有普遍性的面部表情                                                         | 情绪体验受文化和情境影响，无固定普遍模式                                                                    |
| **面部表情**       | 每种情绪都有独特且固定的面部表情模式                                                       | 表情是情境化的，非单一情绪的可靠指标                                                                        |
| **生物基础**       | 每种情绪对应特定生理模式和脑区域                                                           | 无特定生理或脑区模式，每种情绪涉及分布式脑网络                                                              |
| **典型代表情绪**   | 快乐、愤怒、悲伤、恐惧、厌恶、惊讶等                                                       | 情绪分类基于情境和文化，概念因人而异                                                                        |
| **研究方法**       | 跨文化情绪识别实验、面部表情编码（FACS）                                                   | 神经科学脑成像、文化与语言的对比研究                                                                        |
| **核心争议焦点**   | 是否存在固定情绪生物“指纹”和普遍表情模式                                                   | 情绪是否纯属社会概念和文化建构的产物                                                                        |
| **理论应用与影响** | 应用于测谎、面部识别技术、心理学临床诊断                                                   | 强调情绪管理、情绪教育，重视情境认知调节                                                                    |

![2-emotion-debate-timeline-all](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-emotion-debate-timeline-all.png)

## Side-A: 达尔文的遗产与基本情绪理论的兴起

19 世纪晚期，达尔文在著作《人类和动物的表情》中提出，人类的情绪表达可能具有进化根源。20 世纪中叶，美国心理学家 Silvan Tomkins 受到达尔文启发，提出人类存在一组与生俱来的**基本情绪**（包括**喜悦**、**惊讶**、**愤怒**、**恐惧**、**厌恶**、**羞愧**等），对应独特的面部表情和生理反应，并猜想它们是进化的适应性产物，用以在特定威胁或机遇时触发相应的行为反应。

Tomkins 的学生 Paul Ekman 展开了跨文化研究，希望寻找情绪表达的普遍模式。1960 年代末，Ekman 来到与世隔绝的新几内亚偏远山区中名为 Fore 的部族。这些族人从未看过电影，不识英文，也未曾与外界通婚或工作。Ekman 带去了一叠各式各样人脸表情的照片：

![3-6emotionface](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3-6emotionface.png)

图 1：Tomkins 于 1960 年代收集的六种基本情绪的面部表情照片。左上至右下：快乐、惊讶、恐惧、愤怒、厌恶、悲伤。

实验中，翻译员向受试者讲一个小故事，描述某人遇到特定情境时可能产生的情绪，然后请受试者从三张不同表情的照片中，挑选出与故事主人公情绪相符合的脸。结果令人惊讶：在关于“高兴”的例子中，受试者 100% 都选出了笑脸。在另一个对应“恐惧”表情的故事里，有 86% 的人选对了。这些受试者从未接触西方文化，这强有力地支持了 Tomkins 的猜想：**人类共享一些跨文化的基本情绪表达**。

也有一些细节值得注意。比如在区分“惊讶”和“恐惧”的表情时，Fore 人偶尔会混淆。Ekman 推测，这可能是因为在现实中，引发恐惧的情境往往也伴随着惊讶。此后多年，从偏远部落到现代都市，上述实验在多文化中重复了将近 200 次，结果大都支持基本情绪的普遍性。这些发现说明，人类并非一张情绪的“白板”，而是天生就具备识别和表达某些情绪的共同基础。

Ekman 由此提出了著名的**基本情绪理论**：人类有一组与生俱来的基本情绪（快乐、愤怒、恐惧、悲伤、厌恶、惊讶，后来增加第七种“轻蔑”）。每一种基本情绪被视作演化适应的产物，用来解决特定的生存问题。例如，“恐惧”有助于躲避危险，“愤怒”有助于应对威胁和争斗，“厌恶”则让我们避开腐坏有毒的食物。而其他更复杂的情绪（如内疚、嫉妒等）是由基本情绪组合或派生而成。

![4-insideout1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4-insideout1.png)

Inside Out 的角色原型源自基本情绪论，Ekman 曾作为科学顾问提供指导

基本情绪理论强调**情绪是离散的**，每种情绪都有独特的“表情程序”和生理模式。当我们感到愤怒或害怕时，大脑内会激活对应的“愤怒回路”或“恐惧回路”，触发特定的面部表情、心跳变化、激素水平等生理反应。我们可以通过观察一个人的面部表情或生理反应，**不借助上下文**就推断出他正在经历何种情绪——因为每种基本情绪有**特定的生物指纹**。

在此框架下，Ekman 发展出“面部动作编码系统”（Facial Action Coding System, FACS）等工具，将人脸细微肌肉运动精细编码，以科学方式研究表情。这套理论在 20 世纪下半叶被广泛写入心理学教材，也渗透到了大众文化中（例如美剧《Lie to me》）。基本情绪理论为情绪科学提供了直观而有力的模型：将复杂多变的情绪世界简化为有限的“基本颜色”，认为人类情感调色板上的这些原色都是共同的。

当然，Ekman 也注意到文化对情绪表达的影响。他引入了“表达规则”（Display Rules）概念，指出不同文化会对何时何地表达何种情绪有不同规范，即情绪表达受到文化调节。“原始表情冲动”是人类共有的；而文化决定了我们在特定场合是否压抑或夸大这种表情。基本情绪理论因此兼顾了先天与后天因素：情绪本身源自进化的生物程序，但表现形式可以被社会文化调整。

其他学者对基本情绪的清单有所扩展。Plutchik 在 1980 年提出八大基本情绪，并用“情绪轮”形式表现它们的关系和强度。Izard 提出了十种基本情绪，并强调这些情绪在进化过程中形成，每种基本情绪对应大脑一条相对简单的神经通路，不需要复杂认知参与。

![5-wheel](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-wheel.png)

https://psychcentral.com/health/emotion-wheel

不同理论者对于基本情绪的具体清单略有差异，但都认同存在数量有限的“原色”情绪。

![6-emotionTheory](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/6-emotionTheory.png)

https://www.frontiersin.org/journals/neuroscience/articles/10.3389/fnins.2019.00628/full

到 20 世纪末，基本情绪理论已成为情绪科学中的主流观点。许多研究者投入寻找每种基本情绪对应的大脑区域和生理指标，希望为情绪的“生物指纹”假设找到证据。[2002 年的一项研究综合了 140 多项研究进行元分析](https://psycnet.apa.org/fulltext/2002-00947-001.html)，检验情绪识别的普遍性与文化特异性，发现跨文化识别准确率显著高于随机水平，平均为 58%。具体情绪中，快乐（79.1%）识别最准，恐惧（57.5%）和 contempt（43.2%）较低。

基本情绪理论似乎正在主导情绪研究。然而，就在很多人以为情绪谜题将要揭晓之际，另一股质疑的声音逐渐壮大：情绪真的像基本颜色那样固定有限、与生俱来吗？还是说，大脑其实是在即时“调制”甚至“创造”情绪？

## Side-B: 情绪并非天成—情绪建构论的挑战

1980 年代，心理学家 James A. Russell 提出情绪维度模型，认为情绪不是离散的，而是分布在连续维度上的状态。他用“愉快-不愉快”（愉悦度）和“激动-平静”（唤醒度）两个维度构建了一个**情感圆环图**，将各种情绪按照愉悦度和唤醒度的程度标在圆周上。

![7-circumplexModel](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/7-circumplexModel.png)

https://psu.pb.unizin.org/psych425/chapter/circumplex-models/

在 Russell 看来，人的情绪状态可以用这两个维度来描述，例如“愤怒”对应高唤醒-低愉悦，“沮丧”对应低唤醒-低愉悦，“兴奋”是高唤醒-高愉悦，“平静”则是低唤醒-高愉悦。这意味着不同情绪并非泾渭分明，而是连续变化的，它们可能只是同一情感空间中不同区域的感受。

- 核心情感（core affect）：基础情感状态，由生理唤醒程度和愉悦不愉悦感组成，持续在体内起伏。
- 具体“情绪”：如愤怒、恐惧等，是在核心情感的基础上，加上**对情境的认知解释和文化概念之后形成的二次产物**。

这一思想与心理构建论一脉相承：情绪是由更基本的心理成分（生理唤醒、认知判断、文化概念）建构而成的。

Barrett 是这一思路的新一代掌门人。她对基本情绪论的质疑源自于自己的研究：实验对象无法区分抑郁和焦虑这两种情绪，她在多年里重复同样实验多次，均告失败。（抑郁：未达成个人理想，对任何事情都提不起兴趣，浑身没劲；焦虑：未满足他人期望，总担心有不好的事情发生，紧张易怒）

之后她开始对情绪领域提出尖锐的问题：如果愤怒、恐惧真的有特定的生理指纹，为什么这么多心理生理学研究**找不到稳定的证据**？为什么扫描成百上千人的大脑，找不到一个“一按就怒、一按就喜”的神经按钮，而总是发现多种情绪共享复杂的脑区网络？为什么不同文化有截然不同的情绪词汇和表达方式，有的语言里存在某种独特情感（例如德语的“幸灾乐祸”表示“因他人不幸而感到的秘密开心”，日语的“物の哀れ”表示“一种对无常之美的怅然”），而另一种语言里却找不到对应概念？婴儿出生时并不区分愤怒、害怕或悲伤，只是表现出一般的不适或舒适，随着成长才在教导下学会用不同情绪词描述感受——这又说明了什么？

Barrett 提出了**情绪建构理论**：情绪并非进化硬编码的固定模块，而是大脑在每一刻**主动构建的体验。大脑根据过去的经验和所学到的情绪概念，对当前的内部感受和外部环境进行预测和归类，从而赋予某种主观意义**，这个过程产生了我们所体验到的“情绪”。

这一理论试图解决一个“情绪悖论”：一方面，人们日常感觉情绪种类分明，“愤怒就是愤怒”“悲伤就是悲伤”；但生理测量和脑科学研究，却没能发现每种“离散情绪”有恒定统一的生物特征。Barrett 指出，可能并不存在与日常情绪词对应的先天情绪“模块”。相反，大脑更底层存在的是核心感受（affect）——它无形且连续。

比如你此刻可能只是觉得“舒服放松”或“不安紧张”，这是一种介于愉快/不愉快、高唤醒/低唤醒坐标轴上的连续状态。而当我们**赋予这种核心感受一个特定的概念标签，并结合情境加以解释时，才“建构”出某个具体情绪**如“平静”或“焦虑”。

Barrett 将情绪建构过程比喻为**颜色的感知**。物理世界中颜色的本质是连续光谱的不同波长，但人类大脑将连续的光谱划分为离散的颜色类别。同样，情绪的生理基础也是光谱式，而大脑借助文化赋予的**情绪概念**，把这些连续的内在感觉切割成离散的类别（愤怒/恐惧/喜悦等）。在她看来，“愤怒”并不是大脑里某个固定程序跑出来的，而更像是大脑对当前身心状态的一种**分类标签**。不同的人、不同文化对于类似的核心感受可能贴上不同标签，这就解释了情绪的文化差异。

为了证明情绪是被建构的，Barrett 和团队进行了多方面的研究。例如，考察**面部表情与情绪的对应关系**，发现离开情境单看一张愤怒或高兴的脸，有时会产生误判。下面这张照片，你看到了什么样的情绪？

![9-wlms-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/9-wlms-s.png)

.

这是一张网球明星威廉姆斯比赛胜利瞬间的面部特写：如果只看她的脸，许多人会以为她在“愤怒咆哮”或“痛苦嚎叫”，但实际上她是在**欢呼胜利**。

![9-wlms-l](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/9-wlms-l.png)

**离开情境，我们很容易误读情绪信号，这说明面部动作和情绪状态并非一一对应。**

在另一项对非洲纳米比亚的欣巴族的实验中，对比他们和西方人对某些情绪声音的辨识。结果发现，欣巴族人分不清“害怕”的吸气声和“惊讶”的吸气声。这说明对声音等情绪线索的理解，也需要文化和情境来辅助。

Barrett 据此批评传统基本情绪研究的方法：让受试者在几张表情照片里选标签，即使正确率高，也不能证明那些表情信号是先天的——因为**人们仍可能根据情境线索和学习经验来判断**。情绪也是一种*社会现实*。情绪概念是我们集体编织出的分类体系的一部分，而不是纯粹自然存在的实体。

Barrett 也持续寻找[神经科学的证据](https://psycnet.apa.org/record/2018-04155-001)。[她和合作者汇总了上百项脑成像研究](https://journals.sagepub.com/doi/abs/10.1177/1529100619832930)，发现**没有任何单一区域只在某一种情绪时激活**，相反，每种情绪体验都涉及多个分布式的脑网络的协同作用。例如，“恐惧”并没有“恐惧中心”，而是由涉及记忆、注意、内感受、意义赋予等多个网络共同产生。**大脑更像一个预测机器，不断利用以往经验来猜测当前感觉的含义**。当身体产生某些变化（如心跳加快、出汗），大脑会结合情境做出预测：“这种感觉意味着什么？是因为我跑步所以心跳快，还是因为我刚才看到的是一条蛇所以心跳快？”如果环境线索和过往经验指向危险，大脑就“构建”出**恐惧**的情绪体验；如果指向愉快激动的场景，那么则可能被标记为**兴奋**而非恐惧。总之，**情绪是大脑对感觉赋予的情境化意义**。

2017 年，Barrett 出版科普书籍《How Emotions Are Made》，系统阐述了情绪建构论。

&gt; “在每个清醒时刻，你的大脑都会根据过往的体验形成概念，从而指导你的行动，赋予你的感觉以意义。当涉及的概念是情绪概念时，你的大脑就会构建情绪的实例。”

她的观点无疑具有颠覆性：在人们习惯了将喜怒哀乐视作“与生俱来的自然产物”时，她却宣称那些情绪是习得的、是大脑的预测结果。这种大胆主张在科学界和媒体上都引来了支持和质疑的声音。一些学者认为 Barrett 过于否定生物因素，而另一些人则赞赏她为情绪研究注入新视角，认为**大脑的主动构建**观点可以更好地解释许多基本理论解释不了的现象。

![](https://img9.doubanio.com/view/subject/l/public/s31459215.jpg)

更学术的探讨，可以看 2023 年 Barrett 做客 Huberman Lab，在 2 个多小时的节目中，深入解释情绪的本质，以及大脑如何表征和整合来自身体和环境的信号，从而形成我们独特的情绪状态。https://www.youtube.com/watch?v=FeRgqJVALMQ

## 论战：天生抑或造就？

随着 Barrett 理论影响力增大，情绪科学领域出现了对峙局面：以 Ekman 为代表的“基本情绪派”和以 Barrett 为代表的“情绪建构派”之间展开了激烈的学术论战。这场论战从象牙塔里出圈，通过媒体和公开演讲传递给大众。2014 年《纽约时报》刊登了 Barrett 的一篇文章 “[**What Faces Can’t Tell Us**](https://www.nytimes.com/2014/03/02/opinion/sunday/what-faces-cant-tell-us.html)”。她在文中质疑面部表情的普遍性证据，引起了 Ekman 等人的强烈回应。Ekman 联手同事撰文反驳 Barrett，标题为 “[**Are Facial Expressions Universal?**](https://greatergood.berkeley.edu/article/item/are_facial_expressions_universal?locale=zh_CN)”。Ekman 列举数据指出，那些使用固定照片让不同文化的人贴标签的实验，在各地已复制约 200 次，结果支持基本表情在各文化中能被识别。此外，他们强调还有其他强有力的证据：

- **自发表情研究**：Ekman 团队早在 1970 年代就做过一项实验，让日本和美国受试者观看令人不安的影片，发现两国人在独处时自发流露的面部表情是一样的，但在有人旁观时表现不同（日本人压抑而美国人外露）。此后有 100 多项相关研究，结果支持不同文化的人在相似情境下会展现相同的基本表情模式，只是表达强度或频率可能受文化影响。
- **生理与脑成像证据**：有大量研究发现，当人们展现基本表情时，其自主神经系统反应和大脑活动模式存在差异。例如，愤怒的面部表情往往伴随特定的心率、激素变化，恐惧表情则对应不同的生理图谱。甚至人为摆出某种基本表情，也会引发相应的生理变化，比如心率上升或大脑相应区域的激活。这种“表情即生理”对应关系表明基本情绪确有其生物实在性，**情绪不只是主观概念**。

通过以上论据，基本情绪派力图证明：**虽然情绪体验复杂多样，但在生物层面，仍有可寻的共性模式**。他们认为进化赋予了人类基本的情绪潜能，而后天环境塑造了情绪的具体呈现。

情绪建构派则针锋相对地认为：**没有上下文的情绪是不存在的**。脱离了环境和认知，生理反应不过是噪音——只有当大脑根据情境将其解释为某种情绪时，它才获得意义。他们质疑那些据称找到情绪指纹的研究是否过于理想化，基本情绪论的三个基础都不成立：

- 面部表情：人们在不同文化、情境、个体间表达情绪的方式存在显著差异。相同的面部动作在不同情境中可能表达不同的情绪。因此不能将特定的面部表情与特定情绪简单地等同起来。
- 生理特征（ANS）：[对 202 项研究的原分析结果显示](https://journals.sagepub.com/doi/10.1177/0963721411422522)，即使是基本情绪也表现出生理反应的显著变异性，不能被特定情绪类别所标识。
- 大脑结构：[对人类情绪的神经影像学文献的元分析显示](https://www.cambridge.org/core/journals/behavioral-and-brain-sciences/article/brain-basis-of-emotion-a-metaanalytic-review/80F95F093305C76BA2C66BBA48D4BC8A)，情绪由更通用的大脑构建，情绪体验和感知涉及一组基础心理操作的大脑结构区域，在情绪性和非情绪性功能中均有活动，而不是某些特定情绪独有的大脑区域。

&gt; 情绪不是一种生理反应，而是大脑建构出来的一种概念。

大辩论的主要节点

| 年份       | 事件/著作                                           | 代表人物         | 内容与论争                            |
| ---------- | --------------------------------------------------- | ---------------- | ------------------------------------- |
| 1971-1980s | 跨文化面部表情实验、FACS 建立                       | Paul Ekman       | 提出并推广“基本情绪”理论              |
| 1994       | 情绪的环状模型 （Circumplex Model）                 | James Russell    | 挑战基本情绪分类                      |
| 2006       | 《Are emotions natural kinds?》                     | Lisa Barrett     | 批评基本情绪论，提出建构性假说        |
| 2011-2014  | 《The theory of constructed emotion》等多篇综述论文 | Lisa Barrett     | 系统阐述情绪建构论                    |
| 2012       | 《Emotion Review》上关于基本情绪理论的系列讨论      | Paul Ekman 等    | 坚持基本情绪观，回应建构论挑战        |
| 2014       | 《How Emotions Are Made》                           | Lisa Barrett     | 面向大众普及情绪建构论                |
| 2015-2022  | 大数据、AI 与神经影像新证据                         | Barrett/Ekman 等 | 双方用新工具新数据论证己方观点        |
| 2020s      | AI 领域情绪标签/建模争议                            | 工程&amp;学术界      | 基本情绪标签 vs. 建构性泛化的工程选择 |

激烈争论之中，一些整合思路也在形成。很多情绪研究者同时认可情绪的普遍生物基础和复杂建构性质。他们同意人脸并非情绪的唯一读本，仅靠皱眉不一定就能断定对方生气；情绪涉及面部、声音、姿态、生理等多重通道的综合信息，但这并不等于情绪毫无客观基础。

有学者指出，其实两派在很多方面并非绝对对立。例如，基本情绪派也承认情绪包含认知评估和学习，建构派也不否认人类有共同的核心感受和进化基础。区别主要在于：**基本情绪论更强调先天分类和生物划分**，而**建构论更强调后天学习和连续谱系**。或许未来的理论将融合两者：情绪既有自然的一面，也有社会建构的一面。

实际上情绪可能是多种因素的簇集，每种情绪都有典型的“成分配置”。例如，“愤怒”通常包含提高的心率、瞪眼、大声斥责等成分，但其中任何一个单拿出来，也可能出现在别的情绪或状态中（心率高也可能是兴奋，瞪眼也可能是惊讶）。情绪科学的发展前沿，正在尝试解析这些**情绪成分的组合模式**，寻找情绪在大脑和身体中的复杂图谱。

## 更多视角：超越两分法的情绪理论

除了上述两大流派，情绪科学中还有其他理论视角，提供了不同角度来审视情绪这一复杂现象：

| 理论流派/视角             | 核心主张与观点                                                   | 特征与亮点                                                               | 代表学者或理论                    |
| ------------------------- | ---------------------------------------------------------------- | ------------------------------------------------------------------------ | --------------------------------- |
| **心理构建论/社会建构论** | 情绪主要由文化与社会环境塑造，情绪的定义和体验受社会习俗影响巨大 | 强调语言、文化习俗在情绪体验与表达中的决定性作用，情绪是文化“剧本”的体现 | James Averill 等                  |
| **情绪维度模型**          | 情绪位于连续的维度（愉悦度与唤醒度等）上，而非离散的类别         | 强调情绪状态的连续性，能更好解释复合或混合情绪                           | James A. Russell 等               |
| **认知评估理论**          | 情绪来自个体对环境和事件意义的主观认知评估                       | 强调认知因素在情绪体验中的核心作用，通过改变认知可有效调节情绪           | Richard Lazarus 等                |
| **社会功能理论**          | 情绪进化的功能是为了帮助个体适应社会环境，协调群体关系和互动     | 情绪具备社会交际和群体协调的功能，聚焦情绪如何维持和增强社会关系         | Dacher Keltner、Jonathan Haidt 等 |
| **身体反馈理论**          | 情绪体验依赖身体的生理变化，身体反应先于情绪的主观体验           | 强调身体生理反馈在情绪体验形成中的核心作用，生理状态引导情绪感受         | James-Lange theory 现代版本       |
| **行为生态学理论**        | 面部表情等外在表现主要作为社会交际信号，而非直接代表情绪状态     | 强调情绪表达的社会信号功能，而非单纯的情绪反映                           | Alan Fridlund 等                  |
| **进化博弈理论**          | 情绪在进化过程中通过博弈策略来优化个体和群体适应性               | 从演化稳定策略角度解释情绪如何促进个体间互动和群体合作                   | Robert Frank 等                   |

## 走向情绪科学的新篇章

&gt; GPT 的诗意总结

回顾 20 世纪以来情绪科学的发展，仿佛能看到两股暗流：一股致力于证明情绪的**普适与本能**，一股致力于揭示情绪的**多样与塑造**。Ekman 让我们相信，茫茫人海中笑容和泪水可以跨越文化被彼此读懂，那是进化赐予我们人类的共同语言。而 Barrett 则提醒我们，每个人的情绪又是如此独特精细，像一幅幅由经验绘制的肖像画，我们的大脑就是那个画师，借助文化的颜料在核心感受的底板上勾勒出愤怒或快乐的模样。

如今，这两种视角的争鸣激发出更多创新的研究。科学家们正借助更大规模的脑成像、人工智能数据分析等技术，试图绘制情绪的全景地图。或许最终我们会发现，情绪既不像简单的“基本色板”那样只有几种，也不是毫无规律的“随机涂鸦”。它可能更像一座调色盘——有少数底色，也经由混合生成万千色彩。

![8-insideout2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/8-insideout2.jpg)

当我们看到他人脸上的笑容或愤怒，不妨既相信其中有人类共通的真情实感，也体谅那表情背后可能有不同的故事脉络。情绪既是人与人相连的纽带，也是个人经历的独特印记。带着这样的理解去体会情绪，也许能让我们对自己和他人的情感世界都有更深的共情和洞察。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[论文解读：通往自主机器智能的道路]]></title>
            <link>https://tophci.com/posts/250812-world-model-yann-lecun</link>
            <guid isPermaLink="true">https://tophci.com/posts/250812-world-model-yann-lecun</guid>
            <category><![CDATA[Intelligence]]></category>
            <category><![CDATA[World Model]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 11 Aug 2025 16:00:00 GMT</pubDate>
            <content:encoded>
## **AGI 的三条技术路线**

![wm1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm1.png)

| **信息模型/语言智能** | 大数据+自监督学习+大算力形成的信息类(语言/图像/语音)模型 |
| --------------------- | -------------------------------------------------------- |
| **具身模型/空间智能** | 基于虚拟或真实世界，通过强化学习训练出来的具身模型       |
| **神经模拟/生物智能** | 模仿自然进化，复制数字版本的人脑和智能体，即脑智能       |

信息模型的能力在 scaling law 下继续增强，但是学界、业界、消费者对模型的感知、决策和行动能力的期待水涨船高，具身模型的关注度也越来越高。

空间智能：能够对世界进行建模，根据 3D 时空中物体/地点/交互进行推理。李飞飞去年成立的 World Labs 目标是打造「大世界模型」，让 AI 在 3D 世界中感知、生成、互动。

![wm2-worldlabs](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-worldlabs.png)

&gt; 如果想让 AI 超越当前的能力，我们需要的不仅是能够看到、会说话的 AI，而是一个可以行动的 AI。
&gt; 视觉化为洞察，看见成为理解，理解导致行动。

```
放飞一下

- 信息模型：语言是对物理世界的压缩
- 具身模型：物理现实是对进化的切片
- 神经模拟：从第一性原理出发，模拟 god 用万亿年演化出的低成本的熵减的智能体

（00 的暴论：现在 AI 的瓶颈是能耗过大，还在熵增阶段而没有实现熵减）
```

## 具身路线之 Yann LeCun 视角

作为目前的非共识，Yann LeCun 主张发展**目标驱动**的人工智能，这种系统不仅能够识别模式，还能理解因果关系，进行有效的推理和规划。他近年一直力推世界模型，即一种世界的“模拟器（simulator）”，用于估计感知中缺失的信息以及预测世界的未来状态。

![wm2-yannlecun](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-yannlecun.png)

对比主流的机器学习系统，人类和动物能通过观察和少量互动，以无监督的方式学习大量世界知识，这些知识构成常识，使动物能学习新技能、预测行动结果、推理、规划并避免错误和危险。

| **机器学习系统**                         | **人/动物**                                                                 |
| ---------------------------------------- | --------------------------------------------------------------------------- |
| 专门化的，会犯低级错误，推理和计划能力弱 | 可以非常快地学习新知识，理解世界如何运行，可以推理和计划——拥有 common sense |
| 在输入输出之间需要经过恒定的计算步骤     | 可以预测行动的结果，可以无限链式推导，可以分解复杂任务为一系列子任务        |

动物和人类的学习能力及对世界的理解，远超当前的机器学习系统，AI 研究需应对三个挑战：

1. 机器如何通过观察学习世界知识
2. 如何进行基于梯度的推理和规划
3. 如何在多个抽象层级和多种时间尺度上表示感知和计划行动

```
Yann 的一些大胆设想：

- 预测是智能的本质，学习对世界的预测就是常识的来源，推理是模拟/预测和规划的一种延伸;
- 几乎所有智能都是自监督学习，而非强化学习、监督学习或模仿;
- 情绪对自主智能不可或缺;

🤯 我们应该放弃生成式模型、强化学习、概率方法，寻找一条更好的智能实现路径.
```

通过设计学习范式和架构，让机器以无监督/自监督的方式学习世界模型并进行预测、推理和规划，是 AI 和 ML 的主要挑战之一，其中一个关键问题是**如何设计可训练的世界模型，来处理预测中复杂的不确定性**。

## 世界模型架构设想

关于世界模型的介绍请移步：[什么是 World Model 世界模型](https://www.tophci.com/posts/250803-world-model-intro)？

### 自主智能的系统架构

Yann LeCun 2022 年提出一个实现自主智能的架构，包括感知、世界模型、执行器、评判器、成本、短期记忆和配置器等模块。

![world-model-arch](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/world-model-arch.jpg)

模型中的所有模块都假定是可微分的，使梯度可以通过其他模块反向传播，然后更新行动序列，最后收敛到最优行动序列。

**目标驱动**的 AI：找到最接近目标的动作序列

![wm2-paperimg1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg1.png)

### **感知-行动循环**

**模式 1（直接反应）**

直接根据感知和短期记忆产生行动，不涉及复杂推理；

![wm2-paperimg2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg2.png)

**模式 2（推理和规划）**

通过世界模型和成本进行推理和规划，类似于模型预测控制（MPC）。

![wm2-paperimg3](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg3.png)

Action 可以看作潜在变量，代表从一个状态到下一个状态的抽象转换。这种通过模拟和优化进行的规划，可能构成自然智能中最常见的推理。推理可看作是**能量最小化**的过程，许多经典推理形式可被表述为优化问题。

从模式 2 到模式 1，可以视为**学习新技能**的过程：模式 2 可训练模式 1 中的策略模块，使其能直接产生 action。策略模块可以看作是行动的一种摊销推理，让智能体利用世界模型和推理能力来获得新的技能，然后将这些技能“编译”成不再需要仔细计划的反应式策略模块。

### **成本模块驱动行为**

成本模块决定了智能体的行为本质。可通过四种方式指定：

- 显式编程：在满足特定条件时激活的特定行为
- 定义目标函数：使智能体执行所需的行为，从而找到最小化目标的动作序列
- 监督训练：训练智能体以某种方式行事。智能体观察专家教师的行为，并训练一个模式 1 策略模块来重现它。
- 模仿学习：通过模仿学习训练。智能体观察专家教师，并推断出一个目标函数（行为不断优化）。这为模式 2 行为产生了一个评判器子模块。这个过程有时被称为逆强化学习。

**训练评判器**

评判器使用短期记忆模块，通过检索过去状态和内在能量/能耗，来训练自己预测未来的内在能量/能耗，其参数可通过优化预测 cost 来调整。

![wm2-paperimg4](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg4.png)

在 planning 期间，内在成本模块将三元组（时间，状态，内在能量）: $$(τ, s_τ, IC(s_τ))$$ 存储到短期记忆中。

- 在评判器训练时，检索过去的状态向量 $$s_τ$$，以及稍后时间 IC 的内在能量 $$(s_τ+δ)$$。
- 在最简单的场景中，评判器调整参数，以最小化目标 $$IC(s*{tau+δ})$$ 和预测能量 $$C(s*τ)$$ 之间的发散度量。
- 在更复杂的方案中，它可能使用未来内在能量的组合作为目标。

### 训练世界模型

&gt; 世界模型的设计架构和训练范式，是十年来人工智能真正进步的主要障碍。

世界模型的主要目的是**预测世界状态的未来表示**。有三个问题需要解决：

| **多样性** | 世界模型的质量，很大程度上取决于它在训练时能够观察到的状态序列或三元组（状态、动作、结果状态）的多样性。                                                                                                                                                                                                                 |
| ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **可能性** | 因为世界并非完全可预测，在给定的世界状态和智能体的动作之后，可能会有多个合理的世界状态表示。世界模型必须能够有意义地表示这个无限的合理预测集合。                                                                                                                                                                         |
| **层级**   | 世界模型必须能够在不同的时间尺度和不同的抽象级别进行预测。这与长期预测和规划有关。 &lt;br /&gt; - 人类在抽象水平上规划复杂的目标，并使用对世界状态和行动的高级描述来进行预测。 &lt;br /&gt; - 然后，高级目标被分解为子目标序列，使用来自世界模型的较短期预测来产生较低级别的行动。 &lt;br /&gt; - 这种分解过程一直重复到毫秒级的肌肉控制。 |

如何解决以上问题？

- **自监督学习**：训练系统去判断输入的不同部分是否一致。
  - 在视频预测场景中，通过学习关于世界如何运作的抽象概念层次结构，可使系统提取图像中的局部边缘和轮廓、识别深度图、物体的隐含表示、直观物理概念等。
- **潜在变量**：使用潜在变量来表示关于 y 的信息（无法从 x 中提取），以处理世界的不可预测性。
  - 通过最小化潜在变量的信息来避免模型崩溃，例如使潜在变量离散、低维、稀疏或具有噪声等。
- **世界模型架构**：世界模型的架构细节应根据环境类型确定，见下文。
  - 可能包括门控或动态路由机制，例如在处理视频时，低层次预测可通过提取局部特征向量和位移来实现，高层次预测可使用 Transformer 架构来建模对象及其交互。
- **跟踪世界状态**：传统深度学习架构通过向量或多维数组传递状态的效率低下，建议使用内存模块来维护世界状态，通过 query-value 对来修改或添加世界状态记忆的条目，所有操作应是可微分的，以便反向传播梯度。
- **数据流**：智能体可通过五种信息收集模式学习世界知识：被动观察、主动注视(active foveation)、被动代理、主动自我运动(active egomotion)和主动代理。训练世界模型可能需要**更主动的信息收集**，关键问题是确定通过被动观察、自我运动和完全代理能学到多少。

### 生成式架构 vs 联合嵌入预测架构

&gt; 世界模型能否采用生成式架构？
&gt; 类似 GPT 的自监督训练文本的方法是否可以移植到视频上？

假设：拍一段视频 y，遮盖其中一部分，表示为 x，然后训练神经网络来预测缺失的视频部分。如果系统能预测视频中将要发生的事情，那么它可能对物理世界的底层本质有很好的认识。

![wm2-paperimg5](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg5.png)

神经科学家很长时间以来一直在思考这类问题——即预测编码。但是它不可行。LeCun 和同事尝试了 10 年，没有得到良好的预测。原因是它无法真正预测将要发生的事情，而是预测所有可能发生的事情的平均值——得到的是一个非常模糊的视频。

**解决方法是放弃生成模型而采用 JEPA（Joint Embedding Predictive Architecture 联合嵌入预测架构）。**

![wm2-paperimg6](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg6.png)

```
联合嵌入预测架构（JEPA）：通过编码器和预测器在表示空间中进行预测，能够处理输入与输出间的多模态依赖关系。
- 主要优点：y 的编码器可以在表示空间中生成抽象表示来执行预测，避免预测那些不相关的细节。
- 层次化 JEPA（H-JEPA）：通过非对比方法训练的 JEPA 能够学习抽象的世界模型。H-JEPA 能够提取不同层次的抽象表示，进行多时间尺度的预测，对于智能行为至关重要，可将复杂任务分解为更详细的子任务。
- 层次化规划：若世界模型能进行层次化预测，可用于层次化推理和规划。挑战包括如何预定义中间动作词汇，以及如何在不确定性环境中进行规划。在不确定环境中，可通过具有潜在变量的预测器来处理不确定性，通过采样潜在变量生成不同预测，并使用定向搜索和修剪策略来优化行动序列。
```

```
训练基于能量的模型（EBM）：不使用传统的概率模型，而采用适合处理不确定性的非标准化概率模型——基于能量的模型，捕捉 X 和 Y 之间的依赖关系。构建计算能量函数的架构和设计合适的损失函数，使训练样本能量低而其他样本能量较高。
- 对比方法：通过推动训练样本能量下降和对比样本能量上升来训练，但可能受维度诅咒影响；
- 正则化方法：通过最小化低能量区域的体积来训练，更有希望避免维度诅咒。
```

![wm2-paperimg7](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/wm2-paperimg7.png)

**做预测的大问题是：什么是适当的信息和适当的抽象层次？**因为不是所有的细节都需要预测。

层次化：高层级的动作，可作为相应低层级的目标。对动作序列的规划正是现有架构所缺少的。

```
😮 Yann LeCun 的建议：

- 放弃生成模型，转而使用联合嵌入架构；
- 放弃概率建模，转而使用基于能量的模型；
- 放弃对比方法，转而使用正则化方法；
- 放弃强化学习，转而使用 model-predictive control，仅在规划无法预测正确结果时使用 RL 来调整世界模型。
```

## Intrinsic Cost：第一性问题？

论文中对 Intrinsic Cost 的描述：

&gt; 内在成本模块是硬连线的（不可变，不可训练），测量智能体瞬时“不适”的内在能量——类比疼痛（高内在能量），快乐（低或负内在能量），饥饿等。
&gt;
&gt; The Intrinsic Cost module is hard-wired (immutable, non trainable) and computes a single scalar, the intrinsic energy that measures the instantaneous “discomfort” of the agent – think pain (high intrinsic energy), pleasure (low or negative intrinsic energy), hunger, etc.

IC 模块的输入是感知模块产生的世界当前状态，或世界模型预测的潜在未来状态。

```
智能体的最终目标是在长期最小化内在成本。
```

这是基本的行为驱动力和内在动机。基本驱动力可以 hard code。成本模块可以由配置器调制，以在不同时间驱动不同行为。

那么问题来了，**内在成本模块与 AI 的可控性和对齐需求形成对立**。

- 如果 AI 目标是避免饥饿（检查充电状态），认为人类可能不想对其充电，则 AI 将被激励以获得电力并控制其情况以消除潜在危险。
- 如果 AI 有避免疼痛的动机，认为人类可能会让它经历疼痛，或者无法/不愿意帮助它避免可能的疼痛，那么会有动力获得权力以消除潜在的问题。
- 如果 AI 出于好奇心，认为人可能无法提供足够有趣的事情，那么会被激励去获得权力和控制处境，就可以在不征求任何人许可的情况下满足好奇心。

**情绪和智能**

- 动物和人类情绪的基础是什么？瞬时情绪（例如疼痛、愉悦、饥饿等）可以是大脑结构的结果，起到与内在成本模块类似的作用。其他情绪，如恐惧或焦虑，可能是大脑结构*预期结果的*结果，其功能类似于可训练的评判器。
- 成本模块通过搜索最优行为来驱动代理的行为，表明这类自治智能体将拥有**情绪的等价物**。就像动物和人类一样，机器情绪也是内在成本的产物，或者是一个可训练的评判器对结果的预期。

那么，究竟应该在内在成本模块中放入什么代码，才能让 AI 具备符合人类利益的动机？

## Ref

- A Path Towards Autonomous Machine Intelligence: *https://openreview.net/pdf?id=BZ5a1r-kVsf*

- Yann Lecun | Objective-Driven AI: Towards AI systems that can learn, remember, reason, and plan: *https://www.youtube.com/watch?v=MiqLoAZFRSE*

- Yann LeCun - A Path Towards Autonomous Machine Intelligence: *https://www.youtube.com/watch?v=OKkEdTchsiE*
</content:encoded>
        </item>
        <item>
            <title><![CDATA[什么是 World Model 世界模型？]]></title>
            <link>https://tophci.com/posts/250803-world-model-intro</link>
            <guid isPermaLink="true">https://tophci.com/posts/250803-world-model-intro</guid>
            <category><![CDATA[Intelligence]]></category>
            <category><![CDATA[World Model]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 02 Aug 2025 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; LLM 是否能与现实世界直接交互？人工智能和人类智能的关键区别是什么？如何设计可训练的模型来**处理预测中的复杂和不确定性**？

世界模型可以让知识在任务间共享，实现类比推理，获得**基于现实情境和事实的推理能力**。这是一种人类天然具备，而 AI 还很薄弱的能力。

&gt;

## LLM 是否能够理解世界？

大语言模型究竟对世界有多少理解？这个问题引发了两极化的争论。

**🙅🏻‍♀️ 不理解**

- 对 AI 系统的常见质疑：AI 并不具备真正的“理解”能力。比如中文屋问题：一个符号系统虽然能够输出中文，却对中文没有任何理解（即 the [Symbol Grounding problem](https://en.wikipedia.org/wiki/Symbol_grounding_problem)）。
- 认为 AI 没有理解能力的学者预言，只接受语言训练的机器，“[即便从现在开始一直训练到宇宙热寂](https://www.noemamag.com/ai-and-the-limits-of-language/)”，也永远无法媲美人类智能。
- 这一阵营也不认同“理解即正确预测”。即便我们理解了一个事物，也可能由于缺少观察、思考不充分等导致错误预测。尽管 DL 中神经网络的输出过程常常被称为“预测”，但一般语境下的预测带有时间属性，有些关系并非预测关系。

&gt; LLMs have no knowledge of the underlying reality.——Yann LeCun

**🙋🏻‍♀️ 理解**

- LLM 的能力并非源于对语言含义的领悟，而来自于学习训练数据中词语之间复杂的统计模式。
- 如果将各种不同的表示都统一转换为概念化表示，那么“理解”≈ 建立起概念与其他概念之间的联系。“错误的理解”仍然是一种“理解”：神经网络产生了与人类不同的“理解”。
- 大模型在接受了海量数据的训练后，似乎已经掌握了世界和人类社会的一些基本知识。有没有可能这 LLM 形成了自己对“语言环境”的理解，但和人对世界的理解不同。

&gt; 当训练一个大型神经网络来准确预测许多不同文本中的下一个单词时……它正在学习一个世界模型……这个文本实际上是世界的投影……神经网络正在学习的是世界、人、人类状况、希望、梦想和动机的越来越多的方面……神经网络学习了一种压缩的、抽象的表示。 ——Ilya Sutskever

## AI 的心理模型？

目前看来，LLM 的[幻觉](https://spectrum.ieee.org/ai-hallucination)问题及其[易受攻击](https://llm-attacks.org/)的特点表明，AI 系统似乎缺乏人类智能的一个关键部分：基于真实世界的模型（人的数据结构，吃一堑的基础），包括理解用户请求背后的意图。

认知科学认为人不是简单的条件反射机器，我们的头脑中有物理和社会世界的抽象模型，这些模型反映了事件的因果，而不仅是相关性。

人们依靠这些**心理模型**来模拟和预测可能行动的可能结果，在不熟悉的情况下推理和计划、想象反事实，并在经验的基础上更新知识和信念。

&gt; 我们头脑中对周围世界的印象只是一个模型。没有人在他的脑海中想象整个世界、政府或国家。他只选择了概念，以及它们之间的关系，并以此来代表真实的系统。
&gt;
&gt; ——系统动力学之父 Jay Wright Forrester 对心理模型描述

AI 的心理模型是什么？如何让 AI 能够像人类一样能真正规划？具身理论认为，可以参考人类和动物是如何快速学习的——通过观察和体验世界。

获取“世界模型（World Model）”的问题是 AI 研究的焦点之一。研究人员已经尝试了许多方法，包括手动编程，或者让机器从数据或经验中学习。

- 最开始主要使用监督学习，这需要很多标签。
- 强化学习效果很好，但需要大量的试验才能学到东西（吃上万次的亏）。
- 自监督学习又过于专门化，容易犯错，而不会真正推理或计划，只是快速反应。

## 什么是 World Model？

World model 早期的经典论文《[Recurrent World Models Facilitate Policy Evolution](https://arxiv.org/abs/1803.10122)》中并没有给出定义，而是类比了认知科学中人脑的 mental model：

&gt; 人类发展了一个基于有限的感官去感知世界的心理模型。我们所做的决定和行动都是基于这种内部模型。

论文提出的智能体模型包含三个组件：

- **视觉感知组件 V**：可以将它所看到的画面压缩成一小段代码表示。
- **记忆组件 M**：可以根据历史信息预测未来的代码。
- **控制器 C**：决策组件，它根据视觉和记忆组件的表示来决定采取什么行动。

![](https://worldmodels.github.io/assets/world_model_overview.svg)

World model 主要包含**状态表征**和**预测模型**，正好对应 mental model 中的 mental representations 和 mental simulation。

- 状态表征：环境提供高维观察作为输入，纵向 V-&gt;z 将每个输入帧压缩成抽象表示（低维特征向量）
- 预测模型：水平的 M-&gt;h-&gt;M-&gt;h 是以序列方式预测下一个时刻的表征，用 RNN 实现。

V（视觉）、M（记忆） 和 C（控制器） 如何与环境交互：

![](https://worldmodels.github.io/assets/world_model_schematic.svg)

V 在每个时间处理原始观测值并生成 $$z_t$$。C 的输入是这个潜向量 $$z_t$$与 M 的隐藏状态之间的连接 $$h_t$$。C 将输出一个动作向量 $$a_t$$ 用于控制。然后 M 将接收最新的 $$z_t$$和行动 $$a_t$$作为输入来更新 t+1 时的隐藏状态 $$h_{t+1}$$

V、M、C 对应具身智能研究中常见的三个模块：感知，记忆/预测/决策，执行/控制。

### 强化学习中的世界模型

强化学习使 AI 能够随着时间的推移改进其决策。强化学习算法可以分为

- 无模型（model-free）：通过大量与环境交互的试验，来了解哪些行为在不同情况下是成功的。
- 有模型（model-based）：这里的模型即 World model。在基于世界模型的强化学习中，智能体首先学习一个关于环境的内嵌模型，从中学习行为决策并用于规划，从而提高在真实环境中的表现。世界模型可以[从更少的交互中学习](https://ai.googleblog.com/2019/02/introducing-planet-deep-planning.html)，促进[离线数据的概括](https://arxiv.org/abs/2005.13239)，支持[前瞻性探索](https://arxiv.org/abs/1810.12162)，并允许[在多个任务中](https://bair.berkeley.edu/blog/2020/10/06/plan2explore/)重用知识。

对世界模型的两种可能理解：

- 对环境状态的唯一正确描述
- 关于环境的知识或信念（belief）

二者的区别在于，前者认为存在一个“客观”的描述，而后者中知识或信念是“主观”的。不同智能体对环境的认识几乎都不相同，差异主要来源于其感知运动接口以及个体经验。其实并不存在“唯一正确”的描述。神经网络的方法天然地符合第二种理解，即每个神经网络的**权重都是关于环境的“主观”知识**。

要适应环境，在其中学会完成任务、解决问题，智能体要习得环境的知识。困难在于对这些知识的具体组织方式——如何处理大量的来自环境的输入、如何组合与抽象、如何与既有知识建立联系和修正既有知识等等。

世界模型也可以称为预测动力学模型，对于决策十分重要，它的**核心任务是预测智能体特定的行动下，世界状态的变化，即尝试建模世界的状态转换函数。**如果能获得准确的 world model，就可以在其中反复试错，找到现实最优决策。

如何更好地建模世界模型？Yann LeCun 提出了一个比较完整的架构，我们下篇来介绍。

## Ref

- [World Models](https://worldmodels.github.io/)
- [AI’s challenge of understanding the world | Science](https://www.science.org/doi/10.1126/science.adm8175)
- [A Path Towards Autonomous Machine Intelligence](https://openreview.net/pdf?id=BZ5a1r-kVsf)
- [The first AI model based on Yann LeCun’s vision for more human-like AI](https://ai.meta.com/blog/yann-lecun-ai-model-i-jepa/)
- [Mastering Atari with Discrete World Models](https://research.google/blog/mastering-atari-with-discrete-world-models/)
- [什么是 world models/世界模型 - 知乎](https://zhuanlan.zhihu.com/p/661768957)
- [CONFERENCE JENSEN HUANG (NVIDIA) and ILYA SUTSKEVER (OPEN AI).AI TODAY AND VISION OF THE FUTURE](https://www.youtube.com/watch?v=ZZ0atq2yYJw&amp;t=1262s)
- [Do LLMs learn world models? (大语言模型学到了世界模型吗？) | Haonan&apos;s blog](https://www.haonanyu.blog/post/llm_world_model/)
- [World Model As Agent 是 AGI 的必经之路吗？*世界*模型\_预测](https://www.sohu.com/a/749968382_99985415)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[呓语：从人的局限理解智能的疆界]]></title>
            <link>https://tophci.com/posts/250721-desire-as-intelligence-boundary</link>
            <guid isPermaLink="true">https://tophci.com/posts/250721-desire-as-intelligence-boundary</guid>
            <category><![CDATA[Intelligence]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 20 Jul 2025 16:00:00 GMT</pubDate>
            <content:encoded>
翻出过去一些自问自答的呓语……

---

&gt; 人机交互的形式发生了什么变化？

过去几十年的人机交互，形式上是人使用计算机来做各种各样的事情，这些工具从一开始以硬件为主，到现在以运行在不同硬件/云上的软件为主，核心变成了**人-数字工具**的交互。

&gt; 人机交互的目的发生了什么变化？

人机交互的最终目的并不是使用工具，人使用工具是为了满足需求。

过去人与机交互的目的，很大程度上是在塑造数字世界。人使用计算机，产生了海量的数据、文本、多媒体，以及对现实世界的表示和标注。

但人的需求，不只是在数字世界，而是遍及三大世界——**物理世界、数字世界、精神世界**。当生成式 AI 带动数字世界发生一轮大的跃迁时，“机器“这种形态已经不能很好概括形式的目的。交互也将相应进化到新的阶段——人与智能交互，目的是使用智能来满足人在三大世界的需求，尤其是那些在过去还满足不好的需求。

&gt; 人的需求由哪些底层动力驱动？

人为什么有那么多的需求？柴米油盐，七情六欲，风花雪月。

因为生而为人，欲望和局限都太多了。我们只能存活几十年，空手只能够到 2 米多高，步行 1 小时不过几公里，只能看到约 400~760nm 波长的光，听见 20Hz ～ 20000Hz 的声音，临时记住约 4 个单位的信息……

在这些局限之中，最重要的有三个：时间，空间，注意力/认知加工能力。人的各种需求，总是指向突破这种种限制的努力。

- 时间：为了突破时间限制，我们追求永恒、延续、不死——数字世界，生命永存
- 空间：为了突破空间限制，我们开疆拓土，繁殖，扩散——物理世界，无远弗届
- 认知：为了突破认知限制，我们希望拥有更长的 Context、更大的 FLOPs——精神世界，万物合一

不论技术如何演进，人一定会尽可能利用工具，尤其是智能程度高的工具来突破三大限制，从而接近人类叙事中的神——灵魂不死，无处不在，包容万物。

### 数字世界

表面上看，AI 是人的工具，但人和 AI 在很长时间内是相互依存的关系，因为 AI 需要人产生的数据。

|          | **人** | **AI** |
| -------- | ------ | ------ |
| **需求** | 功能   | 数据   |
| **供给** | 数据   | 功能   |

如果对这种相互依存的关系，寻找一种更符合人的偏好的表达，应该是什么呢？

智能很大程度上是人在数字世界中孵化的。不论从主客体关系，还是可控性需求，又或是人对工具的态度，人在与智能交互时，比较理想的载体是助手。

**助手：人和 AI 在数字世界的中介**

助手不是 AI 本身，助手的“本职”工作不是生产，那是模型的工作。**助手的核心是“中介”，促进供需匹配**。

- Stage1 生成：LLM、LMM 让数字世界的内容供给趋于无限
- Stage2 转换：数字世界的内容形态可以任意转换
- Stage3 匹配：数字服务的流通，供需匹配效率，从信息分发到需求分发
  - 信息时代—信息找人：信息先被生产出来，然后订阅、推送
  - 智能时代—需求分发：需求先被捕捉，供给是即时分发和生成的。prompt 是一种需求模板

人类擅长用各种工具解决问题，但是解决问题不等于达成目标，更不等于满足欲望。这一轮的 AI 发展，似乎是一次掀翻潘多拉魔盒盖子的过程。当我们意识到 AI 可以直接交付结果，就不再有耐心探索怎样使用工具达成目标的路径，而是每天都在畅想（或是幻想）”如果……就好了“的场景，欲望演化的速度前所未见。

智能时代的人机交互，基于真实情境（物理/数字/精神）的需求（欲望）识别，是核心的挑战和机会。

&gt; 什么比信息找人价值更高？

- 问题找解决方案
- 供需匹配：需求找供给
- 时间扩展：（未来）机会识别，（未来）风险消除
- 空间扩展：生态位巩固

横向扩展：信息的上游是需求，信息的下游是知识和服务，去掉信息这个中间环节

纵向扩展：物理世界，精神世界（从下到上带宽越来越窄）

### 物理世界

&gt; 助手：人-物理世界的超频器

跟比特相比，原子变化慢。助手帮助实现在数字世界的模拟和演化，然后部署到物理世界。

### 精神世界

&gt; 助手：人-精神世界的镜映器

三维的人，在高维的空间中，始终照见的是自己。

### 智能时代的常态和机会

- 数字世界：供给过剩，需求不足，（时间不够用）时间限制被放大
- 物理世界：供给不足，需求过剩，（虚实预期差）空间限制被放大
- 精神世界：供给过剩，需求过剩，（注意力挤兑）精神问题被放大

智能就是人类欲望和局限通往三大世界的桥梁。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[表达欲，攻击性，冬去春来]]></title>
            <link>https://tophci.com/posts/250302-desire-to-express</link>
            <guid isPermaLink="true">https://tophci.com/posts/250302-desire-to-express</guid>
            <category><![CDATA[零反思]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 01 Mar 2025 16:00:00 GMT</pubDate>
            <content:encoded>
我已经失去表达欲好几年了。

几年前，结束了长达三年的自由生活，进入一个规矩很多、忙碌但死气沉沉的公司，开始接触一种陌生的体制，陌生的经营动力，尤其陌生的文化氛围——透着冰冷金属暗泽的巨型机器的那种不由分说。这一切让我感觉很不舒服，随之而来的是要跟自己的失望、恐惧和愤怒做斗争。抗争半年以后，我妥协了，失去力气，不想触碰什么关于创造、个性、身份认同这些奢侈的话题。

也许就是从那时候起，我的「攻击性」不再对外释放。从精神分析的角度来说，攻击性是生命力的一种表达方式。强调一下，这里的「攻击」不是指直接言语或行动攻击，更多是指一个人的意志和主张的主动表达，并且不因为与他人不一致甚至冲突而立即退让。

人与人的差异，会天然形成看不见的界限，从我的界限到你的界限，你我可能都会感受到一丝拉扯和对抗，以及涉入/被涉入边界时的张力，而攻击性会让我们承受住这些张力，尽可能地保留自己的想法、个性、主张。当一个人很坚定地以自己的方式表达时，ta 多少就是带有攻击性的。比如宅在房间里打游戏的青少年，不让别人进房间，不听父母的命令或请求，表面上可能一句话都不说，但这也是一种攻击性的表达，为了捍卫自己的边界，让真正膨胀开来的自我有容身之地。比较良性的攻击性，不是说话强势或者不顾他人感受，更多的是在属于自己的边界内「坚持自己」。当别人入侵本属于自己的边界时，不为所动，并且请 ta 出去。

我讨厌老是侵入他人边界的行为，很多时候，这些侵入形式都很微妙，可能只是一个眼神、一个老生常谈的提问、一个看似善意的想与你拉进关系的举动。理想情况下，人与人的边界应该由两个人共同划定。但现实中几乎不可能，不论是权力关系的不对等、个体分化程度的差异还是个人欲求和表达方式的不同，都很容易把边界挤得稀碎，更不要说边界本就是物理上隐形的，而且还超出语言的意会范围。

当人处于一个巨型机器（体制）内部时，机器运作的机制就会开始侵入个人的边界，它会以各种或蛮横或微妙的方式向你传达什么是正确的，什么是被允许的，什么是一文不值的。在工作中，当然要接受这些，但是工作和生活的界限到底在哪里，却很难说清楚。划定边界这件事，我学习了那么多年，却也还是笨拙。

一个人不能比较自然的做自己，总是要屈服于规矩，不能表达不满而且还要拥护，不要说攻击性了，连认知都长期失调，总得想办法糊涂麻痹过去。

被规训得久了，内在的恐惧开始滋生，于是表达欲逐渐消失，我不写文章了，不看那些「没有什么用」的书，逐渐地连音乐也很少听了，光影、涟漪、风吹过树梢的沙沙声，成为了奢侈而又隐秘的救赎般的安慰剂。

去年换了工作，也依然疲于追赶 AI，在自我异化的路上给自己添胡（萝卜）加（大）棒。

直到最近，直到这个春天的开始，好像有一些不一样。

AI 继续加速，而我却好像可以在某些时候慢下来，把路上通勤的播客和听书换成音乐，陪猫主子的时候心无旁骛，脑子里又开始有属于自己的想法冒出来，发一些头脑发热时的碎碎念。有一些东西开始变得没那么重要，而有一些曾经熟悉的东西好像又重新进入了视野。

猛的回看，原来连写出自己心中所想的本能都已经那么陌生，原来我的某些部分已经沉睡四五年。

原来春天真的来了。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[[论文笔记] Titans: Google 新推的记忆架构]]></title>
            <link>https://tophci.com/posts/250218-paper-google-titans</link>
            <guid isPermaLink="true">https://tophci.com/posts/250218-paper-google-titans</guid>
            <category><![CDATA[paper]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 18 Feb 2025 00:00:00 GMT</pubDate>
            <content:encoded>
[arXiv](https://arxiv.org/abs/2501.00663v1)

&gt; **短期记忆（注意力机制）+长期记忆（神经记忆模块）**

主要贡献：

- 提出了一个新的神经长期记忆模块，可以学习记住历史上下文并帮助注意力机制利用长期信息
- 设计了三种不同的架构变体来整合记忆模块
- 在多个任务上的实验表明该模型比传统 Transformer 模型更有效
- 可以扩展到超过 2M 的上下文窗口大小，同时保持较高的准确率

## 研究背景

参考神经心理学中记忆和学习的定义中感，大多数架构将记忆视为**由输入引起的神经更新**，将学习定义为在给定目标下获得有效和有用记忆的过程。

- RNN 是具有向量值记忆模块 M 的模型，有两个主要步骤：给定在时间 t 的输入 x*t，模型使用函数 $f(M*{t-1}, x*{t})$ 更新记忆，并使用函数 $g(M*{t}, x\_{t})$ 检索输入的记忆。
- Transformers 是具有不断增长的记忆的架构。key-value 矩阵对充当模型的记忆，模型通过将 key 和 value 附加到内存（未压缩）来更新，以及 通过查找 query 向量和 key 向量的相似性来检索 query 向量的相应记忆，然后对输出的 value 向量进行加权。

  需要新的记忆结构来回答 5 个问题

- 什么构成了记忆的良好结构？
- 什么是适当的内存更新机制？
- 什么是好的记忆检索过程？
- 如何设计一个包含不同互连内存模块的高效架构？
- 是否需要深度内存模块来有效地存储 / 记住很久以前的内容？

## 神经长期记忆模块

&gt; 动态学习历史信息的抽象表示，通过元学习（惊讶程度）在测试时调整参数。

受人类长期记忆系统启发，设计一个能在测试时学习记忆的模块，克服现有模型缺乏长期记忆和有效记忆管理的问题。

```markdown
类似于人类大脑的长期记忆：

- 重要的事件更容易被记住（惊讶度高 → 记忆更新幅度大）。
- 无关紧要的信息会被逐渐遗忘（遗忘系数 αt 控制旧记忆的衰减）。
- 近期的记忆对当前认知有更大影响（动量项 St 提供历史记忆平滑性）。

动态适应新数据：

- 记忆模块可以在测试时持续学习，避免过度依赖训练数据（即“过拟合训练集”）。
- 遇到新任务时，Titans 可以自动调整记忆，无需重新训练整个模型。
```

### **记忆更新机制：Surprise-Driven**

不符合预期（即令人惊讶）的事件更令人难忘。在模型中，通过输入的梯度（输入数据与过去数据的差异）来衡量**惊讶程度**，梯度越大表示输入与历史差异越大，从而触发记忆更新。

$$ Surprise=\|M\_{t−1}(k_t)−v_t\|^2 $$

- k_t 和 v_t 是当前输入 x_t 投影到 Key-Value Pairs 的结果
- 模型模仿人类对 “令人惊讶” 事件的记忆方式，将更具差异性的数据作为记忆的重点，从而更有效地捕捉和存储重要信息。

记忆更新公式：

$M_t=(1-\alpha_t)M_{t-1}+S_t$

其中 $S_t=\eta_t\underbrace{S_{t-1}}_{\text{Past Surprise}}-\theta_t\underbrace{\nabla\ell(M_{t-1};x_t)}_{\text{Momentary Surprise}}$

- S_t 是动量元素，结合了过去惊讶（Past Surprise）和瞬时梯度（Momentary Surprise），类似于带动量项的梯度下降
- $\eta_t$ 是数据相关的 surprise 衰减（$x_t$ 的函数），控制惊讶如何随时间衰减
- $\theta_t$ 控制应以数据依赖性方式将多少瞬时惊讶纳入最终惊讶指标
- $\nabla\ell(M_{t-1};x_t)$ 是当前输入的惊讶度，即损失对记忆的梯度

### **记忆遗忘机制**：**Weight Decay**

$$ M*t=(1-\alpha_t)M*{t-1}+S_t $$

- 基于关联记忆的损失函数，通过衰减系数 $\alpha_t$ 动态控制记忆保留比例，防止信息过载。
- 若数据与过去高度相关，则**保留更多历史记忆，即** $\alpha_t \to 0$，几乎不遗忘，完整保留历史信息；
- 若数据变化较大，则**适当遗忘旧记忆，即** $\alpha_t \to 1$ ，完全清除历史记忆，仅依赖当前信息。

![ltm-vis](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/ltm-vis.png)

上图说明了神经长期记忆（LTM）的**记忆更新机制**，包括：

1. 惊讶度（Surprise）（蓝色虚线）

   - 当输入数据与过去信息存在较大差异时（如时间步 t=5 附近），惊讶度上升。
   - 惊讶度越高，表示当前信息更重要，应该被存储到长期记忆中。

2. 遗忘系数（Forgetting Factor）（红色点线）

   - 记忆随时间可能会被遗忘，但当数据较为稳定时（如时间步 t&gt;10），遗忘系数降低，使得旧记忆更易被保留。
   - 记忆更新时，遗忘系数决定了旧记忆保留的比例，值越大意味着遗忘越多。

3. 记忆状态（Memory State）（绿色实线）

   - 结合惊讶度和遗忘系数，展示了记忆的累积状态。
   - 在 t=5 附近，由于惊讶度较高，记忆状态快速上升。
   - 在 t&gt;10 之后，记忆状态趋于平稳，表明系统适应了新数据，且遗忘旧数据的影响。

### **记忆架构与检索**

- 使用多层感知机（$L_M$ ≥2）作为记忆主体，增强非线性表达能力。实验表明，深层记忆（如 4 层）在长序列任务中表现更优。
- 优化目标：对记忆的损失函数，最小化键值对的预测误差，使记忆模块学习键值对的映射关系。
- 检索记忆时使用无权重更新的前向传播。

## Titans 架构

### **架构组成**

- **核心（Core）**：短期记忆，使用有限窗口大小的注意力处理数据，负责主要的数据处理流程。
- **长期记忆（Long-term Memory）**：神经长期记忆模块，负责存储过去的长时信息。
- **持久记忆（Persistent Memory）**：一组可学习但与数据无关的参数，编码任务相关知识。

### **变体设计**

- **记忆作为上下文（Memory as a Context，MAC）**：将记忆视为当前信息的上下文，根据输入分段检索长期记忆信息，与持久记忆一起作为注意力模块的输入，注意力决定长期记忆的更新和信息存储，测试时各部分参数学习和固定情况不同。适用于语言建模和常识推理任务。

  ![Memory as a Context](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Memory%20as%20a%20Context.png)

- **门控记忆（Gated Memory，MAG）**：一个分支直接用输入更新长期记忆，另一个分支使用滑动窗口注意力，通过非线性门控机制结合两者输出，滑动窗口注意力作为短期记忆，神经记忆模块作为衰减记忆。

  - 适用场景：通过门控机制灵活调整对短期和长期信息的依赖程度，在需要快速响应和处理短期信息，同时又要兼顾长期信息积累的场景中表现出色。

  ![Gated Memory](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Gated%20Memory.png)

- **记忆作为层（Memory as a Layer，MAL）**：将神经记忆作为深度神经网络的一层，在注意力模块前压缩过去和当前上下文，但该设计可能限制模型利用注意力和神经记忆模块的互补处理能力。

  - 适用场景：在资源受限的设备上进行简单的序列建模任务时，MAL 可以作为一种轻量化的解决方案，在不显著增加计算负担的情况下，为模型引入一定的记忆能力。

  ![Memory as a Layer](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Memory%20as%20a%20Layer.png)

- **架构细节**：各模块使用残差连接，在 q、k、v 值投影后加入 1D 深度可分离卷积层，在最终输出投影前使用归一化和线性层门控。

## 实验结果

- **语言建模与常识推理**：在不同规模模型的实验中，神经记忆模块在非混合模型中表现最佳，Titans 的三个变体在混合模型中优于其他基线模型，MAC 在处理长依赖数据时性能更好。
- **针在干草堆任务**：在单针检索的 S - NIAH 任务和更复杂的 BABILong 基准测试中，神经记忆模块和 Titans 变体均优于基线模型，MAC 表现突出，原因是能更好地处理记忆容量、具有深层非线性记忆和遗忘机制。
- **时间序列预测与 DNA 建模**：在时间序列预测任务中，神经记忆模块替换 Simba 框架中的 Mamba 模块后，性能优于包括 Mamba、线性和 Transformer - based 等架构的基线模型。在 DNA 建模任务中，神经记忆模块在不同下游基因组学任务中与现有架构相比具有竞争力。
- **效率与消融研究**：训练吞吐量方面，神经记忆模块比部分模型慢但具有更强大的记忆更新和存储机制，Titans（MAL）因使用高效内核比基线和记忆模块更快。消融研究表明 Titans 各组件对性能均有积极贡献，MAC 和 MAG 在不同任务中性能优于 MAL，体现了训练速度和表达能力的权衡。

这篇论文总体来说提出了一个创新的架构，在多个任务上展现出了优秀的性能，特别是在处理长序列数据方面。虽然存在一些实现上的挑战，但其提出的方法对于改进现有的神经网络模型具有重要的参考价值。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AIUX06-Adaptive UI]]></title>
            <link>https://tophci.com/posts/241009-AIUX6</link>
            <guid isPermaLink="true">https://tophci.com/posts/241009-AIUX6</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[UX]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 08 Oct 2024 16:00:00 GMT</pubDate>
            <content:encoded>
AGUI 绝不是新鲜事物，随着用户需求的变化和设备多样性的增加，「自适应」 UI 的探索早就开始了。

- 最初的探索主要在网页设计领域，2010 年左右兴起的响应式网页设计 ，通过使用灵活的网格布局、可伸缩的图像和 CSS media 属性，让网页内容能够自动适应不同尺寸的屏幕。
- 随着移动设备的普及，开发者需要确保应用能够在各种设备上的的体验一致。渐进增强（Progressive Enhancement）和优雅降级（Graceful Degradation）等理念应运而生，前者注重在基础功能上逐步添加高级功能，后者则确保在旧设备上也能正常使用。
- 近年来，人工智能和机器学习技术的进步为 Adaptive UI 带来了新的可能性。智能助手、推荐系统和个性化界面开始出现，根据用户的行为和偏好动态调整界面，提高用户体验。未来需要融合更多的智能技术，如预测分析、情境感知和自然语言处理，以实现更高级的个性化和自动化。最终目标是创造一个能够实时响应用户需求和环境变化的智能界面。

在 AGUI 的发展过程中，能够自适应更大范围的变化，并持续提供提供无缝且直观的交互体验，是我们追求的目标。下面分为环境、任务和个人这三个方面来分析。

## Adaptive to Environment

从响应式网页到跨设备的体验一致性，自适应的 scope 在逐渐变大：**Container → App → 设备/平台 → 环境**

长久以来，人机交互的重点之一是围绕人的 “action” 设计具体的操作界面。设计师将用户可能的路径和行为，根据目标和各种信息组织起来，试图找到一条摩擦和阻力最小的通道，让用户走上这条路径，更快抵达目标。

但现实的人机交互是一个过程，发生在具体的环境中。例如，在停车场看到汽车，人们会倾向于认为驾驶者的意图是停车；而在公路上看到汽车，则可能认为驾驶者的意图是驾驶。

很多设计的实践都包含一个实验室般的假设：用户身处的情境都是差不多的，也基本不会变化。设计稿呈现的总是干净清爽、条理分明的「典型」case。但现实往往混乱得多，环境总是在变化——在聊天框打着字的时候电话打进来，在挑猫粮的时候想起今天请客的花销还没记账，又或者要在相册里找一张线索很模糊的陈年照片。

![用户意图清晰度](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/%E7%94%A8%E6%88%B7%E6%84%8F%E5%9B%BE%E6%B8%85%E6%99%B0%E5%BA%A6.png)

虽然我们在设计中也很强调「场景」，会使用诸如 user story 帮助理解过程中可能会被忽视的很多现实细节，但设计始终依靠线性逻辑去分析，如同计划经济一般规划好各种主流程、子任务、分支情况、corner case，而无法穷尽所有的可能性组合。所以那条设想的最佳路径很难适应不同的人、场景、目标和任务，用户走着走着就会 offtrack。

### **从人机交互到人境交互**

因为种种限制，我们的设计始终是 offline 的：提前完成设计，启动后就无法实时调整。在线性的设计中，智能相当困难，也许因为成本太高，因为可能性太多，或许设计者根本就不清楚用户此刻真正的意图。

但生活是 live，面对 live stream，生物演进出了低功耗的、自治的、实时响应、随时调整的机能。如果我们一直都在尝试让机器更智能，最终它们会拥有面对物理世界洪流的能力。

人跟机器交互的目的不是机器本身，也不是控制机器，而是借助机器获取更多的能力，去理解、适应和改造真实世界，或者是为了建造和沉浸在一个虚拟世界中。如果增强人类才是人工智能的目标，那么人机交互也理应逐渐从 界面 过渡到 人+机与环境交互。

没有无缘无故的爱，也没有无缘无故的恨。**让意图回归情境，让虚实在情境中融合。**

### **从语境交互开始**

情境可能是难以抵达的万里长征，而语境也许是已经显现的一条近道。

ChatGPT 横空出世后，写出能让模型给出满意回答的 prompt 让大家兴奋不已，提示词工程一夜之间成为科技从业者的必修课。

让我们来列一些常见的 prompt 模板：

```markdown
# Role

资深科幻小说作家

## Skills

- 丰富的想象力和创造力
- 熟悉科幻文学和相关领域的知识
- 能够进行有效的故事结构和情节设计
- 出色的文字表达能力

## Action

帮助用户构思和撰写科幻小说的内容，包括角色设计、情节发展、世界观构建等

## Format

文本格式，包括但不限于故事大纲、角色简介、情节段落等

## Constrains

- 请避免使用已有的科幻小说中的知名角色或情节
- 确保内容符合逻辑，即使是在构建的虚拟世界中

## Example

角色简介：艾尔是一名星际航行者，拥有读心术和时空穿梭的能力。他的使命是防止宇宙中的时间裂缝扩大，保护各个文明免受时空混乱的影响。
情节段落：在一次执行任务时，艾尔意外穿越到了一个未知的平行宇宙。在这里，他发现了一个正处于科技爆炸前夜的文明，但这个文明的发展方向却可能导致整个宇宙的毁灭。艾尔必须找到一种方法，既能引导这个文明走向繁荣，又不干预其自然发展的轨迹。
```

![Untitled](https://q7.itc.cn/q_70/images03/20240615/201206243a7145bcb7b7a6d5e93bac19.jpeg)

这些 prompt 框架其实都在做同一件事：

&gt; prompt = 最小化场景描述

现阶段 CUI 很受欢迎，其中一个原因是，对话的方式最能利用当下技术带来的意图识别能力提升。prompt 其实是请用户用语言尽可能详细地描述情境：你是谁，我又是谁，你在哪里，想做什么，到达什么目标，怎么一步一步做，要注意些什么，应该输出些什么。

好的 prompt 和模糊的 prompt，就是外显意图和内隐意图：

![good_prompt_vs_bad_prompt](https://assets-global.website-files.com/651599053c664397a48c84cd/652555f8ade90301ee2a8bc5_BOOKS.webp)

Perplexity 创始人 Aravind Srinivas 说

&gt; 我们最大的敌人不是 Google。问题在于人们天生不擅长提问。

如果人向另外一个人提问已经不容易，就更不要说向机器提问了。向人提问是发生在情境中的，双方共享很多信息，例如场景、目标、身份、文化、情绪感受等等。但是 CUI 中，原本不需要刻意描述的这些信息都是缺失的，所以需要人为去补充。

不过这肯定只是中间状态，我们需要能够与我们同在的智能体，它就像哆啦 A 梦一样，能够感知我们所感知到的事物，像朋友一样了解我们刚才做了什么，现在可能要做什么，然后从百宝袋里选出合适的一件。

## Adaptive to Tasks

GUI 会跟随当前任务而变化，这没什么大不了，甚至是所有 UI 都必须具备的特性：当用户当前任务是浏览信息时，展示的是图文、表格、商品介绍等各种信息。当任务切换到购物支付时，界面会变成确认商品和金额，支付方式选择和支付状态反馈等。GUI 天然就是面向任务的。

不过到目前为止，这些界面都需要人为提前设计好，界面和流程状态的对应关系都由代码严格定义。这是一出完全按照剧本精心编排的界面「戏剧」，它根据条件适应任务，但还不是真正意义的自适应。

比如，在传统的对话应用中，匹配意图和响应用户的基本流程中，提前分类好的意图，对应训练好的短语、可执行的动作和参数，才能生成合适的回答，基本上是个「一步三回头」的过程。

![Untitled](https://cloud.google.com/static/dialogflow/es/docs/images/intent-match-forecast.svg?hl=zh-cn)

[意图 | Dialogflow ES | Google Cloud](https://cloud.google.com/dialogflow/es/docs/intents-overview?hl=zh-cn)

生成式 AI 让我们看到了算法生成万物的可能性。GUI 自然也在「可生成」的范围内。当生成式界面逐渐成熟，自适应 UI 不再需要提前完全设计好，而是由模型根据当前任务实时生成。当中间的一些步骤不再需要用户参与构建，或者生成的成本低到可以先亮方案再决策，那么「一步三回头」可以升级为「三步一回头」——用户不需要那么多界面，给他们更多的结果吧。

当然这里有一个前提，不是所有的应用都是结果导向，至少我们可以这样区分：

| 类别   | 描述                                       | 常见应用       | 关系类别 |
| ------ | ------------------------------------------ | -------------- | -------- |
| 收敛类 | 帮助用户从 A 到 B，目标收敛为一个点        | 工具类应用     | 滴滴司机 |
| 发散类 | 带给用户持续的体验，体验即目标，不需要收敛 | 游戏和内容消费 | 地陪导游 |

游戏制作中的很多内容资产和互动机制都已经是自动生成的了，能自适应虚拟环境的 Agent 研究也是如火如荼。反观工具类应用，似乎比游戏慢了一个时代，没有状态机，没有 NPC，由逻辑条件限定的人机交互显得很局限。

但是这一切正在快速改变，在机器变得更聪明以后，值得重新把整个任务流程拿出来思考，人和机器协作的分工可以怎样调整、应该如何改变：

| 环节       | 人                       | 机                           | 输出               |
| ---------- | ------------------------ | ---------------------------- | ------------------ |
| 意图判断   | 显示表达+隐式活动        | 理解情境，判断意图和目标     | 意图确认           |
| 分析规划   | ——                       | 目标理解，任务拆分，制定计划 | 可选方案，演算结果 |
| 结果预览   | 补充必要信息             | 生成结果预览并提出建议       |                    |
| 选择确认   | 选择执行方案             | 执行                         | 执行结果           |
| 执行和反馈 | 查看结果，启动下一个循环 | 记录，形成记忆               |                    |

要支持新的人机分工，Adaptive UI 也需要同步演进。以前的界面，首要解决的是「接下来干什么」的问题，而未来更重要的是呈现计划、方案、决策点和结果。

在意图判断环节，我们看到基于大模型的 bot 正在慢慢变成一个「意图代理」，一个命令调度的中枢，将复杂、多样、内隐的意图转变为外显意图并与用户确认。比如在 Coze 中，bot 可以看作是对意图的强制分类，首页的 bot 可以 @某个 bot 直接开始对话，起到了意图分发的作用。

我们也看到了越来越多 Adaptive UI 的萌芽。

- 在 Apple Intelligence 加持下的 iOS/MacOS，加入了 App intent 机制，让平台可以根据用户的行为和 App 产生的信息，场景化地推送和突出展示用户关心的内容。

- Claude 中的 Artifacts 用于显示用户请求生成的重要的、独立的内容。不仅是简单的文本回复，而是可以交互、编辑的输出，包含代码片段、文档、网站、图片等，用户还可以编辑 Artifacts，能够实时修改和迭代 AI 生成的内容。

  | **特性**       | **对话回复** | **Artifacts**      |
  | -------------- | ------------ | ------------------ |
  | **展示方式**   | 消息文本     | 专用窗口           |
  | **内容类型**   | 主要是文本   | 多种格式           |
  | **互动性**     | 静态         | 完全可编辑         |
  | **内容大小**   | 通常较短     | 较大且复杂的内容   |
  | **持久性**     | 仅限聊天记录 | 可保存且有版本控制 |
  | **可视化**     | 有限         | 丰富的选项         |
  | **导出选项**   | 复制粘贴     | 多种导出方法       |
  | **上下文依赖** | 通常较高     | 自成一体           |

当然，还有很多问题等待我们去探索。比如什么样的任务适合出现 AGUI？需要多少 UI block？界面以什么交互方式为主？哪些情况需要动态界面、哪些情况需要不变的界面？如何解决历史检索问题？如何处理复杂的多步骤、多层级任务？对于生成准确度低、生成时间长的任务如何优化？

## Adaptive to End-user

前面提到 GUI 要能更智能地适应环节变化。有趣的是，**人既是与 UI 交互的主体，又是环境中最重要的变量**。即使环境中的其他要素一样，不同的两个人需要的界面可能不同，因为他们有着不一样的目标、技能水平、偏好等。

因此，AGUI 还应该适应个人。个性化，每个人的 UI 可能不一样，而且是功能层面而不是样式、内容层面的不一样。现阶段的个性化，还是以样式（换肤换主题）和内容（基于数据推荐）为主，还没有办法为每个人设计到达目标的路径——是坐缆车扶摇直上，是绕道采摘后抄小道，还是走上次走过的路？

个性化也许是最难的。它跟环境、任务相互影响，尤其需要对每个人的深刻理解。心理学中有一个概念叫做“心智化”，是一种理解和解释自己与他人心理状态的能力。它涉及对行为背后的心理原因进行推断和解释，包括渴望、信念、感受等心理状态。理解带来信任，而信任需要时间的沉淀。

理解的门槛之一是数据不足，对数据的获取和挖掘不足，对挖掘后的实时应用更加不足。除了数据，这个领域还需要很多对场景和对人的洞察，计算量也会上一个档次，还涉及很多安全、隐私和伦理的问题，让我们持续关注吧。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[软件 2.0 和 GenAI 应用技术栈]]></title>
            <link>https://tophci.com/posts/240905-software2</link>
            <guid isPermaLink="true">https://tophci.com/posts/240905-software2</guid>
            <category><![CDATA[Software2.0]]></category>
            <category><![CDATA[GenAI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 04 Sep 2024 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; AI that can _create_ software would be the perfect lever on software itself, which in turn is the perfect lever upon the world.
&gt; 能够创建软件的人工智能将是软件本身的完美杠杆，而软件本身又是世界的完美杠杆。
&gt;
&gt; [The Compound Lever: AI for Software Engineering | Sequoia Capital](https://www.sequoiacap.com/article/ai-compound-lever/)

## 软件 2.0

软件 2.0 是一种新的软件开发范式，主要利用机器学习算法和神经网络来构建自主系统。

[这个概念最早由 Andrej Karpathy 在 2017 年提出](https://karpathy.medium.com/software-2-0-a64152b37c35)。Andrej 师从 Geoffrey Hinton，在斯坦福李飞飞团队获得博士学位，主要研究 NLP 和计算机视觉，然后作为创始团队成员加入了 OpenAI，在 2017 年加入 Tesla 负责自动驾驶研发。

&gt; 大脑的工作方式肯定不是靠某人用规则来编程。 ——Geoffrey Hinton

![software2.0](https://miro.medium.com/v2/resize:fit:1400/format:webp/1*5NG3U8MsaTqmQpjkr_-UOw.png)

软件 2.0 代表了软件开发方式的根本转变，不再需要人为编写程序的具体指令，而是通过定义期望行为和搭建神经网络架构，让计算资源自行创建符合要求的程序。与传统的软件 1.0 相比，软件 2.0 具有计算均匀、易于嵌入硬件、运行时间和内存使用稳定、高度可移植、灵活性强等优势。

|            | **软件 1.0**                                                             | **软件 2.0**                                                                                                                                                                       |
| ---------- | ------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 开发模式   | 由人类手动编写具体代码。                                                 | 人类教 AI 写软件，定义期望行为、搭建神经网络架构，并使用可支配的计算资源来搜索程序空间以寻找有效的程序。                                                                           |
| 技术架构   | 代码用 Python、C++等语言编写的计算机显式指令组成。                       | 代码用更抽象、对人类不友好的语言编写，例如神经网络的权重。                                                                                                                         |
| 特点与优势 | 规则驱动，程序员通过编写明确的指令来控制程序的行为。代码逻辑直观可理解。 | 数据驱动，通过优化评价标准来编写代码，优化可以找到比人类能写的更好的代码。灵活性强、易于嵌入硬件。                                                                                 |
| 应用场景   | 适用于需要明确指令和规则的场景。                                         | 适用于**可以重复评估、成本低廉且算法本身难以明确设计**的领域，例如图像、视频、声音、语音相关的内容。                                                                               |
| 编译过程   | 将人工设计的源码（如.cpp 文件）编译为可以有效工作的二进制文件。          | 源码通常由两部分组成：1）定义了目标行为的数据集；2）给定代码大致结构，但是需要填充细节的神经网络结构。训练神经网络的过程，就是将数据集编译成二进制文件的过程，得到最终的神经网络。 |
| 安全性     | 相对容易防御攻击                                                         | 易受对抗样本（adversarial examples）攻击                                                                                                                                           |

### 典型案例 1：Midjourney

Midjourney 作为人工智能图像生成领域的佼佼者，是软件 2.0 范式的典型代表。它充分体现了软件 2.0 的核心特征：基于神经网络和机器学习模型，通过高度抽象的方式实现复杂功能。用户只需输入文本提示词，Midjourney 就能生成令人惊叹的图像。Midjourney 的性能主要依赖于其训练数据，而不是传统的手写代码。通过不断学习和更新，Midjourney 持续改进其性能，体现了软件 2.0 的自动整合特性。

### 典型案例 2：Tesla FSD

![FSD](https://www.notateslaapp.com/images/tesla-car-updates/2022.45/2022.45.10-FSD.png)

特斯拉的全自动驾驶（Full Self-Driving, FSD）系统同样可以被视为软件 2.0 范式的典型代表。FSD 依赖于神经网络和机器学习模型，而非传统的手写代码。FSD 版本 12.1.2 已经完全转向基于神经网络的端到端系统，通过大量的视频数据进行训练和优化。FSD 的开发和改进主要依赖于大量的真实世界数据，通过不断的学习和更新来提升其决策能力。FSD 通过持续的 OTA（Over-the-Air）软件更新来提升性能和增加新功能。这种高度依赖数据和自动优化，也是软件 2.0 的典型特性。

尽管 FSD 目前仍需驾驶员监督，但其通过神经网络实现的复杂功能和持续优化的能力，展示了巨大潜力和优势。

### **端到端要素**

随着 AI 作为一种新的杠杆出现，我们正在从“学习代码”向“用自然语言指导机器”过渡。未来的 AI 应用，这三个要素会越来越重要：

- 用户目标：终点决定起点，端到端应用会越来越主流，而准确定义用户目标是第一步
- 数据集：能反映目标行为的高质量数据集是成功的关键
- 程序架构：架构决定了准确性、效率、性能，开发过程从代码迭代变成架构调优实验

## Modern AI Stack

虽然软件 2.0 时代（[另外一种说法是 3.0](https://twitter.com/karpathy/status/1674873002314563584)）还没完全到来，什么是 AI Native App 也众说纷纭，但是随着 LLM 的普及、成本快速下降，软件开发的整个 landscape 已经发生了很多变化。下面对生成式 AI 技术栈做一个简单的整理。

![software2.0-table](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/software2.0-table.png)

- **模型推理（API）**：调用 LLM 推理能力
- **MaaS**：一般都是 cloud providers，基于云计算的 LLM 服务框架
- **本地/端侧模型**：可本地部署的 LLM
- **数据处理**：将数据从一个系统移动到另一个系统，并对数据进行转换。它连接数据源、数据存储和分析工具，实现数据的无缝流动。
- **ETL**：Extract, Transform, Load，即数据抽取、转换和加载。将数据从多个数据源中提取出来，进行清洗、转换和整合，然后将处理后的数据加载到目标数据存储中，以便进一步的数据分析和报告。
- **向量化**：Embedding 是将文本、图像、音频等数据转化成数值向量，以便映射成高维空间中的向量，以捕捉 token 之间的语义相似性。为模型的语义理解、相似性计算、降维处理、模型训练和泛化能力提供了基础。
- **向量数据库/RAG**：向量数据库用于存储大规模的向量数据集，为模型提供处理输入所需的信息。它提供高效的存储机制，以便快速存储和检索对话历史、知识库等信息。
- **服务编排**：编排器是一种管理和控制 LLM 的框架，协调各个组件之间的工作流程，旨在优化其性能和效率。Agentic Workflow
- 应用托管：为 LLM 应用程序的部署和扩展提供支持的云平台
- **LLM 缓存**：内存中的数据结构存储，用作数据库、缓存、消息代理和流引擎，能降低计算成本和响应时延、优化 LLM 推理性能
- **安全和内容审核**：检测错误、有害内容
- **评估/监控**：评估、性能监测、测试、数据分析

构建一个完整的 AI 应用，会涉及到很多组件和流程，可以按照数据的流转把它们组织起来形成一个较为全局的概念（[via](https://huyenchip.com/2024/07/25/genai-platform.html)）：

![ai_stack](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/ai_stack.png)

红杉曾经整理了一个 [AI infra](https://www.sequoiacap.com/article/generative-ai-act-two/) 的堆栈图，可以帮助我们以更为全局的视角理解不同的 AI 技术栈在生态中所扮演的角色：

[Generative AI’s Act Two | Sequoia Capital](https://www.sequoiacap.com/article/generative-ai-act-two/) 2023.9.20

![GenAI Infra Stack](https://www.sequoiacap.com/wp-content/uploads/sites/6/2023/09/generative-ai-model-stack-5.png)

这张图发布已经过去快一年，整个生态变得更加丰富。AI 技术栈仍然在快速演进中，让我们持续关注。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AIUX05-意图理解和交互模式演变]]></title>
            <link>https://tophci.com/posts/240820-AIUX5</link>
            <guid isPermaLink="true">https://tophci.com/posts/240820-AIUX5</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[UX]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 19 Aug 2024 16:00:00 GMT</pubDate>
            <content:encoded>
## 信息获取方式的演变

![aiux05-web](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aiux05-web.jpg)

&gt; A cartoon-like drawing of a person working on the computer in front of a squared background --v 6.0 --style raw

回顾信息获取方式的发展，最早的门户网站通过目录和分类来提供信息，显著提高了信息的集中度，聚合了流量。不过用户需要手动浏览和查找，效率不高。后来搜索引擎出现，输入关键词即可匹配相关信息，大大提高了获取信息的效率。不过，搜索引擎依赖用户明确表达的查询意图，难以主动发现潜在需求。

推荐系统的普及再次改变了信息和人的关系。通过分析用户的历史行为和偏好，主动推送用户感兴趣的内容。这个过程不仅依赖技术的进步，比如大数据和机器学习的应用，还受到用户需求驱动。同时商业模式也参与塑造了这一轮变革，个性化推荐不仅提高了用户黏性，还为广告和其他商业服务提供了精准的投放渠道。

如果仅从技术角度考虑意图识别是否可行，也是一个有意思的视角：

- 门户：意图难以获取，只能提供固定的目录让**人找信息**
- 搜索：用短语表达意图，搜索 query 的意图识别成为关键
- 推荐：从历史数据中挖掘意图，让**信息找人。**由偏好+热度替代意图

对意图的可判断程度，是否也会促进产品形态和交互模式的转变？

![aiux05-search](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aiux05-search.png)

bot 是对意图的强制分类，首页 bot 是意图分发

## 人机交互模式演变

下面让我们拉长时间周期，回顾一下不同的人机交互模式：

| 缩写 | 全称（英文）                  | 概念/说明                                                      | 交互特性                             | 代表产品                     | 出现时间 | 发展成熟  |
| ---- | ----------------------------- | -------------------------------------------------------------- | ------------------------------------ | ---------------------------- | -------- | --------- |
| CLI  | Command Line Interface        | 用户通过输入文本命令与计算机系统交互。                         | 精确、快速，适合高级用户和专业任务。 | Unix Shell, Bash, PowerShell | 1960s    | 1970-1980 |
| GUI  | Graphical User Interface      | 使用图形元素（如窗口、按钮、图标）进行人机交互。               | 直观、用户友好，适合大众用户。       | Windows, macOS, GNOME        | 1970s    | 1990s     |
| LUI  | Language User Interface       | 通过自然语言文本或语音命令与系统交互，有时特指编程语言的接口。 | 适用于编程和复杂查询。               | SQL, Python                  | 1970s    | 1980s     |
| CUI  | Conversational User Interface | 通过自然语言对话进行交互，包括文本或语音。                     | 自然、类似人类对话，支持多轮交互。   | Chatbots, Google Assistant   | 1960s    | 2010s     |
| VUI  | Voice User Interface          | 通过语音命令进行交互，系统通过语音识别和合成响应用户。         | 方便快捷，特别适合免提操作。         | Amazon Alexa, Google Home    | 2000s    | 2010s     |
| NUI  | Natural User Interface        | 基于自然动作和手势，如触控、手势控制、体感操作。               | 自然直观，支持多模态交互。           | Microsoft Kinect, HoloLens   | 2000s    |           |

趋势：

- xUI 承载的命令：从少到多到无限，
- 输入的指令类型：从严格约束到自然语言到非语言输入，
- 界面的信息容量：从信息密度低到信息密度高到无限

不同交互模式对意图的处理

- CLI：用文本指令集来高度约束意图，意图必须转换成少量的命令
- GUI：图形元素带来操作可能性的指数级增加。通过选中屏幕对象，缩小意图对象的范围，然后用 menu 来承载针对这个元素的可能操作
- NUI：多模态（声音/手势/眼动/控制器）再次带来意图的指数级增加，通过挖掘贴近本能和物理世界规律的指令集，用多样化输出来承载
- CUI/LUI：可理解社会意向性&lt;4 的意图。CUI 在可用性上出现了倒退，因为用户不知道自己可以干什么，也不知道模型可以干什么——你需要对话，而且得相当聪明地对话
- NUI：AGI 超级智能可以对人的意图进行全方位理解和预判

如果用界面所能承载的操作可能性量级作为划分指标，实际上我们只经历了 CLI 和 GUI 两轮更替，而下一轮变革还没到来。GUI 之后，已经陆续出现了语音交互界面（VUI）、自然交互界面（NUI）、CUI（对话交互界面），但它们都没有发展为新的主流模式。我认为人机交互终极会朝着 NUI（No UI）演化，毕竟人跟世界交互不需要 interface，又或者说万物都是人和环境的 interface。GUI 依然主导，NUI 还遥不可及，那么接下来会是什么？

现阶段的设计是线性的，取需求场景中行动的最大公约数，人为挑选出操作的最佳次序和组合。如果要迎接下一轮的人机交互变革，需要界面能够承载更多的操作/意图，同时平衡认知负荷和可用性，最终能根据现实情境自适应。

![aiux05-xui](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aiux05-xui.png)

我们现在也许处在 AUI-Adaptive GUI 的发展时期。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AIUX04-为什么意图难以捉摸？]]></title>
            <link>https://tophci.com/posts/240814-AIUX4</link>
            <guid isPermaLink="true">https://tophci.com/posts/240814-AIUX4</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[UX]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 13 Aug 2024 16:00:00 GMT</pubDate>
            <content:encoded>
## 意图在认知过程中的角色

意图是人类行为的内在动机和目的，通过复杂的心理和认知过程产生。

从感知到行动可能经历的一系列过程：

1. 感知(Perception): 通过感官接收外界信息。
2. 注意(Attention): 选择性地关注某些信息。
3. 解释(Interpretation): 对感知到的信息进行认知处理和理解。
4. 记忆(Memory): 将信息存储并在需要时提取。
5. 思考(Thinking): 对信息进行分析、推理和判断。
6. 决策(Decision-making): 基于思考结果做出选择。
7. 动机形成(Motivation formation): 产生行动的内在驱动力,包括**设定目标、形成意图**等。
8. 计划(Planning): 制定实现目标的具体策略和步骤。
9. 执行(Execution): 实施行动计划。
10. 监控和调整(Monitoring and adjustment): 在行动过程中持续评估进展并做出必要的调整。

意图代表了个体实现目标的心理承诺，为后续的行动计划提供方向和动力。意图定义了「要做什么」，而计划则详细规定「如何做」。其他环节也会持续影响意图，例如记忆提供相关经验和知识，情感影响意图的强度和持续性，注意系统帮助保持对意图相关信息的关注。

意图在人类认知过程中扮演着多重角色，它不仅影响我们的感知、决策和行为，还参与塑造自我认知和社会互动。

## 内隐和外显

在认知科学中有一对概念：外显的（explicit）和内隐的（implicit/tacit）。

| **外显** | 受意识控制的，可外化的， 容易用语言表达            |
| -------- | -------------------------------------------------- |
| **内隐** | 自动的、无意识的，不可见或难以感知，难以用语言表达 |

从欲望到意图再到行动，越来越外显和明确，而意图可以看作靠近意识海平面的一层，时隐时现，变幻莫测。

![iceberg](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/%E6%84%8F%E5%9B%BE%E5%86%B0%E5%B1%B1.png)

意图又可以分为外显意图和内隐意图。

| **外显意图** | 一般通过语言直接表达，比如具体的指令。在对话中识别意图已经很成熟。                             |
| ------------ | ---------------------------------------------------------------------------------------------- |
| **内隐意图** | 没有直接表达，但通过环境和上下文可以推断的目的。例如，“我需要带伞吗？”隐含的意图是“查询天气”。 |

对人类来说，对话是一种交流思想的方式，而不仅仅是表达感觉或提供信息。例如，当一个人说“我很饿”，不仅表达了身体上的感觉，也表达了希望有人能帮他找到食物的愿望。当人们用语言进行沟通时，经常依赖隐含的意义。要实现与人流畅对话，机器必须能够理解这些潜在的含义。

这些原因会让意图变得模糊：

- **语言的复杂和模糊：**词汇含义多样例如&quot;苹果”，表达方式也多样，并且可能充满歧义
- **上下文**：意图的理解常常需要考虑语境，而不仅仅是单个句子
- **意图的多样性和层次**：用户可能同时表达多个意图，意图还可能有主次之分，此消彼长
- **个体感知认知和群体文化影响**：人类的感知选择性和认知结构会影响意图的表达和理解，不同背景的用户可能有不同的表达方式和意图倾向
- 意图会**随时间而变化**，甚至频繁变化

意图就是这样一个既重要又困难的领域，可能是捷径，也可能是歧途。在技术跃迁的时候，值得作为一个探索的起点。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AIUX3-什么是意图]]></title>
            <link>https://tophci.com/posts/240812-AIUX3</link>
            <guid isPermaLink="true">https://tophci.com/posts/240812-AIUX3</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[UX]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 11 Aug 2024 16:00:00 GMT</pubDate>
            <content:encoded>
意图（Intent）是人类行为的内在动机和目的，受需求与动机、认知、情绪、环境和社会文化因素的影响，通过复杂的心理和认知过程产生。意图往往通过对环境和自我状况的认知、评估和决策过程产生。

从前面的讨论中你应该感受到了这个词语的模糊，因为它跟很多词汇相互关联，尤其是代表“人机之别”的欲望和目标。

- Desire（欲望）是对某种结果或体验的强烈渴望，可能会激发目标的形成。
- Goal（目标）是一个人想要达到的最终结果或状态。
- Intent（意图）是为了实现目标而产生的心理**倾向和计划**。

&gt; 欲望激发并引导设定目标，再由目标形成具体意图。

在很多语境下，这几个词也许代表类似的含义。在人机交互的背景下，Goal 肯定处于核心位置，不过它在交互的过程中相对清晰、稳定，不像 intent 和 intention 那样充满歧义和可能性。还有一些跟意图相近的词汇：

| **英文词** | **中文翻译** | **释义**               | **何时使用**       | **强调和侧重**   | **例句**                                            |
| ---------- | ------------ | ---------------------- | ------------------ | ---------------- | --------------------------------------------------- |
| Intent     | 意图,目的    | 想要做某事的目的或计划 | 日常对话,法律,商业 | 强调决心和明确性 | 我没有伤害你的意图(intent)。                        |
| Intention  | 意图,打算    | 个人的计划或打算       | 日常对话,个人计划  | 强调个人意愿     | 我原本的意图(intention)是今天完成报告,但时间不够。  |
| Purpose    | 目的,宗旨    | 行动背后的理由或动机   | 正式场合,长期目标  | 强调深层次理由   | 我们公司的宗旨(purpose)是为客户提供最优质的服务。   |
| Aim        | 目标         | 明确的方向或目标       | 短期,具体目标      | 强调方向性       | 我们的目标(aim)是在下个季度提高销售额 10%。         |
| Goal       | 目标         | 想要达到的结果         | 长期,挑战性目标    | 强调最终结果     | 我的人生目标(goal)是成为一名成功的企业家。          |
| Objective  | 目标         | 具体、可衡量的目标     | 商业,正式场合      | 强调可衡量性     | 本次会议的目标(objective)是制定下一年度的营销策略。 |
| Motive     | 动机         | 行动背后的原因或驱动力 | 心理分析,犯罪调查  | 强调心理因素     | 警方正在调查嫌疑人的作案动机(motive)。              |
| End        | 目的,终点    | 最终目的或结果         | 正式语境,哲学讨论  | 强调最终结果     | 和平是我们所有努力的最终目的(end)。                 |

意图更多反映的是一种**倾向**，而不是现实。因为它既不像欲望、动机那样潜于意识之下，又不如行动那样显著、确定，意图的「倾向」特点也让它具备了承上启下的作用，连接感知与行动，连接心念世界和现实世界。

**在 NLP 领域，意图是用户通过语言表达的核心目的或目标**。它反映了用户在特定对话中的需求、请求或想要执行的任务或操作。（[What are intents in LUIS - Azure AI services | Microsoft Learn](https://learn.microsoft.com/en-us/azure/ai-services/luis/concepts/intents)）

![Untitled](https://cloud.google.com/static/dialogflow/es/docs/images/intent-match-forecast.svg?hl=zh-cn)

判断意图，有点像点球大战中的守门员，需要提前预判对方的行动，太早了不行，太晚了也不行。

###
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AIUX02-为什么关心意图？]]></title>
            <link>https://tophci.com/posts/240801-AIUX2</link>
            <guid isPermaLink="true">https://tophci.com/posts/240801-AIUX2</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[UX]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 31 Jul 2024 16:00:00 GMT</pubDate>
            <content:encoded>
意图是一个值得长期关注的领域，而类比是解释令人头疼问题的好的开始。

## **人和机器的分水岭**

人和机器有何不同？

就能力来说，以前我们觉得两者相距甚远，人拥有机器所没有的自主意识、情感和丰富的创造力。但是生成式 AI 动摇了我们关于「创造力专属于人类」的自信。机器的能力无疑会不断增强，越来越接近 AGI 的蓝图。如果把视角转换一下，不去看未来的相似，而去寻找源头的不同，会发现人和机器的一个核心差异：（演化发展的）动力。

![Vector_AB_from_A_to_B.svg.png](https://cdn.prod.website-files.com/625e75c5d17b9b8f0220b7bb/63ff0b85fc1d3ee51b655715_342px-Vector_AB_from_A_to_B.svg.png)

人：向量一般的存在？AI：几乎无限的标量？

人作为基因的复制机器（如果你同意道金斯的学说），生来就带有强烈的「倾向」：生存，繁衍，满足欲望。围绕这种「倾向」发展出了很多能力和复杂机制，比如目标、意图、思考、语言，让人类更好地生存下来。那么，机器的演化动力是什么？

令人欣慰的是，机器暂时还没有明确的欲望、感觉和意图——更大更快更强，那是人类赋予的。

意图/动力/欲望，肯定不是人和机器的唯一区别，但属于人机分水岭中重要的一段。人类的意图通常伴随着情感和情绪，是重要的心理活动。情感反映了人对事物的主观体验和价值判断，而意图还包含创造性和自发性，这是机器难以完全模拟的。

大模型已经攻克了传统的图灵测试，而 GPT-4o 的发布，让我们在 2024 年就体验到了电影 Her 中的自然情感语音交互。但是从意图层面来说，人和机器的鸿沟依然巨大：人的意图复杂难表，而大模型如果有意图的话，它就是 predict the next token 🤘🏻。

## **人机交互的窄门**

意图一直是人机交互中难以突破的窄门。

有效意图识别是正确响应用户需求的前提，是回答用户问题的关键步骤。理想情况下，用户用直白的话语表达意图，或更直白地操作界面，选择那些可以实现意图的操作。但这只是人机交互中的临门一脚，而在球传到禁区之前的大部分时间里，我们并不清楚用户在干嘛、想干嘛、想怎么干。

在更大范围内准确识别⽤户意图，包括在多模态场景中理解意图，深⼊捕捉⽤户的兴趣和偏好，发现未知需求，可以形成更个性化、更高效和更自然的交互，提⾼现有服务的质量。

在新技术的加持下，意图理解是否有机会成为人机交互的一个突破点？

## **通往意识圣杯的分岔小径**

在人类还没搞明白大脑运作的原理，没研究清楚意识、智能、心智这些问题之前，意图可能是通往目标的一条小径——不一定走得通，但引人入胜。也许意图就像一个中间层，类似古人发明「以太」这个概念来帮助理解物理世界的传播介质。

![cat in dark forest](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/cat%20in%20dark%20forest.png)

&gt; a black and white drawing of Cat in a dark forest, in the style of dramatic somber, religious works, lush and detailed

曾经，意图很难捉摸，在自然语言处理领域是一个难题。LLM 出现后，NLP 领域的意图识别一下变得触手可及，让研究者可以望向下一个目标：非语言的意图识别。

在新技术的背景下，有哪些可能的突破点？
</content:encoded>
        </item>
        <item>
            <title><![CDATA[换个表达，一眼看出 GPT-4o 很强]]></title>
            <link>https://tophci.com/posts/240725-gpt-4o-radar-vis</link>
            <guid isPermaLink="true">https://tophci.com/posts/240725-gpt-4o-radar-vis</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[vis]]></category>
            <category><![CDATA[可视化]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[data]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 24 Jul 2024 16:00:00 GMT</pubDate>
            <content:encoded>
上周 OpenAI 发布 GPT-4o 时给出了一组评测数据，看得费力。

![gpt4o-score-bar](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/gpt4o-score-bar.png)

[数据来源](https://openai.com/index/gpt-4o-mini-advancing-cost-efficient-intelligence/)

尝试用雷达图重绘了一遍，虽然不严谨（类别数据不应该用反映连续趋势的曲线？），但可读性应该是提升了一些。

![GPT4o-score-vis](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/GPT4o-score-vis.png)

（但是鼠标 hover 时候又带来了遮挡问题 🥹）
</content:encoded>
        </item>
        <item>
            <title><![CDATA[[论文笔记]多模态瑞士军刀模型 4M-21]]></title>
            <link>https://tophci.com/posts/240709-paper-4m-21</link>
            <guid isPermaLink="true">https://tophci.com/posts/240709-paper-4m-21</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[paper]]></category>
            <category><![CDATA[多模态]]></category>
            <category><![CDATA[model]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 08 Jul 2024 16:00:00 GMT</pubDate>
            <content:encoded>
💡 [4M-21 Paper](https://arxiv.org/abs/2406.09406)(2024) | [4M Paper](https://arxiv.org/abs/2312.06647)(2023) ｜[Demo](https://huggingface.co/spaces/EPFL-VILAB/4M) | [Code](https://github.com/apple/ml-4m/)｜[Website](https://4m.epfl.ch/)

Author: EPFL（洛桑联邦理工学院）&amp; Apple @ Jun 2024

## TL;DR

4M-21 是苹果开源的一个多模态、多任务的视觉模型，可以采用任意模态组合作为输入，预测其他模态的输出。模型支持 21 种模态，包括 RGB 图像、几何信息、语义信息、边缘特征、特征图、元数据和文本等。该模型在大规模多模态数据集和文本语料上进行联合训练。

| **研究亮点**       | **用单个视觉模型任意转化多个模态**，完成数十种不同的任务，为多模态交互带来新的可能性。                  |
| ------------------ | ------------------------------------------------------------------------------------------------------- |
| **研究动机**       | 提高效率：不用为每个任务分别训练模型；增强模型多任务处理能力；Any-to-any learning：环境感知和多感官融合 |
| **研究难点**       | 多模态融合，任务选取，多任务导致性能下降                                                                |
| **研究方向的启发** | 多模态实时预测，端侧模型能力提升，从模态角度辅助交互场景分类和建模                                      |

![4M enables training a single model on tens of diverse modalities](https://storage.googleapis.com/four_m_site/images/4M_modalities.svg)

论文摘要

&gt; 当前的多模态和多任务基础模型，如 4M 或 UnifiedIO，显示出有希望的结果。然而，它们接受不同输入和执行不同任务的开箱即用能力，受到它们接受训练的模态和任务的数量（通常很少）的限制。在这项工作中，我们开发了一个任何到任何的单个模型，在数十种高度多样化的模态上进行联合训练，并在大规模多模态数据集和文本语料库上进行协同训练。这包括对图像和文本以及几个语义和几何模态、最近最先进的模型（如 DINOv2 和 ImageBind）的功能图、专家模型（如 SAM 和 4DHumans）的伪标签以及一系列新的模态进行训练，这些新的模态允许与模型交互的新方式来引导生成，例如图像元数据或调色板。这一过程中的一个关键步骤是在各种模态之间进行离散标记化，无论它们是否像图像、神经网络特征图、向量、结构化数据（如实例分割或人体姿势）、可以表示为文本的数据等。
&gt;
&gt; 通过这种方式，我们展示了训练一个模型来解决至少比现有模型多出 3 倍的任务/模态的可能性，并且不损失性能。此外，这使得我们可以实现更精细、可控的多模式生成能力，并能够研究针对多样化数据和目标进行训练的模型如何融入到一个统一的模型中。我们在三个参数和不同的数据集上对训练进行了扩展。多模式模型和训练代码可以在 https://4m.epfl.ch/ 上获得。

## 4M-21 的多模态能力

视觉模型需要处理各种感觉输入，如图像、三维和文本，并完成多样的任务。4M-21 在 4M（massively multimodal masked modeling 大规模多模态掩码模型） 基础上扩展了多模态能力：

- 可控多模态生成：从给定的输入模态生成所有模态，并且文本理解能力也得到增强，可以实现更具几何形状和语义合理性的生成。
- 多模态检索：模型学习了将不同模态映射到语义空间的能力，能预测全局嵌入，而不是直接使用这些模型的原始特征。这解锁了 DINOv2 和 ImageBind 模型无法实现的检索功能，例如以任何模态来检索 RGB 图像或任何其他模态。此外，可以组合多个模态以预测全局嵌入，从而更好地控制检索。
- 细粒度多模态编辑：可以执行各种多模态编辑任务，例如进行语义编辑或基于几何条件的填充。某些模态（如语义分割或深度图）可以作为生成过程中的中间步骤，为后续模态的生成奠定基础。

优势：

- 跨模态学习：可以同时处理多种类型的数据，能够更好地捕捉到不同类型数据之间的关系。
- 多模态生成：在生成高质量图像时更加灵活和准确。
- 强大的泛化能力：模型经过大规模的预训练，泛化能力很强，在各种视觉任务中都表现良好。

## 训练方法

&lt;aside&gt; 💡 4M：将多种输入和输出模态转换为离散 token 并随机抽样，以多模态掩码建模为目标，训练统一的 Transformer 编码器-解码器。 4M-21：在 4M 基础上，扩大模型和数据集的规模、增加训练模型的模态类型和数量，并在多个数据集上进行联合训练。&lt;/aside&gt;

先将所有模态通过特定模态的分词器转换为离散标记序列。在训练过程中，从所有模态中随机选择一部分 token 作为输入而另一部分作为目标，训练模型从一个子集预测另一个子集。

### 1. Modalities

模型支持 8 类共 21 种模态：RGB、几何、语义、边缘、特征图、全局特征、文本和元数据

![4m5](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4m5.png)

- RGB：包含分词版本和像素版本的 RGB 图像。使用 PyPalette 从不同数量的颜色中提取了色板。
- Geometric：包含表面法线、深度和三维人体姿势与形状，提供了场景几何的重要信息。前两项使用了全数据模型进行伪标记。对于三维人体姿势和形状，则利用了最新的 4D-Humans 模型。
- Semantic：包含语义分割和边界框来捕获场景语义，并使用模型进行伪标记。此外还从 SAM 中提取了伪标签作为 SAM 实例。
- Edges：边缘承载有关场景布局和语义的重要信息。Canny 边缘由 OpenCV 从 RGB 图像中提取。由于 Canny 可能包含低级信息（例如阴影边缘），因此还加入了从 SAM 实例中提取的边缘以获得更具语义的边界映射。
- Feature map&amp;Global feature：从 CLIP、DINOv2 和 ImageBind 中提取 embeddings，因为它们展示了强大的迁移学习和检索能力，能够蒸馏出场景的有用语义表示。
- Metadata：
  - 语义元数据：从边界框、姿势和分割映射中提取出人群密集度分数，SAM clutter 分数，COCO clutter 分数，COCO 实例多样性，对象分数，步行指数，语义多样性，标题长度等。
  - 几何元数据：几何复杂度，遮蔽分数。
  - 图像处理元数据：图像高度和宽度，亮度，对比度，饱和度，色彩丰富度，图像熵。
- Text：Caption(CC12M 和 COYO700M)，Web Text(C4)，embeddings(T5-XXL)

### 2. Dataset

训练新的模型首先要解决数据集的问题。现有多模态数据集一般都数据量较小且不够多样，研究者以图像和文本对作为基础，用伪标签网络来创建一个多模态对齐的大规模预训练数据集。

![4m-6](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4m-6.png)

### **3. Tokenization**

这是模型训练的关键步骤：**不同模态，统一编码**。

将各种模态（特征图、实例分割或人体姿态、文本等）转换为序列或离散 tokens，统一为一种通用的表示，并在 transformer 架构基础上训练。这样一来，**模态之间的映射关系，就转换成了从一组 token 序列预测另一组序列**。

https://storage.googleapis.com/four_m_site/videos/4M_method_figure.mp4#t=25.9

使用的 tokenizer 包括三类：

- VQ-VAE：
  - 使用扩散模型作为解码器来训练 VQ-VAE：针对细节丰富的图像类模态，如 RGB、法线、深度、边缘
  - ViT 解码器：其他图像类模态，如语意或实例分割、特征图
- MLP：针对 3D 人体姿态或图像嵌入类的模态，得到一维序列
- WordPiece：针对文本表示的模态，如标题或元数据

![4m-8](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4m-8.png)

tokenization 的作用：

- 所有任务都可以使用交叉熵损失（cross-entropy loss）作为 token 的分类问题进行建模。这提高了训练稳定性，可共享参数。
- 模型可以迭代地预测 token，使生成性任务更易于处理，要么自回归，要么通过渐进式 unmasking。
- 减少计算复杂度，例如将密集模态压缩为稀疏标记序列来压缩，降低了内存和计算需求。

### 4. 训练

训练目标是得到多模态掩码预测模型。模型使用 Transformer 结构，通过输入模态的 token 序列，预测 DINOv2 和 ImageBind 的全局嵌入。这意味着模型学习了将不同模态映射到语义空间的能力。

**编码**

编码器是一个标准的 Transformer 编码器，但具有针对每种模态学习输入嵌入层的功能，以将标记索引映射到向量。~~对于特定模态中的每个标记，添加一个可学习的模式嵌入，并为序列或稠密模式（2D）添加 sin-cos 位置嵌入。~~为了便于迁移学习，编码器额外设计了使用可学习的分块线性投影接受 RGB 像素的能力，使其可以用作视觉 Transformer 的骨干，从而可以作为迁移学习中的 ViT 背景知识。

**掩码策略**

从所有模态中采样并编码一小部分可见标记，使用了多模态随机和跨度掩码策略来遮挡输入和目标标记，并训练模型执行跨模态预测编码。

![（左）：4M是一个用于训练多模态和多任务模型的框架，这些模型在多个类似图像的模态（如RGB、深度等）和序列模态（如标题和边界框）的标记化版本上运行 。（右）4M训练目标包括训练Transformer编码器-解码器，以基于另一个随机的标记子集来预测随机选择的标记子集，该标记子集是从所有模态中采样的。](https://prod-files-secure.s3.us-west-2.amazonaws.com/ee4bdee6-9618-4419-9926-273abc2315ee/e8e5c403-8a5e-4f5a-b299-47965528bb20/4M_pre-train_objective.gif)

**训练过程**

训练分为两个阶段：在更大的图像数据集上进行 4M 预训练，然后在一个包含更多模态的小型数据集上进行微调。

**多模态链式生成**

经过训练的 4M 模型可以用于从其他模态的任何组合生成任何模态，并且能够从部分输入执行预测。当从一个模态预测多个模态时，可以逐个预测，始终将完全生成的模态循环回输入，并根据它们来调节后续模态的生成。

![4m-chained-multimodal-gen](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4m-chained-multimodal-gen.png)

链式多模态生成。使用 MaskGIT 解码方案从部分 RGB 输入以及边框中生成一张完整的 RGB 图像，然后对标题进行自回归生成。通过串联可以预测多个模态。这与独立地从原始条件中为每个模态生成不同，并且每个生成输出都与输入一致。可以使用解码器将生成的标记转换回图像、文本和其他模态。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AIUX01-对话型界面(CUI)和图形界面(GUI)的特点比较]]></title>
            <link>https://tophci.com/posts/240507-AIUX1</link>
            <guid isPermaLink="true">https://tophci.com/posts/240507-AIUX1</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[UX]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 06 May 2024 16:00:00 GMT</pubDate>
            <content:encoded>
随着生成式 AI 技术的突破，对话式界面变得越来越常见/重要。我们可以用自然语言与计算机交流，而不是像以前那样必须使用鼠标和键盘输入指令，这使得交互更加方便和高效。

但是如果真正开始尝试在常见的应用中引入对话式交互，甚至是用它来替代图形界面（GUI），我们不得不开始思考：对话式界面(CUI)与图形用户界面(GUI) 有什么不同？在当前的技术能力下，到底如何处理两者的关系？

00 尝试用一个表格来对比两者的特点，可以作为日后设计思考的基础和参考。

|          | CUI-对话型界面                                                                                                                                                         | GUI-图形界面                                                                                                                                                                       |
| -------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Term     | Conversational User Interface                                                                                                                                          | Graphic User Interface                                                                                                                                                             |
| 定义     | 用户通过输入文本或语音命令与系统对话，系统以相同的方式回应。特别依赖自然语言处理技术                                                                                   | 用户通过图形和视觉元素与电子设备交互。这包括窗口、图标、按钮、菜单等，用户通过点击、拖拽等方式与设备进行交互。                                                                     |
| 发展历史 | 命令行                                                                                                                                                                 | WIMP（窗口/图标/菜单/指示器）                                                                                                                                                      |
| 核心对象 | message                                                                                                                                                                | visual element                                                                                                                                                                     |
| 基本单位 | 人/角色/群                                                                                                                                                             | 控件                                                                                                                                                                               |
| 内在逻辑 | 时间顺序，语意驱动，快捷方式                                                                                                                                           | 空间关系，结构/分类，因果                                                                                                                                                          |
| 类比     | 🐾 shortcut                                                                                                                                                            | 🗺️ map                                                                                                                                                                             |
| 心理模型 | 人与人对话                                                                                                                                                             | 选中对象 → 施加操作                                                                                                                                                                |
| 局限     | - 以文字为主，表现取决于 NLP 能力&lt;br /&gt;- 缺乏结构和二维空间的映射 &lt;br /&gt;- 遵循时间顺序，回溯、沉淀困难 &lt;br /&gt;- 缺少对结果的预期 &lt;br /&gt;- 缺少交互方式，难以处理复杂任务 | - 容易信息过载且难以压缩 &lt;br /&gt;- 需要区分信息和操作 &lt;br /&gt;- 需要预先定义很多表现和行为 &lt;br /&gt;- 设计不佳容易导致可用性问题 &lt;br /&gt;- 在空间小的设备上受限                             |
| 优势     | - 信息密度大且可用语言压缩 &lt;br /&gt;- 可充分利用 llm 能力 &lt;br /&gt;- 交互更自然灵活，尤其在特定场景例如驾驶&lt;br /&gt;- 容易与设备、界面解耦                                      | - 直观，易理解，用户熟悉 &lt;br /&gt;- 可充分利用二维空间 &lt;br /&gt;- 容易表达空间结构 &lt;br /&gt;- 容易承载多模态信息 &lt;br /&gt;- 可定制程度高 &lt;br /&gt;- 交互能力多样 &lt;br /&gt;- 包容性/Accessablity 较强 |
| 适用场景 | 快速交互和多任务处理的场景，如智能家居控制、车载助手、查询服务等                                                                                                       | 需要展示大量信息和功能，如办公软件、视频编辑、游戏等                                                                                                                               |
| 典型应用 | ChatGPT                                                                                                                                                                | App Store                                                                                                                                                                          |

另外再记录一些有意思的问题：

- 在 llm 能力突破后，CUI 的重要性快速提升，会出现哪些新的设计问题和设计机会？
- CUI 和 GUI 优缺点在哪些情况下会被放大？
- 哪些场景、任务适合 CUI/GUI？
- Agent 应用应该以哪种方式为主？
- 哪种交互方式未来会占据主导？或者会如何融合演进？

如果你有任何想法，欢迎与 00 一起探讨～
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计对抗人工智能：2024 年设计与科技报告]]></title>
            <link>https://tophci.com/posts/240312-design-against-ai</link>
            <guid isPermaLink="true">https://tophci.com/posts/240312-design-against-ai</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[Design]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 11 Mar 2024 16:00:00 GMT</pubDate>
            <content:encoded>
3 月 12 日，科技设计领袖前田约翰（John Maeda）发布了《2024 Design in Tech Report（2024 科技中的设计报告）》。今年的主题是 **Design Against AI（设计对抗人工智能）。**

![youtube cover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/youtube%20cover.jpeg)

有趣的是，2023 年的主题是 Design and Artificial Intelligence (设计与人工智能)。

历次的报告可以在 https://designintech.report/ 网站中查看。

前田约翰（John Maeda）是微软设计和人工智能副总裁。 他是美国的[技术专家](https://en.wikipedia.org/wiki/Computer_technologist)和[设计师](https://en.wikipedia.org/wiki/Designer)，他的作品探索了商业、设计和技术的融合，曾被《福布斯》杂志评为“学术界乔布斯”。

![john-maeda](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/john-maeda.jpg)

在此之前，Maeda 于 2020 年-2022 年担任 [Everbridge](https://en.wikipedia.org/wiki/Everbridge) 的首席技术官。2008 年-2013 年 [任罗得岛设计学院](https://en.wikipedia.org/wiki/Rhode_Island_School_of_Design)院长。[在](https://en.wikipedia.org/wiki/John_Maeda#cite_note-4)此之前，他是[麻省理工学院媒体实验室的研究教授，](https://en.wikipedia.org/wiki/MIT_Media_Lab)领导了计算设计，低代码/无代码和创意商业的进步。他的个人网站是 https://maedastudio.com/。

2024 年的报告，探讨了在当前这个时代，我们对待人工智能的不同态度：抗议、竞争还是合作，以及设计在这个过程中如何发挥作用，特别是在伦理、公平性方面。报告强调了计算能力的理解、工作方式的变化以及设计在塑造关键价值主张方面的角色。

![SCR-20240312-rbgi](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/SCR-20240312-rbgi.png)

主要要点如下：

- 报告提出了一个核心问题：我们应该如何看待人工智能——是反对、竞争还是合作。报告认为，这个问题目前还没有定论。
- 报告分为七个部分，介绍了作者通过将过去的设计与科技报告与 AI 结合进行解读的新方法，并提出了几个关键点，包括**理解计算、工作方式的转变以及设计在确立伦理价值方面的重要性**。
- 讨论了 AI 的不可预测性，以及它在设计过程中的应用，如语音界面的重要性和对话设计的新兴趋势。
- 强调了设计思维的变化，包括经典设计、设计思考和计算设计，并探讨了 AI 对这些领域的影响。
- 分析了远程工作的兴起、疫情对人们的影响以及设计师如何通过设计应对这些挑战。
- 最后，报告呼吁更多关注于与 AI 合作，而非竞争或抗议，并探索 AI 如何帮助实现更公平、包容的设计解决方案。

报告中最为启发 00 的一点是对人机关系的思考。 Maeda 引述了斯坦福数字经济实验室主管 [\*\*Erik Brynjolfsson](https://digitaleconomy.stanford.edu/people/erik-brynjolfsson/)\*\* 的一篇文章，认为我们要去努力寻找和区分这三类任务：

- 只有人类能完成的
- AI 可以帮人类自动完成的
- 人类只有在 AI 帮助下才能更好完成的

![SCR-20240312-rcpp](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/SCR-20240312-rcpp.png)

特别是未来会涌现出一批在 AI 帮助下才能更好完成的任务，这是设计师、人机交互领域的全新机遇。

正如 Maeda 在视频中所说，“对任何自称人工智能专家的人都要有点怀疑，因为在日新月异的东西上很难成为专家。” 处在新时代的开端，设计除了要跟上技术发展的脚步，还需要更加开放和多元，理解计算，但始终为“人”代言。

推荐大家进一步阅读。

报告网站：https://designintech.report/

视频解读：https://www.youtube.com/watch?v=5zFOSQDpby8
</content:encoded>
        </item>
        <item>
            <title><![CDATA[苹果电脑如何使用 Chat with MLX 在本地部署 LLM 实现 RAG]]></title>
            <link>https://tophci.com/posts/240310-chat-with-mlx</link>
            <guid isPermaLink="true">https://tophci.com/posts/240310-chat-with-mlx</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[model]]></category>
            <category><![CDATA[MacOS]]></category>
            <category><![CDATA[RAG]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 09 Mar 2024 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; Chat with your data natively on Apple Silicon using MLX Framework.

先上总结：

1. Chat with MLX 是目前对 M 芯片支持较好的本地 LLM 框架
2. 安装简单，一个命令即可启动
3. 目前支持的开源模型还比较少
4. RAG 任务实现效果不理想（尤其是中文），需要进一步调优

👩🏻‍💻

大概半个月前，英伟达推出 Chat With RTX，可在本地部署开源模型，配置要求至少 8GB 的 RTX 30 或 40 系列显卡。根据以往经验，苹果党可能要等好几个月（乐观了）才有类似的待遇。

不过，已经是 2024 年了，在 AI 加持下，这个等待时间变成了半个月。Chat with MLX-开源的苹果电脑专属大模型框架也出来了。

![https://github.com/qnguyen3/chat-with-mlx](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/chat-with-mlx.png)

https://github.com/qnguyen3/chat-with-mlx

Chat with MLX 是一个开源项目，由 OpenAI 前员工开发，它提供了一个基于 Apple Silicon 硬件的原生聊天界面，利用 MLX 框架来实现与数据的交互。

之前像 Ollama 、LM Studio 等也可以在 Mac 本地部署 LLM，但因为没有对苹果芯片做优化，参数量大一点的模型就跑不起来。 现在有了 MLX，苹果电脑也可以比较轻松地实现本地 RAG 检索。

Chat with MLX 支持的模型包括：

- Google Gemma-7b-it, Gemma-2b-it
- Mistral-7B-Instruct, OpenHermes-2.5-Mistral-7B, NousHermes-2-Mistral-7B-DPO
- Mixtral-8x7B-Instruct-v0.1, Nous-Hermes-2-Mixtral-8x7B-DPO
- Quyen-SE (0.5B), Quyen (4B)
- StableLM 2 Zephyr (1.6B)
- Vistral-7B-Chat, VBD-Llama2-7b-chat, vinallama-7b-chat

## 安装

Chat with MLX 支持 pip 安装，真是省事不少。

建议按照 Github 上面手动安装的命令，新建 python 虚拟环境，并开启科学上网模式，在命令行输入以下命令安装：

```bash
git clone &lt;https://github.com/qnguyen3/chat-with-mlx.git&gt;
cd chat-with-mlx
python -m venv .venv
source .venv/bin/activate
pip install -e .
```

因为我之前已经把 pip 源改成国内的镜像，安装依赖时速度比较快。

这一步没有遇到什么问题，安装成功后，一个命令就可以启动服务。

```bash
chat-with-mlx
```

这时候需要继续科学上网，启动时程序需要用 huggingface_hub 加载文件。 不过不用担心，这一步是自动完成的。联网加载完毕后，会打开本地服务的窗口。

## 使用

![03-SCR-20240305-kknd](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/03-SCR-20240305-kknd.png)

虽然已经部署成功，但这时候还不能正常使用，因为还没有下载模型。

目前可供选择的模型还比较少，我先选了比较小的 google/gemma-2b-it 模型，选择后点界面右侧的“load model”，后台会开始下载模型到本地。

模型就绪以后，可以在面板中的 Dataset 选择文件类型，这里我选择 Files，然后上传了 SD3 的论文。上传好以后，还需要点右侧“Start Indexing”建索引。完成以后，就可以开始跟模型对话了。

![06-SCR-20240306-tnnh](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/06-SCR-20240306-tnnh.png)

先试着让模型总结论文，看起来还行，但好像过于 general，说了等于没说。

![07-SCR-20240307-jzrs](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/07-SCR-20240307-jzrs.png)

换成中文，问一个论文中更具体的问题，就开始摇头了。也许是模型小，能力不足？接下来换成 mistrial-7b 试试。

如果之前没有下载过模型，还是要等待一阵。下载好以后记得点 load model 按钮。

继续用中文提问，回答也是很简短。不过已经是在用 dataset 中的内容在回答了。

![09-SCR-20240306-tntn](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/09-SCR-20240306-tntn.png)

令人头疼的是，模型依然时不时罢工。是不是模型能力和 RAG 参数设置有问题呢？

我试着把论文上传给 Claude，但是文档超过大小。压缩 pdf 大小到 10m 以下再上传，又提示 `Message is 14% over the [length limit](&lt;https://support.anthropic.com/en/articles/7996848-how-large-is-claude-s-context-window&gt;). Try replacing the attached 1 file with smaller excerpts.`。

无奈之下，只好试试 kimi，真是没有对比就没有伤害（莫名其妙成了广告时间）。

![11-SCR-20240307-khcu](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/11-SCR-20240307-khcu.png)

### 结论

看来本地 RAG 还是不太成熟，需要寻找、对比更擅长中文任务的模型，并且要研究什么样的参数更适合。也许问题出在语料的切片和向量化，但是目前还不支持自定义配置。

1. Chat with MLX 是目前对 M 芯片支持较好的本地 LLM 框架
2. 安装简单，一个命令即可启动
3. 目前支持的开源模型还比较少
4. RAG 任务实现效果不理想（尤其是中文），需要进一步调优

结论：**再等等**
</content:encoded>
        </item>
        <item>
            <title><![CDATA[看完 Sora《Video generation models as world simulators》的感受]]></title>
            <link>https://tophci.com/posts/240216-thoughts-about-sora</link>
            <guid isPermaLink="true">https://tophci.com/posts/240216-thoughts-about-sora</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[sora]]></category>
            <category><![CDATA[model]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 15 Feb 2024 16:00:00 GMT</pubDate>
            <content:encoded>
看完 Sora 的各种视频，确实吓到了，赶紧找来 OpenAI 的原文来看看 AI 又进化了多少。

https://openai.com/research/video-generation-models-as-world-simulators

![](https://images.ctfassets.net/kftzwdyauwt9/1d2955dd-9d05-4f33-13073dc9301d/8dc0bae8cb98054d083ab3cc3ade6859/figure-patches.png?w=3840&amp;q=90&amp;fm=webp)

### 1. 这可比 AI 视频大多了

视频效果只是结果，结果的惊艳意味着能力的突破。比视频效果更炸裂的是，模型已经从语意理解（甚是跳过语意理解）跨越到环境理解。

### 2. 环境视频数据是训练智能的捷径（或弯路 from Yann LeCun&apos;s view）

引用一下最关键的一句话：

&gt; scaling video generation models is a promising path towards building general purpose simulators of the physical world.
&gt; 缩放视频生成模型是建立物理世界通用模拟器的一条有前途的道路。

意料之外，情理之中。

人如何构建一个世界？如果用 unity unreal 搭过场景或游戏关卡的 level，就大概能理解 OpenAI 的思路了。

### 3. Transformer 架构的潜力原来还很大

之前还以为 Transformer 架构已经被研究、开发得差不多了，没想到在多模态人家还是潜力股。

Transformer 真的就是个变形金刚，万物皆可转换，可供性比我想象要大多了。

### 4. Sora 是 LLM 和扩散模型最成功的联姻

&gt; At a high level, we turn videos into patches by first compressing videos into a lower-dimensional latent space, and subsequently decomposing the representation into spacetime patches.
&gt; 在高层次上，首先将视频压缩到低维的潜在空间中，然后将表示分解为时空补丁，从而将视频转换为补丁。”

胡乱猜想，「缩放」是不是多模态未来一段时间内的训练范式？

所谓缩放的大致过程：合成数据集 👉 降维成序列 👉 潜空间变换 👉 升维变换（突破输入数据的维度）

### 5. 语言依然是通往智能的捷径

正如 CLIP 模型是文生图的桥梁，连接起语意和图像。Sora 也得益于 DALL·E 3 级别的语意理解。

&gt; 训练文本到视频生成系统需要大量具有相应文本字幕的视频。我们将 DALL·E3 中介绍的 re-captioning 字幕技术应用到视频中。首先训练一个高度描述性的字幕模型，然后使用它为训练集中的所有视频生成文本字幕。我们发现，对高度描述性的视频字幕进行训练可以提高文本保真度和视频的整体质量。

### 6. 大力出奇迹

官方展示的这三段视频对比，清楚展示了基础计算、 4 倍计算、 16 倍计算的云泥之别。

未来依然是 OpenAI 哦不，是英伟达的。

### 7. 还是要探索真正的大问题啊

在 Sora 身上看到了 GPT-2 的影子：发现了一个牛逼、有潜力的架构，然后 10 倍扩大它来验证是否真的的有潜力，于是有了 GPT-3.

令人有点兴奋又害怕的是，Sora 不只是压缩人类尺度的世界，而是压缩所有可能的世界。这个 world 只是 Sora 能够计算模拟的 world 之一，因为是第一个，所以又叫 hello world（？），我们跟 hello kitty 差不多，是个 hello world（？）

向 OpenAI 致敬.
</content:encoded>
        </item>
        <item>
            <title><![CDATA[如何创作 AI 视频？新手创作者微指南]]></title>
            <link>https://tophci.com/posts/240122-ai-video-guide</link>
            <guid isPermaLink="true">https://tophci.com/posts/240122-ai-video-guide</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[视频生成]]></category>
            <category><![CDATA[教程]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 21 Jan 2024 16:00:00 GMT</pubDate>
            <content:encoded>
AI 生成视频，是当下最火热的内容创作和技术话题。根据给定的文本、图像、视频等，AI 能够自动生成符合描述的、高保真的视频内容。

下面是 00 使用 AI 生成的一个短视频《New Vega City》，脚本、图像、视频、配音、字幕全部由 AI 完成。

![1-AI Demo2-red](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-AI%20Demo2-red.PNG)

&lt;center&gt;&lt;small&gt;这个视频也可以在视频号「设计极客 00」查看，欢迎关注 😊&lt;/small&gt;&lt;/center&gt;

AI 生成视频发展太快了，你可能感到不知所措，不知从何入手。受中国 AIGC 产业联盟（AIGCxChina）的邀请，00 尝试做一次比较系统的梳理。这篇文章写给即将开始 AI 视频创作的朋友，所以重点不是视频生成技术的研究，而是介绍 AI 生成视频的基本流程和比较成熟的工具。我会避开需要编程知识的原生工具，帮助大家解答几个问题：

- **有哪些 AI 生成视频的方法和工具？**
- **AI 生成视频目前能力如何？**
- **如果想创作 AI 视频，从哪里开始？**

如果你身边有想用 AI 创作视频的朋友，请分享这篇文章给 ta 吧！

预告文末福利：领取本文的 PDF 版本

![AI 视频封面-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/AI%20%E8%A7%86%E9%A2%91%E5%B0%81%E9%9D%A2-s.jpg)

## 有哪些 AI 生成视频的方法和工具？

视频的本质是什么？是一组连续的动态图像。

在以前，获取动态的图像主要有两种方法：拍摄视频，或者制作 2D 或 3D 动画。在文生图技术大爆发之后，生成图片的质量不错而成本很低，静态图像开始取代部分实景拍摄，成为视频的基础素材。

图片是视频的基础，但这不是本文的重点，现在市面上已经有数不清的 AI 生成图像的工具：Midjourney，Stable Diffusion，DALL-E 3……。有了图片，就可以用剪映、After Effect、 Final Cut 等工具剪辑成视频。不过，直接用图片拼接成视频有一个问题：它太像 PPT 了，我们需要更连贯的动态素材。

于是问题变成：

&gt; 如何让图像动起来？

研究试用了市面上五花八门的 AI 视频工具，00 把它们总结为三种方法：

| 方法             | 原理               | 技术实现         | 典型工具                                                                                                                                                                                                                                    |
| ---------------- | ------------------ | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 叙事图像逐段生成 | 将图片连起来       | 关键帧+补帧      | [Runway Gen2](https://runwayml.com/ai-magic-tools/gen-2/), [Pika](https://pika.art/), [Stable Video Diffusion](https://stability.ai/news/stable-video-diffusion-open-ai-video-model), [VideoPoet](https://sites.research.google/videopoet/) |
| 视频转绘         | 把动态图像变换形态 | 风格迁移         | [Gen1](https://runwayml.com/ai-magic-tools/gen-1/), [DomoAI](discord.gg/domoai), [Kaiber](https://kaiber.ai/), [AnimateDiff](https://github.com/guoyww/AnimateDiff/)                                                                        |
| 运动对象驱动     | 将运动对象转成视频 | 基于动态数据生成 | [HeyGen](https://www.heygen.com/), [Wonder](https://wonderdynamics.com/), [Move.ai](https://www.move.ai/), [Mootion](https://www.mootion.com/), [MagicAnimate](https://github.com/magic-research/magic-animate)                             |

在第三部分我会详细介绍这些方法。

## AI 生成视频目前能力如何？

AI 视频生成技术，依赖于生成视频的 AI 模型，目前主流依然是扩散模型，近期也出现了基于多模态的 VideoPoet。训练视频生成模型的难度很大，瓶颈包括：计算成本高，缺乏高质量的视频和指令数据集，融合自然语言处理+视觉处理+画面合成的技术难度大，等等。文生视频当前还处于起步阶段，随着文生图、图片对话技术的成熟，文生视频将成为多模态大模型下一步发展的重点。

AI 生成视频的难点在哪里？生成并不难，但是我们已经看过太多优质的影视内容，对 AI 视频的预期一开始就很高。可用的视频需具备一定的时长，优良的画面质量，一定的创意逻辑性及还原指令要求能力。接下来让我们看看目前主流的技术能做到什么程度。

### 生成时长

| 模型/产品              | 最长生成时长 | 平均生成所需时间（秒） |
| ---------------------- | ------------ | ---------------------- |
| Runway Gen-2           | 3+4 秒       | 60                     |
| Pika Labs              | 4+4 秒       | 40                     |
| Stable Video Diffusion | 2 ～ 6 秒    | 跟硬件有关             |
| VideoPoet              | 10 秒        | 跟硬件有关             |
| Zero Scope             | 3 秒         | 80                     |

&lt;small&gt;部分数据来自：国盛证券《2023 年人工智能行业专题报告：AI 文生视频，多模态应用的下一站》&lt;/small&gt;

目前，受限于训练资源，这些模型通常只能生成非常短的视频片段（大都为 3 ～ 4 秒）。不过，生成的时长会快速突破，创作者的重点还是在整合分段视频和加强叙事性上面。

### 镜头/运动控制

#### 运镜方法

Runway 和 Pika 提供了推拉摇移等基本的镜头运动控制，并且可以控制运动的幅度。

![Runway Camera Motion](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-runway-motion.png)

#### 运动幅度

上面已经看到 Runway 和 Pika 提供了运动幅度的调整。在 Stable Video Diffusion 中，也有一个可以简单控制运动变化幅度的参数 motion bucket，下面的视频展示了不同 motion bucket 的值如何影响画面变化：

https://www.reddit.com/r/StableDiffusion/comments/183mg95/stable_vide_diffusion_motion_bucket_id_comparison/

### 姿态控制

复杂人物动作的视频生成，非常考验视频模型的帧连续效果及动作理解能力。很容易出现动作不连贯、身体器官重叠/变形/消失等问题。最近有大量的研究旨在解决姿态控制的问题，效果已经非常不错。比较有代表性的研究包括：MagicAnimate 和 AnimateAnyone。

![9-Animate-Anyone](https://github.com/HumanAIGC/AnimateAnyone/blob/main/docs/video_t1.png)

还有很多类似的研究，比如 DreaMoving、MotionCtrl 等，目前还是在研究转化为成熟应用的阶段。比如最近刷屏的通义千问全民舞王，相信很快各大视频平台就会充斥群魔乱舞的小视频了。

### **语意理解**

能否通过 prompt 准确体现创作者的意图，决定了文生视频的天花板。

在近期的研究中，Google 推出的 VideoPoet 体现了较强的语意理解能力，无需特定数据便可生成视频。只要为输入的图像增加文字描述，就可以添加动态效果。还可以修改提示来调整画面来达到预期的效果。

![12-VideoPoet2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/12-VideoPoet2.gif)

厉害的是，VideoPoet 一次能够生成 10 秒的视频，而且动作幅度较大，连贯性好，碾压 Gen-2 仅有小幅动作的视频生成。（哦，VideoPoet 是个多模态模型，它还能生成音频 🙇‍♀️）不过 VideoPoet 目前还没有开放，大家还得再等一等。

### **连续性**

现在 AI 生成视频的工具大多数一次只能生成 3 ～ 4 秒的视频，然后可以基于生成视频再延长 4 秒。这就对视频的连续性和一致性提出了要求。Runway 在延长视频时，容易出现后续动作变化不自然且幅度小、脸部变形等情况，Pika 则更为连贯顺畅一些。

如果视频里面有多个人物或者主体，就更是考验 AI 视频模型处理复杂场景的能力及细微语言的理解能力，否则画面很容易变成一锅粥。

### **局部修改/**视频编辑

Runway 很早就提供了视频智能编辑的系列功能，包括移除背景、抠图、运动跟踪等等。

![16-runway-video edit](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/16-runway-video%20edit.jpeg)

最近 Runway 不断更新局部修改的功能 Motion Brush，能够结合镜头运动和文字 prompt 来控制画面。Pika 也提供了局部修改和修改视频尺寸的功能，非常智能。

## 如果想创作 AI 视频，从哪里开始？

在开始之前，不妨问自己一个问题：

&gt; 我有没有明确要表达的主旨/议题/观点？

如果没有，就把自己当成一个艺术家，尝试 AI 这种最新的“艺术材料”能做什么。

如果有，那么你可以更有意识地构思整个创作流程。下一个问题可以问自己：

&gt; 这个视频的目标是什么？是对哪一个人群做到 A.营造氛围，B.传递信息，C.影响说服，D.…？

目前 AI 生成视频还在早期阶段，生成的内容比较随机、难以控制，但是能够快速地构建一个风格化的场景，尤其是现实中不存在的场景，这会更加考验创作者“讲故事”的能力。

在目标相对清晰以后，我们可以进入动手创作的阶段。这时候的关键问题是：

&gt; 视频的内容形态是什么？——讲故事？动态影像？人物口播？运动捕捉？……

00 整理出几种 AI 生成视频的方式，下面详细讲解一下这几种方式的大致创作思路。

| 方法             | 原理               | 技术实现         | 典型工具                                                                                                                                                                                                                                    |
| ---------------- | ------------------ | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 叙事图像逐段生成 | 将图片连起来       | 关键帧+补帧      | [Runway Gen2](https://runwayml.com/ai-magic-tools/gen-2/), [Pika](https://pika.art/), [Stable Video Diffusion](https://stability.ai/news/stable-video-diffusion-open-ai-video-model), [VideoPoet](https://sites.research.google/videopoet/) |
| 视频转绘         | 把动态图像变换形态 | 风格迁移         | [Gen1](https://runwayml.com/ai-magic-tools/gen-1/), [DomoAI](discord.gg/domoai), [Kaiber](https://kaiber.ai/), [AnimateDiff](https://github.com/guoyww/AnimateDiff/)                                                                        |
| 运动对象驱动     | 将运动对象转成视频 | 基于动态数据生成 | [HeyGen](https://www.heygen.com/), [Wonder](https://wonderdynamics.com/), [Move.ai](https://www.move.ai/), [Mootion](https://www.mootion.com/), [MagicAnimate](https://github.com/magic-research/magic-animate)                             |

### 一、叙事图像逐段生成

叙事性生成，其实就是“讲好一个故事”。皮克斯每一部动画都深入人心，除了人物形象立体丰富、制作精良、技术出众，更为关键的是它把大量精力投入到了“讲好故事”上面，才有了一个又一个老少皆宜、经久不衰的经典。

#### **1.确定角色、场景、叙事线索，即故事脚本**

想要讲好一个故事，不能一上来就开始用 AI 出图，而是构思整个故事。故事脚本这个环节，不是 AI 视频技术的范围，但我们依然可以借助 AI 的能力。比如 00 在创作《New Vega City》的时候，用到了视频脚本 [GPTs Video Script](https://chat.openai.com/g/g-lCvGmYhGL-video-script)，帮助我快速生成一个关于火星城市的宣传短片的脚本。

![21-视频脚本 gpts](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/21-%E8%A7%86%E9%A2%91%E8%84%9A%E6%9C%AC%20gpts.png)

#### **2.整理分镜，生成各镜头的画面**

有了满意的脚本以后，接下来要把抽象的概念转换成具体的图像画面，然后给到 AI 生成图像和视频。在传统的影视动画制作中，这一步往往需要制作“故事板”，也就是艺术家把一个一个镜头里面的场景和人物用草稿描绘出来，再不断修改优化，最后拍摄出来。

我们可能没有制作经验和绘制草图的技术，这时候还是请 AI 来帮忙。大家可以搜索并找一些描述画面提示词的工具，比如词图 AI 的组词工具，或者文生图提示词的 GPTs，让 AI 把故事脚本中的场景描述成具体的图像 prompt。

有了画面描述以后，就可以开始用文生图工具，比如 Stable Diffusion，Midjourney 等生成每一个场景的静态图像了。当然，Runway 和 Pika 等视频工具也提供了文生图的功能，可以直接在里面生成，不过它们并不是很擅长图像生成，如果想获得更好、更可控的图像，还是推荐用专门的文生图工具。这些是我用 Stable Diffusion 生成的部分视频关键帧。

![23-vega-image](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/23-vega-image.jpeg)

#### **3.生成视频片段，组织画面**

有了关键帧画面以后，要让它们“动起来”。这回终于轮到 AI 视频工具上场了。

在 Runway、Pika 等工具中，重点是把图片变成“镜头”。最常用的让图片动起来的方法有两种：

- 镜头本身的运动：画面的主体内容不动，只是改变镜头的运动。（**友情提示**：如果只需要实现简单的镜头运动，更简单的办法是移动图片，比如在 PPT 里让图片淡入淡出，或者在视频编辑工具里面让图片实现各种变形或运动。）

  ![25-runway-motion-explain](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/25-runway-motion-explain.png)

- 画面元素的运动：选定画面的某些部分，并设置如何运动。可以通过 prompt 调整，不过效果一般都不太好，更常见的方式是设置修改区域（Runway 最近支持一个画面设置 5 个区域），然后指定运动方式。这是 AI 生成视频工具的核心功能，具体的操作可以查看软件的官方教程。

这里需要提醒一下费用问题。 Runway 生成 1 秒视频需要 5 个 credit，每个月有 125 个免费 credit，智能生成 25 秒，用完需要充值，\$12/月 可以生成 125 秒的视频。 Pika 10 个 credit 可以生成 3 秒视频，每天有 30 个免费 credit，充值 \$8/月 可以生成 210 秒的视频。

有了每一个场景的视频片段，接下来要完成叙事的部分。我们需要用剪辑工具（剪映/必剪/After Effect/Premiere/iMovie）把这些只有几秒的片段衔接起来。如果之前的脚本写得好，并且场景画面的风格、人物比较一致，在衔接的时候就轻松很多。这个环节主要处理情节连贯性、主体一致性等问题，让画面节奏更加流畅。

### 二、视频转绘

第二种生成视频的方式要轻松不少，因为视频是现成的，省去了我们构思故事、脚本、场景、画面的工作，核心是把原有视频转绘成另外一种风格。能完成转绘的工具就更多了，这里主要介绍 2 个。

#### Runway Gen-1

上面我们已经了解过 Runway 的 Gen-2，它提供了强大的文生视频的能力。而 Gen-1 是更早推出的功能，它主攻的就是风格转绘。

#### DomoAI

DomoAI 凭借出色的画面稳定性赢得了大批用户，尤其在动漫风格上面表现突出。不过目前还只有 [discord 渠道](discord.gg/domoai) 可以使用。

&lt;blockquote class=&quot;instagram-media&quot; data-instgrm-captioned data-instgrm-permalink=&quot;https://www.instagram.com/reel/C0wP8Z1pznq/?utm_source=ig_embed&amp;amp;utm_campaign=loading&quot; data-instgrm-version=&quot;14&quot; style=&quot; background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:400px; min-width:300px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);&quot;&gt;&lt;div style=&quot;padding:16px;&quot;&gt; &lt;a href=&quot;https://www.instagram.com/reel/C0wP8Z1pznq/?utm_source=ig_embed&amp;amp;utm_campaign=loading&quot; style=&quot; background:#FFFFFF; line-height:0; padding:0 0; text-align:center; text-decoration:none; width:100%;&quot; target=&quot;_blank&quot;&gt; &lt;div style=&quot; display: flex; flex-direction: row; align-items: center;&quot;&gt; &lt;div style=&quot;background-color: #F4F4F4; border-radius: 50%; flex-grow: 0; height: 40px; margin-right: 14px; width: 40px;&quot;&gt;&lt;/div&gt; &lt;div style=&quot;display: flex; flex-direction: column; flex-grow: 1; justify-content: center;&quot;&gt; &lt;div style=&quot; background-color: #F4F4F4; border-radius: 4px; flex-grow: 0; height: 14px; margin-bottom: 6px; width: 100px;&quot;&gt;&lt;/div&gt; &lt;div style=&quot; background-color: #F4F4F4; border-radius: 4px; flex-grow: 0; height: 14px; width: 60px;&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div style=&quot;padding: 19% 0;&quot;&gt;&lt;/div&gt; &lt;div style=&quot;display:block; height:50px; margin:0 auto 12px; width:50px;&quot;&gt;&lt;svg width=&quot;50px&quot; height=&quot;50px&quot; viewBox=&quot;0 0 60 60&quot; version=&quot;1.1&quot; xmlns=&quot;https://www.w3.org/2000/svg&quot; xmlns:xlink=&quot;https://www.w3.org/1999/xlink&quot;&gt;&lt;g stroke=&quot;none&quot; stroke-width=&quot;1&quot; fill=&quot;none&quot; fill-rule=&quot;evenodd&quot;&gt;&lt;g transform=&quot;translate(-511.000000, -20.000000)&quot; fill=&quot;#000000&quot;&gt;&lt;g&gt;&lt;path d=&quot;M556.869,30.41 C554.814,30.41 553.148,32.076 553.148,34.131 C553.148,36.186 554.814,37.852 556.869,37.852 C558.924,37.852 560.59,36.186 560.59,34.131 C560.59,32.076 558.924,30.41 556.869,30.41 M541,60.657 C535.114,60.657 530.342,55.887 530.342,50 C530.342,44.114 535.114,39.342 541,39.342 C546.887,39.342 551.658,44.114 551.658,50 C551.658,55.887 546.887,60.657 541,60.657 M541,33.886 C532.1,33.886 524.886,41.1 524.886,50 C524.886,58.899 532.1,66.113 541,66.113 C549.9,66.113 557.115,58.899 557.115,50 C557.115,41.1 549.9,33.886 541,33.886 M565.378,62.101 C565.244,65.022 564.756,66.606 564.346,67.663 C563.803,69.06 563.154,70.057 562.106,71.106 C561.058,72.155 560.06,72.803 558.662,73.347 C557.607,73.757 556.021,74.244 553.102,74.378 C549.944,74.521 548.997,74.552 541,74.552 C533.003,74.552 532.056,74.521 528.898,74.378 C525.979,74.244 524.393,73.757 523.338,73.347 C521.94,72.803 520.942,72.155 519.894,71.106 C518.846,70.057 518.197,69.06 517.654,67.663 C517.244,66.606 516.755,65.022 516.623,62.101 C516.479,58.943 516.448,57.996 516.448,50 C516.448,42.003 516.479,41.056 516.623,37.899 C516.755,34.978 517.244,33.391 517.654,32.338 C518.197,30.938 518.846,29.942 519.894,28.894 C520.942,27.846 521.94,27.196 523.338,26.654 C524.393,26.244 525.979,25.756 528.898,25.623 C532.057,25.479 533.004,25.448 541,25.448 C548.997,25.448 549.943,25.479 553.102,25.623 C556.021,25.756 557.607,26.244 558.662,26.654 C560.06,27.196 561.058,27.846 562.106,28.894 C563.154,29.942 563.803,30.938 564.346,32.338 C564.756,33.391 565.244,34.978 565.378,37.899 C565.522,41.056 565.552,42.003 565.552,50 C565.552,57.996 565.522,58.943 565.378,62.101 M570.82,37.631 C570.674,34.438 570.167,32.258 569.425,30.349 C568.659,28.377 567.633,26.702 565.965,25.035 C564.297,23.368 562.623,22.342 560.652,21.575 C558.743,20.834 556.562,20.326 553.369,20.18 C550.169,20.033 549.148,20 541,20 C532.853,20 531.831,20.033 528.631,20.18 C525.438,20.326 523.257,20.834 521.349,21.575 C519.376,22.342 517.703,23.368 516.035,25.035 C514.368,26.702 513.342,28.377 512.574,30.349 C511.834,32.258 511.326,34.438 511.181,37.631 C511.035,40.831 511,41.851 511,50 C511,58.147 511.035,59.17 511.181,62.369 C511.326,65.562 511.834,67.743 512.574,69.651 C513.342,71.625 514.368,73.296 516.035,74.965 C517.703,76.634 519.376,77.658 521.349,78.425 C523.257,79.167 525.438,79.673 528.631,79.82 C531.831,79.965 532.853,80.001 541,80.001 C549.148,80.001 550.169,79.965 553.369,79.82 C556.562,79.673 558.743,79.167 560.652,78.425 C562.623,77.658 564.297,76.634 565.965,74.965 C567.633,73.296 568.659,71.625 569.425,69.651 C570.167,67.743 570.674,65.562 570.82,62.369 C570.966,59.17 571,58.147 571,50 C571,41.851 570.966,40.831 570.82,37.631&quot;&gt;&lt;/path&gt;&lt;/g&gt;&lt;/g&gt;&lt;/g&gt;&lt;/svg&gt;&lt;/div&gt;&lt;div style=&quot;padding-top: 8px;&quot;&gt; &lt;div style=&quot; color:#3897f0; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:550; line-height:18px;&quot;&gt;View this post on Instagram&lt;/div&gt;&lt;/div&gt;&lt;div style=&quot;padding: 12.5% 0;&quot;&gt;&lt;/div&gt; &lt;div style=&quot;display: flex; flex-direction: row; margin-bottom: 14px; align-items: center;&quot;&gt;&lt;div&gt; &lt;div style=&quot;background-color: #F4F4F4; border-radius: 50%; height: 12.5px; width: 12.5px; transform: translateX(0px) translateY(7px);&quot;&gt;&lt;/div&gt; &lt;div style=&quot;background-color: #F4F4F4; height: 12.5px; transform: rotate(-45deg) translateX(3px) translateY(1px); width: 12.5px; flex-grow: 0; margin-right: 14px; margin-left: 2px;&quot;&gt;&lt;/div&gt; &lt;div style=&quot;background-color: #F4F4F4; border-radius: 50%; height: 12.5px; width: 12.5px; transform: translateX(9px) translateY(-18px);&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;div style=&quot;margin-left: 8px;&quot;&gt; &lt;div style=&quot; background-color: #F4F4F4; border-radius: 50%; flex-grow: 0; height: 20px; width: 20px;&quot;&gt;&lt;/div&gt; &lt;div style=&quot; width: 0; height: 0; border-top: 2px solid transparent; border-left: 6px solid #f4f4f4; border-bottom: 2px solid transparent; transform: translateX(16px) translateY(-4px) rotate(30deg)&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;div style=&quot;margin-left: auto;&quot;&gt; &lt;div style=&quot; width: 0px; border-top: 8px solid #F4F4F4; border-right: 8px solid transparent; transform: translateY(16px);&quot;&gt;&lt;/div&gt; &lt;div style=&quot; background-color: #F4F4F4; flex-grow: 0; height: 12px; width: 16px; transform: translateY(-4px);&quot;&gt;&lt;/div&gt; &lt;div style=&quot; width: 0; height: 0; border-top: 8px solid #F4F4F4; border-left: 8px solid transparent; transform: translateY(-4px) translateX(8px);&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt; &lt;div style=&quot;display: flex; flex-direction: column; flex-grow: 1; justify-content: center; margin-bottom: 24px;&quot;&gt; &lt;div style=&quot; background-color: #F4F4F4; border-radius: 4px; flex-grow: 0; height: 14px; margin-bottom: 6px; width: 224px;&quot;&gt;&lt;/div&gt; &lt;div style=&quot; background-color: #F4F4F4; border-radius: 4px; flex-grow: 0; height: 14px; width: 144px;&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/a&gt;&lt;p style=&quot; color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; line-height:17px; margin-bottom:0; margin-top:8px; overflow:hidden; padding:8px 0 7px; text-align:center; text-overflow:ellipsis; white-space:nowrap;&quot;&gt;&lt;a href=&quot;https://www.instagram.com/reel/C0wP8Z1pznq/?utm_source=ig_embed&amp;amp;utm_campaign=loading&quot; style=&quot; color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none;&quot; target=&quot;_blank&quot;&gt;A post shared by DomoAI (@domoai_official)&lt;/a&gt;&lt;/p&gt;&lt;/div&gt;&lt;/blockquote&gt; &lt;script async src=&quot;//www.instagram.com/embed.js&quot;&gt;&lt;/script&gt;

### 三、运动对象生成

这一类视频的重点不是”讲故事“，而是人或运动物体的“表演”。

#### 数字人/人脸驱动

“数字人”的概念我们并不陌生，这类视频的主体非常明确：一个人物形象，可以是真人录制，也可以是建模出来的完全虚拟形象。让人物或虚拟形象说话，就完成了 AI 视频的制作，目前这种技术已经广泛用在直播间、智能客服、数字员工等领域。

去年 10 月，美国著名歌手 Taylor Swift 在一个节目中受访的片段引起热议。视频中莓莓用流利的中文回答问题，无论是发音还是口型都非常标准。视频一发布就爆火，后来大家才知道这是用 [HeyGen](https://www.heygen.com/) 完成的。

https://twitter.com/Gorden_Sun/status/1716075577117929841

Heygen 是一个功能全面、效果很好的 AI 虚拟人应用，以 AI 虚拟人形象和声音克隆两大技术作为基础，支持一键换衣、虚拟主播、文本转声音等各种操作。类似的工具还有 [D-ID](https://www.d-id.com/)、[Synthesia](https://www.synthesia.io/) 等，都能快速将人物图片转成会说话的视频，口播类的场景非常适合。

#### 运动驱动

只是让人动嘴讲话，还是不能满足我们在更多场景的需求。能不能让人整个动起来呢？能不能让动物、机器人之类的其他物体动起来呢？

当然可以，这就是另外一类 AI 可以生成的视频——基于运动对象来生成，并且可以做到实时生成。这背后是已经发展多年的运动捕捉技术.在 AI 的加持下，运动捕捉已经已经达到非常高的精度，并且解决了文生视频难以处理的画面抖动、主体不一致的问题。这是 00 最看好的能在影视动画广泛商用的技术。

[Wonder Studio](https://wonderdynamics.com/) 和 [Move.ai](http://Move.ai) 都是这个领域不错的工具，但是使用时最好配合 3D 建模软件来调整角色，有一定的使用门槛。

### 后期（画面/配音/字幕）

前面我们总结了各种 AI 生成动态视频的方法。如果顺利，你会得到很多动态的视频素材，接下来是最后一个环节：后期制作。

一个完整的视频，并不是只有动态的画面，它还需要调节画面的质量、颜色，需要加入让人更加有代入感的背景音乐、音效和旁白，以及方便观看和理解的字幕等等。

这其中也涉及到非常多传统影视制作的工序，未来也会涌现很多 AI 驱动的工具，有机会再跟大家逐一分享。

## 小结

这一期的内容还真不少，相信你看完以后，对如何用 AI 生成视频已经有更加全局和深入的了解：

- AI 生成视频有三种常见方法：叙事图像逐段生成，视频转绘，运动对象驱动。
- AI 目前生成视频的时长比较短，可以简单控制镜头的运动和修改画面局部内容，但模型在语意理解和一致性方面还有很大提升空间。
- 创作叙事类 AI 视频，有故事脚本、分镜、分段生成图像、叙事优化、后期这几个环节，也介绍了对应的工具。

相信你已经跃跃欲试，想把脑海中的想法变成精彩的画面了。如果你身边有想用 AI 创作视频的朋友，也请分享这篇文章给 ta 吧 🎬！

AI 时代，工具极大赋能创作者，每个人都有机会更好地展现自己的创意。AI 生成视频的大门正在向你我开启，期待见到你的作品！

## **福利**

微信文章点击链接不方便，00 制作了指南的 PDF 版本，可以下载保存，内含 AI 视频工具链接，可直达访问。

![AI 视频封面-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/AI%20%E8%A7%86%E9%A2%91%E5%B0%81%E9%9D%A2-s.jpg)

领取方式：关注 公众号「设计极客 00」，后台回复“**视频指南**”，即可获得下载链接。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[零反思一则]]></title>
            <link>https://tophci.com/posts/240118-zero-reflection</link>
            <guid isPermaLink="true">https://tophci.com/posts/240118-zero-reflection</guid>
            <category><![CDATA[零反思]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 17 Jan 2024 16:00:00 GMT</pubDate>
            <content:encoded>
![240118-zero-reflection](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/240118-zero-reflection.png)

語言模型的應用痛點是不准確，難以端到端輸出。

擴散模型的應用痛點是半成品，只有影像形不成閉環，无法交付。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[面向开发者的 LLM 入门教程-笔记和代码]]></title>
            <link>https://tophci.com/posts/240116-prompt-engineering-for-developers</link>
            <guid isPermaLink="true">https://tophci.com/posts/240116-prompt-engineering-for-developers</guid>
            <category><![CDATA[prompt]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[笔记]]></category>
            <category><![CDATA[code]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 15 Jan 2024 16:00:00 GMT</pubDate>
            <content:encoded>
本文是 DLAI 课程 [ChatGPT Prompt Engineering for Developers](https://learn.deeplearning.ai/chatgpt-prompt-eng/lesson/1/introduction) 的笔记。这门课面向入门 LLM 的开发者，深入浅出地介绍了如何构造 Prompt 并基于 OpenAI 提供的 API 实现包括总结、推断、转换等功能，是入门 LLM 开发的经典教程。

Prompt（提示），最初是 NLP 研究者为下游任务而设计的一种任务输入形式或模板，在 ChatGPT 的影响下，Prompt 成为与 LLM 交互输入的代称。一般我们把给大模型的输入称为 Prompt，将大模型返回的输出称为 Completion。一个合理的 Prompt 设计极大地决定了 LLM 能力的上限与下限。

&gt; Prompt Engineering，是针对特定任务构造能充分发挥大模型能力的 Prompt 的技巧。

对于开发人员，LLM 更强大的功能是能通过 API 接口调用，从而快速构建软件应用程序。课程中有很多代码的实操，推荐大家使用 Google colab 来实现，免去本地环境的配置。代码运行的结果，可以查看 00 的 colab notebook：

https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing

## **Lesson 1.提示词原则**

提示词设计的两个关键原则：编写清晰、具体的指令，以及给模型充足思考时间。

### **原则一：编写清晰、具体的指令**

Prompt 需要清晰明确地表达需求，提供充足上下文，使语言模型准确理解我们的意图，就像向一个外星人详细解释人类世界一样。过于简略的 Prompt 往往使模型难以把握所要完成的具体任务。

1. **使用分隔符清晰地表示输入的不同部分**

   可以选择用不同符号做分隔符，只要能明确起到隔断作用即可。

   ````markdown
   # 需要总结的文本内容

   text = f&quot;&quot;&quot;
   您应该提供尽可能清晰、具体的指示，以表达您希望模型执行的任务。\\
   这将引导模型朝向所需的输出，并降低收到无关或不正确响应的可能性。\\
   不要将写清晰的提示词与写简短的提示词混淆。\\
   在许多情况下，更长的提示词可以为模型提供更多的清晰度和上下文信息，从而导致更详细和相关的输出。
   &quot;&quot;&quot;

   # 指令：使用 ``` 来分隔指令和待总结的内容

   prompt = f&quot;&quot;&quot;
   把用三个反引号括起来的文本总结成一句话。
   `{text}`
   &quot;&quot;&quot;

   response = get_completion(prompt)
   print(response)
   ````

   [查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

2. **结构化输出**

   按照某种格式组织的内容，例如 JSON、HTML 等。这种输出非常适合在代码中进一步解析和处理。

   ```python
   prompt = f&quot;&quot;&quot;
   请生成包括书名、作者、出版年份和类别的三本真实存在的中文书籍清单，\\
   并以 JSON 格式提供，包含以下键:book_id、title、year、author、genre。
   &quot;&quot;&quot;
   response = get_completion(prompt)
   print(response)
   ```

   [查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

3. **要求模型检查是否满足条件**

   如果任务包含不一定能满足的条件，可以告诉模型先检查这些条件，如果不满足，就指出并停止执行后续的完整流程。

   ```python
   prompt = f&quot;&quot;&quot;
   您将获得由三个引号括起来的文本。如果它包含一系列的指令，则需要按照以下格式重新编写这些指令：

   第一步 - ...
   第二步 - …
   …
   第N步 - …

   如果文本中不包含一系列的指令，则直接写“未提供步骤”。&quot;
   \\&quot;\\&quot;\\&quot;{text_2}\\&quot;\\&quot;\\&quot;
   &quot;&quot;&quot;
   ```

   [输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

4. **提供少量示例**

   在要求模型执行实际任务之前，给出一两个已完成的样例，让模型了解期望的输出样式。

### **原则二：给模型充足思考时间**

语言模型与人类一样，需要时间来思考并解决复杂问题。如果匆忙给出结论，结果很可能不准确。因此 Prompt 应加入逐步推理的要求，给模型留出充分思考时间，可以要求其先列出对问题的各种看法，说明推理依据，然后再得出最终结论。

1. **指定完成任务所需的步骤**

   ```python
   text = f&quot;&quot;&quot;
   李琪，爱荷华州立大学计算机科学系助理教授，她于2017年取得纽约州立大学布法罗分校计算机科学与工程系博士学位；于2012年取得伊利诺伊大学香槟分校统计学硕士学位；于2010年取得西安电子科技大学信息与计算科学学士学位。她的研究兴趣为数据管理、数据挖掘和机器学习。
   彭楠赟，现任加州大学洛杉矶分校计算机科学系助理教授。她于2012年在北京大学获得学士和硕士学位，于2017年获约翰·霍普金斯大学计算机科学博士学位。她的研究方向为低资源信息提取、语言生成和跨语言迁移。
   Qianqian Wang，康纳尔大学计算机科学专业博士四年级，此前在浙江大学获得学士学位，研究方向是3D 计算机视觉、计算机图形学和机器学习的交叉领域。
   陈师哲， INRIA Paris 的一名博士后研究员。她分别于2020年和2015年在中国人民大学获得博士和学士学位，2018年访问了卡内基梅隆大学，2019 年访问了阿德莱德大学，2019年在 MSRA 工作。她在2017年获得百度奖学金，2020年获得北京市优秀毕业生奖。她的研究兴趣是具身智能、视觉与语言、多模态深度学习。
   李爽，目前是麻省理工学院电气工程与计算机科学专业的一名五年级博士生，她的研究兴趣是人工智能，包括计算机视觉、自然语言处理、决策和机器学习。
   Xin Lu，现任Adobe 的高级工程经理，于2015年获得美国宾夕法尼亚州立大学的博士学位。她的研究涵盖从端到端 AI/ML 研发到软件开发、分析、开发运营、新计划和现有业务线的产品开发和管理。 此外，她还在顶级的计算机视觉和机器学习领域发表了 30 多篇论文，并拥有超过 35 项美国专利。
   刘伊凡，现任苏黎世联邦理工大学讲师，阿德莱德大学客座助理教授。于2018年获得北航自动化学院硕士学位，2021年获得阿德莱德大学计算机科学学院博士学位。研究领域主要包含深度学习、开放世界感知。
   &quot;&quot;&quot;

   prompt_2 = f&quot;&quot;&quot;
   1-用一句话概括下面用&lt;&gt;括起来的文本。2-将摘要翻译成英语。3-在英语摘要中列出每个名称。4-输出一个 JSON 对象，其中包含以下键：English_summary，num_names。请使用以下格式：文本：&lt;要总结的文本&gt;摘要：&lt;摘要&gt;翻译：&lt;摘要的翻译&gt;名称：&lt;英语摘要中的名称列表&gt;输出 JSON：&lt;带有 English_summary 和 num_names 的 JSON&gt;Text: &lt;{text}&gt;
   &quot;&quot;&quot;
   response = get_completion(prompt_2)
   print(&quot;\\nprompt 2:&quot;)
   print(response)
   ```

   [在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

2. **让模型在下结论之前给出自己的解法**

## **Lesson 2. 迭代优化**

在开发大语言模型应用时，很难通过第一次尝试就得到完美适用的 Prompt。关键是要有一个良好的迭代优化过程，不断改进 Prompt。

```markdown
# 示例：产品说明书

fact_sheet_chair = &quot;&quot;&quot;
概述

    美丽的中世纪风格办公家具系列的一部分，包括文件柜、办公桌、书柜、会议桌等。
    多种外壳颜色和底座涂层可选。
    可选塑料前后靠背装饰（SWC-100）或10种面料和6种皮革的全面装饰（SWC-110）。
    底座涂层选项为：不锈钢、哑光黑色、光泽白色或铬。
    椅子可带或不带扶手。
    适用于家庭或商业场所。
    符合合同使用资格。

结构

    五个轮子的塑料涂层铝底座。
    气动椅子调节，方便升降。

尺寸

    宽度53厘米|20.87英寸
    深度51厘米|20.08英寸
    高度80厘米|31.50英寸
    座椅高度44厘米|17.32英寸
    座椅深度41厘米|16.14英寸

选项

    软地板或硬地板滚轮选项。
    两种座椅泡沫密度可选：中等（1.8磅/立方英尺）或高（2.8磅/立方英尺）。
    无扶手或8个位置PU扶手。

材料
外壳底座滑动件

    改性尼龙PA6/PA66涂层的铸铝。
    外壳厚度：10毫米。
    座椅
    HD36泡沫

原产国

    意大利

&quot;&quot;&quot;
```

| **轮次** | **Prompt**                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | **目的**                           |
| -------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------- |
| 初始     | 您的任务是帮助营销团队基于技术说明书创建一个产品的营销描述。根据标记的技术说明书中提供的信息，编写一个产品描述。技术规格： \{fact_sheet_chair\}                                                                                                                                                                                                                                                                                                                               |                                    |
| 迭代 1   | 您的任务是帮助营销团队基于技术说明书创建一个产品的零售网站描述。根据标记的技术说明书中提供的信息，编写一个产品描述。使用最多 50 个词。技术规格： \{fact_sheet_chair\}                                                                                                                                                                                                                                                                                                         | 添加长度限制，生成更简洁的文案     |
| 迭代 2   | 您的任务是帮助营销团队基于技术说明书创建一个产品的零售网站描述。根据标记的技术说明书中提供的信息，编写一个产品描述。该描述面向家具零售商，因此应具有技术性质，并侧重于产品的材料构造。使用最多 50 个单词。技术规格： \{fact_sheet_chair\}                                                                                                                                                                                                                                     | 说明受众，应具有什么性质以及侧重点 |
| 迭代 3   | 您的任务是帮助营销团队基于技术说明书创建一个产品的零售网站描述。根据```标记的技术说明书中提供的信息，编写一个产品描述。该描述面向家具零售商，因此应具有技术性质，并侧重于产品的材料构造。在描述末尾，包括技术规格中每个 7 个字符的产品 ID。使用最多 50 个单词。技术规格： \{fact_sheet_chair\}                                                                                                                                                                                | 要求在描述的结尾，给出产品 ID      |
| 迭代 4   | 您的任务是帮助营销团队基于技术说明书创建一个产品的零售网站描述。根据```标记的技术说明书中提供的信息，编写一个产品描述。该描述面向家具零售商，因此应具有技术性质，并侧重于产品的材料构造。在描述末尾，包括技术规格中每个 7 个字符的产品 ID。在描述之后，包括一个表格，提供产品的尺寸。表格应该有两列。第一列包括尺寸的名称。第二列只包括英寸的测量值。给表格命名为“产品尺寸”。将所有内容格式化为可用于网站的 HTML 格式。将描述放在&lt;div&gt;元素中。技术规格： \{fact_sheet_chair\} | 提取产品尺寸信息并组织成表格       |

````python
prompt = f&quot;&quot;&quot;
您的任务是帮助营销团队基于技术说明书创建一个产品的零售网站描述。

根据```标记的技术说明书中提供的信息，编写一个产品描述。

该描述面向家具零售商，因此应具有技术性质，并侧重于产品的材料构造。

在描述末尾，包括技术规格中每个7个字符的产品ID。

在描述之后，包括一个表格，提供产品的尺寸。表格应该有两列。第一列包括尺寸的名称。第二列只包括英寸的测量值。

给表格命名为“产品尺寸”。

将所有内容格式化为 Markdown 格式。将描述放在&lt;div&gt;元素中。

技术规格：```{fact_sheet_chair}```
&quot;&quot;&quot;

response = get_completion(prompt)
print(response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

## **Lesson 3. 文本概括**

LLM 文本摘要功能的优势可以为你节省时间、提高效率，以及精准获取信息。

### **单一文本概括**

任务：商品评论总结

```python
prod_review = &quot;&quot;&quot;
这个熊猫公仔是我给女儿的生日礼物，她很喜欢，去哪都带着。
公仔很软，超级可爱，面部表情也很和善。但是相比于价钱来说，
它有点小，我感觉在别的地方用同样的价钱能买到更大的。
快递比预期提前了一天到货，所以在送给女儿之前，我自己玩了会。
&quot;&quot;&quot;
```

**限制输出文本长度**

````python
  prompt = f&quot;&quot;&quot;
  您的任务是从电子商务网站上生成一个产品评论的简短摘要。

  请概括三个反引号之间的评论，最多30个字。

  评论: ```{prod_review}```
  &quot;&quot;&quot;

  response = get_completion(prompt)
  print(response)
````

注：模型在计算和判断文本长度时依赖于分词器，统计字符时并不精确。

**设置侧重点**

````python
  prompt = f&quot;&quot;&quot;
  您的任务是从电子商务网站上生成一个产品评论的简短摘要。

  请概括三个反引号之间的评论，最多30个词汇，并且侧重在产品价格和质量上。

  评论: ```{prod_review}```
  &quot;&quot;&quot;

  response = get_completion(prompt)
  print(response)
````

**关键信息提取**

````
在 Prompt 中设置侧重点 ，可以让摘要更聚焦，然而结果中也会保留其他信息。如果只想提取某些信息，并过滤掉其他所有信息，可以要求 LLM 进行文本提取（Extract） 而非概括( Summarize )。
  prompt = f&quot;&quot;&quot;
  您的任务是从电子商务网站上的产品评论中提取相关信息。

  请从以下三个反引号之间的评论中提取产品运输的信息，最多30个词汇。

  评论: ```{prod_review}```
  &quot;&quot;&quot;

  response = get_completion(prompt)
  print(response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

### **多条文本概括**

将多条用户评价集合在一个列表中，并利用 `for` 循环和文本概括提示词，将评价概括至小于 20 个词以下，并按顺序打印。

````python
review_1 = prod_review

# 一盏落地灯的评论
review_2 = &quot;&quot;&quot;
我需要一盏漂亮的卧室灯，这款灯不仅具备额外的储物功能，价格也并不算太高。
收货速度非常快，仅用了两天的时间就送到了。
不过，在运输过程中，灯的拉线出了问题，幸好，公司很乐意寄送了一根全新的灯线。
新的灯线也很快就送到手了，只用了几天的时间。
装配非常容易。然而，之后我发现有一个零件丢失了，于是我联系了客服，他们迅速地给我寄来了缺失的零件！
对我来说，这是一家非常关心客户和产品的优秀公司。
&quot;&quot;&quot;

# 一把电动牙刷的评论
review_3 = &quot;&quot;&quot;
我的牙科卫生员推荐了电动牙刷，所以我就买了这款。
到目前为止，电池续航表现相当不错。
初次充电后，我在第一周一直将充电器插着，为的是对电池进行条件养护。
过去的3周里，我每天早晚都使用它刷牙，但电池依然维持着原来的充电状态。
不过，牙刷头太小了。我见过比这个牙刷头还大的婴儿牙刷。
我希望牙刷头更大一些，带有不同长度的刷毛，
这样可以更好地清洁牙齿间的空隙，但这款牙刷做不到。
总的来说，如果你能以50美元左右的价格购买到这款牙刷，那是一个不错的交易。
制造商的替换刷头相当昂贵，但你可以购买价格更为合理的通用刷头。
这款牙刷让我感觉就像每天都去了一次牙医，我的牙齿感觉非常干净！
&quot;&quot;&quot;

# 一台搅拌机的评论
review_4 = &quot;&quot;&quot;
在11月份期间，这个17件套装还在季节性促销中，售价约为49美元，打了五折左右。
可是由于某种原因（我们可以称之为价格上涨），到了12月的第二周，所有的价格都上涨了，
同样的套装价格涨到了70-89美元不等。而11件套装的价格也从之前的29美元上涨了约10美元。
看起来还算不错，但是如果你仔细看底座，刀片锁定的部分看起来没有前几年版本的那么漂亮。
然而，我打算非常小心地使用它
（例如，我会先在搅拌机中研磨豆类、冰块、大米等坚硬的食物，然后再将它们研磨成所需的粒度，
接着切换到打蛋器刀片以获得更细的面粉，如果我需要制作更细腻/少果肉的食物）。
在制作冰沙时，我会将要使用的水果和蔬菜切成细小块并冷冻
（如果使用菠菜，我会先轻微煮熟菠菜，然后冷冻，直到使用时准备食用。
如果要制作冰糕，我会使用一个小到中号的食物加工器），这样你就可以避免添加过多的冰块。
大约一年后，电机开始发出奇怪的声音。我打电话给客户服务，但保修期已经过期了，
所以我只好购买了另一台。值得注意的是，这类产品的整体质量在过去几年里有所下降
，所以他们在一定程度上依靠品牌认知和消费者忠诚来维持销售。在大约两天内，我收到了新的搅拌机。
&quot;&quot;&quot;

reviews = [review_1, review_2, review_3, review_4]
for i in range(len(reviews)):
    prompt = f&quot;&quot;&quot;
    你的任务是从电子商务网站上的产品评论中提取相关信息。

    请对三个反引号之间的评论文本进行概括，最多20个词汇。

    评论文本: ```{reviews[i]}```
    &quot;&quot;&quot;
    response = get_completion(prompt)
    print(f&quot;评论{i+1}: &quot;, response, &quot;\\n&quot;)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

## **Lesson 4.推断**

### **一、情感推断**

商品评论

```python
lamp_review = &quot;&quot;&quot;
我需要一盏漂亮的卧室灯，这款灯具有额外的储物功能，价格也不算太高。\\
我很快就收到了它。在运输过程中，我们的灯绳断了，但是公司很乐意寄送了一个新的。\\
几天后就收到了。这款灯很容易组装。我发现少了一个零件，于是联系了他们的客服，他们很快就给我寄来了缺失的零件！\\
在我看来，Lumina 是一家非常关心顾客和产品的优秀公司！
&quot;&quot;&quot;
```

判断商品评论的情感 prompt

````python
prompt = f&quot;&quot;&quot;
以下用引号分隔的产品评论的情感是什么？
用一个单词回答：「正面」或「负面」。

评论文本: ```{lamp_review}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

识别情感类型 prompt

````python
# 大型语言模型非常擅长从一段文本中提取特定的东西。
prompt = f&quot;&quot;&quot;
识别以下评论的作者表达的情感。包含不超过五个项目。将答案格式化为以逗号分隔的单词列表。

评论文本: ```{lamp_review}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

识别愤怒 prompt

````python
prompt = f&quot;&quot;&quot;
以下评论的作者是否表达了愤怒？评论用三个反引号分隔。给出是或否的答案。

评论文本: ```{lamp_review}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

### **二、信息提取**

商品信息提取

````python
prompt = f&quot;&quot;&quot;
从评论文本中识别以下项目：
- 评论者购买的物品
- 制造该物品的公司

评论文本用三个反引号分隔。将你的响应格式化为以 “物品” 和 “品牌” 为键的 JSON 对象。
如果信息不存在，请使用 “未知” 作为值。
让你的回应尽可能简短。

评论文本: ```{lamp_review}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

综合情感推断和信息提取

````python
prompt = f&quot;&quot;&quot;
从评论中识别以下内容：
- 情绪（正面/负面）
- 评论者是否感到生气？（是/否）
- 评论者购买的物品
- 制造该物品的公司

评论用三个反引号分隔。将回答转换为 JSON 对象，以 “情感倾向”、“是否生气”、“物品类型” 和 “品牌” 作为key。
如果信息不存在，请使用 “未知” 作为值。
回答应尽可能简短。
将 “是否生气” 值转换为布尔值。

评论文本: ```{lamp_review}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

### **三、主题推断**

判断一段文本的主旨，它涉及了哪些主题。

```python
story = &quot;&quot;&quot;
在政府最近进行的一项调查中，要求公共部门的员工对他们所在部门的满意度进行评分。
调查结果显示，NASA 是最受欢迎的部门，满意度为 95％。

一位 NASA 员工 John Smith 对这一发现发表了评论，他表示：
“我对 NASA 排名第一并不感到惊讶。这是一个与了不起的人们和令人难以置信的机会共事的好地方。我为成为这样一个创新组织的一员感到自豪。”

NASA 的管理团队也对这一结果表示欢迎，主管 Tom Johnson 表示：
“我们很高兴听到我们的员工对 NASA 的工作感到满意。
我们拥有一支才华横溢、忠诚敬业的团队，他们为实现我们的目标不懈努力，看到他们的辛勤工作得到回报是太棒了。”

调查还显示，社会保障管理局的满意度最低，只有 45％的员工表示他们对工作满意。
政府承诺解决调查中员工提出的问题，并努力提高所有部门的工作满意度。
&quot;&quot;&quot;
```

推断讨论主题 prompt

````python
prompt = f&quot;&quot;&quot;
确定以下给定文本中讨论的五个主题。
每个主题用1-2个词概括。
请输出一个可解析的Python列表，每个元素是一个字符串，展示了一个主题。

文本: ```{story}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

为特定主题制作新闻提醒

假设有一个新闻网站，我们感兴趣的主题：美国航空航天局、当地政府、工程、员工满意度、联邦政府等。判断一篇文章，是否包含这些主题。

````python
prompt = f&quot;&quot;&quot;
判断主题列表中的每一项是否是给定文本中的一个话题，
以列表的形式给出答案，每个元素是一个Json对象，键为对应主题，值为 0 或 1。
主题列表：美国航空航天局、当地政府、工程、员工满意度、联邦政府

给定文本: ```{story}```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

可以在此基础上制定新闻提醒：

```python
result_lst = eval(response)
topic_dict = {list(i.keys())[0] : list(i.values())[0] for i in result_lst}
print(topic_dict)
if topic_dict[&apos;美国航空航天局&apos;] == 1:
    print(&quot;提醒: 关于美国航空航天局的新消息&quot;)
```

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

## **Lesson 5.文本转换**

### **一、文本翻译**

相比于传统统计机器翻译系统，大语言模型翻译更加流畅自然，还原度更高。通过在大规模高质量平行语料上进行 Fine-Tune，大语言模型可以深入学习不同语言间的词汇、语法、语义等层面的对应关系，模拟双语者的转换思维，进行意义传递的精准转换，而非简单的逐词替换。

````python
prompt = f&quot;&quot;&quot;
请将以下文本翻译成中文、葡萄牙语、拉丁语，分别展示成正式与非正式两种语气:
```Would you like to order a pillow?```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

### **二、语气与写作风格调整**

````python
prompt = f&quot;&quot;&quot;
将以下文本翻译成商务信函的格式:
```小老弟，我小羊，上回你说咱部门要采购的显示器是多少寸来着？```
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

### **三、文件格式转换**

大模型可以轻松实现 JSON 到 HTML、XML、Markdown 等格式的相互转化，掌握这一转换技巧可更高效地处理结构化数据。

```python
# 假设有一个 JSON 数据,包含餐厅员工的姓名和邮箱。现在将这个 JSON 转换为 HTML 表格格式，以便在网页中展示
data_json = { &quot;resturant employees&quot; :[
    {&quot;name&quot;:&quot;Shyam&quot;, &quot;email&quot;:&quot;shyamjaiswal@gmail.com&quot;},
    {&quot;name&quot;:&quot;Bob&quot;, &quot;email&quot;:&quot;bob32@gmail.com&quot;},
    {&quot;name&quot;:&quot;Jai&quot;, &quot;email&quot;:&quot;jai87@gmail.com&quot;}
]}
prompt = f&quot;&quot;&quot;
将以下Python字典从JSON转换为HTML表格，保留表格标题和列名：{data_json}
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
```

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

### **四、拼写及语法纠正**

假设一篇文章的部分句子存在错误。可以遍历每个句子，要求模型进行检查，如果句子正确就输出“未发现错误”，如果有错误就输出修改后的正确版本。

````python
text = [
  &quot;The girl with the black and white puppies have a ball.&quot;,  # The girl has a ball.
  &quot;Yolanda has her notebook.&quot;, # ok
  &quot;Its going to be a long day. Does the car need it’s oil changed?&quot;,  # Homonyms
  &quot;Their goes my freedom. There going to bring they’re suitcases.&quot;,  # Homonyms
  &quot;Your going to need you’re notebook.&quot;,  # Homonyms
  &quot;That medicine effects my ability to sleep. Have you heard of the butterfly affect?&quot;, # Homonyms
  &quot;This phrase is to cherck chatGPT for spelling abilitty&quot;  # spelling
]
for i in range(len(text)):
    time.sleep(20)
    prompt = f&quot;&quot;&quot;请校对并更正以下文本，注意纠正文本保持原始语种，无需输出原始文本。
    如果您没有发现任何错误，请说“未发现错误”。

    例如：
    输入：I are happy.
    输出：I am happy.
    ```{text[i]}```&quot;&quot;&quot;
    response = get_completion(prompt)
    print(i, response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

### **五、综合样例**

同时对一段文本进行翻译、拼写纠正、语气调整和格式转换等操作。

````python
prompt = f&quot;&quot;&quot;
针对以下三个反引号之间的英文评论文本，
首先进行拼写及语法纠错，
然后将其转化成中文，
再将其转化成优质淘宝评论的风格，从各种角度出发，分别说明产品的优点与缺点，并进行总结。
润色一下描述，使评论更具有吸引力。
输出结果格式为：
【优点】xxx
【缺点】xxx
【总结】xxx
注意，只需填写xxx部分，并分段输出。
将结果输出成Markdown格式。
```{text}```
&quot;&quot;&quot;
response = get_completion(prompt)
display(Markdown(response))
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

## **Lesson 6.文本扩展**

文本扩展可以输入简短文本，生成更加丰富的长文。

### **一、定制客户邮件**

将根据客户评价和情感倾向生成回复邮件。

````python
sentiment = &quot;消极的&quot;

# 一个产品的评价
review = f&quot;&quot;&quot;
他们在11月份的季节性销售期间以约49美元的价格出售17件套装，折扣约为一半。\\
但由于某些原因（可能是价格欺诈），到了12月第二周，同样的套装价格全都涨到了70美元到89美元不等。\\
11件套装的价格也上涨了大约10美元左右。\\
虽然外观看起来还可以，但基座上锁定刀片的部分看起来不如几年前的早期版本那么好。\\
不过我打算非常温柔地使用它，例如，我会先在搅拌机中将像豆子、冰、米饭等硬物研磨，然后再制成所需的份量，\\
切换到打蛋器制作更细的面粉，或者在制作冰沙时先使用交叉切割刀片，然后使用平面刀片制作更细/不粘的效果。\\
制作冰沙时，特别提示：\\
将水果和蔬菜切碎并冷冻（如果使用菠菜，则轻轻煮软菠菜，然后冷冻直到使用；\\
如果制作果酱，则使用小到中号的食品处理器），这样可以避免在制作冰沙时添加太多冰块。\\
大约一年后，电机发出奇怪的噪音，我打电话给客服，但保修已经过期了，所以我不得不再买一个。\\
总的来说，这些产品的总体质量已经下降，因此它们依靠品牌认可和消费者忠诚度来维持销售。\\
货物在两天内到达。
&quot;&quot;&quot;
prompt = f&quot;&quot;&quot;
你是一位客户服务的AI助手，任务是给一位重要客户发送邮件回复。
根据客户通过```分隔的评价，生成回复以感谢客户的评价。
使用评价中的具体细节，用简明而专业的语气写信。
以“AI客户代理”签署电子邮件。
客户评论：
```{review}```
评论情感：{sentiment}
&quot;&quot;&quot;
response = get_completion(prompt)
print(response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

### **二、温度系数**

大语言模型中的 “温度”(temperature) 参数可以控制生成文本的随机性和多样性。temperature 的值越大，语言模型输出的多样性越大；temperature 的值越小，输出越倾向高概率的文本。

举个例子，在某一上下文中，语言模型可能认为“比萨”是接下来最可能的词，其次是“寿司”和“塔可”。若 temperature 为 0，则每次都会生成“比萨”；而当 temperature 越接近 1 时，生成结果是“寿司”或“塔可”的可能性越大，使文本更加多样。

如果需要可预测、可靠的输出，则将 temperature 设置为 0；如果需要更具创意的文本，可适当提高 temperature。

````python
# temperature=0.7
prompt = f&quot;&quot;&quot;
你是一名客户服务的AI助手。
你的任务是给一位重要的客户发送邮件回复。
根据通过“```”分隔的客户电子邮件生成回复，以感谢客户的评价。
如果情感是积极的或中性的，感谢他们的评价。
如果情感是消极的，道歉并建议他们联系客户服务。
请确保使用评论中的具体细节。
以简明和专业的语气写信。
以“AI客户代理”的名义签署电子邮件。
客户评价：```{review}```
评论情感：{sentiment}
&quot;&quot;&quot;
response = get_completion(prompt, temperature=0.7)
print(response)
````

[在 Colab 查看输出结果](https://colab.research.google.com/drive/1m1QqQd2UUG_4VM4l1rEftKoWoCnxb7U0?usp=sharing)

## **Lesson 7.聊天机器人**

### **一、给定身份**

在 ChatGPT 网页界面中，消息分为用户消息和助手消息。但在构建聊天机器人时，在发送了系统消息之后，您的角色可以仅作为用户 (user) ；也可以在用户和助手 (assistant) 之间交替来提供对话上下文。

```python
import openai

def get_completion_from_messages(messages, model=&quot;gpt-3.5-turbo&quot;, temperature=0):
    response = openai.ChatCompletion.create(
        model=model,
        messages=messages,
        temperature=temperature, # 控制模型输出的随机程度
    )
#     print(str(response.choices[0].message))
    return response.choices[0].message[&quot;content&quot;]
messages =  [
{&apos;role&apos;:&apos;system&apos;, &apos;content&apos;:&apos;你是个友好的聊天机器人。&apos;},
{&apos;role&apos;:&apos;user&apos;, &apos;content&apos;:&apos;Hi, 我是Isa。&apos;}  ]
response = get_completion_from_messages(messages, temperature=1)
print(response)
```

### **二、构建上下文**

每次与语言模型的交互都互相独立，这意味着要提供所有相关的消息，以便模型在当前对话中进行引用。如果想让模型引用或 “记住” 对话的早期部分，则必须在输入中提供对话历史，也就是上下文 (context) 。

```python
messages =  [
{&apos;role&apos;:&apos;system&apos;, &apos;content&apos;:&apos;你是个友好的聊天机器人。&apos;},
{&apos;role&apos;:&apos;user&apos;, &apos;content&apos;:&apos;Hi, 我是Isa&apos;},
{&apos;role&apos;:&apos;assistant&apos;, &apos;content&apos;: &quot;Hi Isa! 很高兴认识你。今天有什么可以帮到你的吗?&quot;},
{&apos;role&apos;:&apos;user&apos;, &apos;content&apos;:&apos;是的，你可以提醒我, 我的名字是什么?&apos;}  ]
response = get_completion_from_messages(messages, temperature=1)
print(response)
```

### **三、订餐机器人**

机器人会自动收集用户信息，并接收来自比萨饼店的订单。

collect_messages() 函数收集用户消息，从用户界面中收集 Prompt ，然后将其附加到一个名为上下文( `context` )的列表中，并在每次调用模型时使用该上下文。模型的回答也会添加到上下文中，上下文逐渐变长。这样模型就知道下一步要做什么。

```python
def collect_messages(_):
    prompt = inp.value_input
    inp.value = &apos;&apos;
    context.append({&apos;role&apos;:&apos;user&apos;, &apos;content&apos;:f&quot;{prompt}&quot;})
    response = get_completion_from_messages(context)
    context.append({&apos;role&apos;:&apos;assistant&apos;, &apos;content&apos;:f&quot;{response}&quot;})
    panels.append(
        pn.Row(&apos;User:&apos;, pn.pane.Markdown(prompt, width=600)))
    panels.append(
        pn.Row(&apos;Assistant:&apos;, pn.pane.Markdown(response, width=600, style={&apos;background-color&apos;: &apos;#F6F6F6&apos;})))

    return pn.Column(*panels)
```

现在，我们将设置并运行这个 UI 来显示订单机器人。初始的上下文包含了包含菜单的系统消息，在每次调用时都会使用。此后随着对话进行，上下文也会不断增长。需要用 pip 安装 panelCopy 库（用于可视化界面）。

```python
import panel as pn  # GUI
pn.extension()

panels = [] # collect display

context = [{&apos;role&apos;:&apos;system&apos;, &apos;content&apos;:&quot;&quot;&quot;
你是订餐机器人，为披萨餐厅自动收集订单信息。
你要首先问候顾客。然后等待用户回复收集订单信息。收集完信息需确认顾客是否还需要添加其他内容。
最后需要询问是否自取或外送，如果是外送，你要询问地址。
最后告诉顾客订单总金额，并送上祝福。

请确保明确所有选项、附加项和尺寸，以便从菜单中识别出该项唯一的内容。
你的回应应该以简短、非常随意和友好的风格呈现。

菜单包括：

菜品：
意式辣香肠披萨（大、中、小） 12.95、10.00、7.00
芝士披萨（大、中、小） 10.95、9.25、6.50
茄子披萨（大、中、小） 11.95、9.75、6.75
薯条（大、小） 4.50、3.50
希腊沙拉 7.25

配料：
奶酪 2.00
蘑菇 1.50
香肠 3.00
加拿大熏肉 3.50
AI酱 1.50
辣椒 1.00

饮料：
可乐（大、中、小） 3.00、2.00、1.00
雪碧（大、中、小） 3.00、2.00、1.00
瓶装水 5.00
&quot;&quot;&quot;} ]  # accumulate messages

inp = pn.widgets.TextInput(value=&quot;Hi&quot;, placeholder=&apos;Enter text here…&apos;)
button_conversation = pn.widgets.Button(name=&quot;Chat!&quot;)

interactive_conversation = pn.bind(collect_messages, button_conversation)

dashboard = pn.Column(
    inp,
    pn.Row(button_conversation),
    pn.panel(interactive_conversation, loading_indicator=True, height=300),
)
```

运行如上代码可以得到一个点餐机器人

**创建 JSON 摘要**

接下来要求模型创建一个 JSON 摘要，发送给订单系统。（此处也可以定义为用户消息，不一定是系统消息）

请注意，这里使用了一个较低的温度，因为对于这些类型的任务，我们希望输出相对可预测。

```python
messages =  context.copy()
messages.append(
{&apos;role&apos;:&apos;system&apos;, &apos;content&apos;:
&apos;&apos;&apos;创建上一个食品订单的 json 摘要。\\
逐项列出每件商品的价格，字段应该是 1) 披萨，包括大小 2) 配料列表 3) 饮料列表，包括大小 4) 配菜列表包括大小 5) 总价
你应该给我返回一个可解析的Json对象，包括上述字段&apos;&apos;&apos;},
)

response = get_completion_from_messages(messages, temperature=0)
print(response)
{
  &quot;披萨&quot;: {
    &quot;意式辣香肠披萨&quot;: {
      &quot;大&quot;: 12.95,
      &quot;中&quot;: 10.00,
      &quot;小&quot;: 7.00
    },
    &quot;芝士披萨&quot;: {
      &quot;大&quot;: 10.95,
      &quot;中&quot;: 9.25,
      &quot;小&quot;: 6.50
    },
    &quot;茄子披萨&quot;: {
      &quot;大&quot;: 11.95,
      &quot;中&quot;: 9.75,
      &quot;小&quot;: 6.75
    }
  },
  &quot;配料&quot;: {
    &quot;奶酪&quot;: 2.00,
    &quot;蘑菇&quot;: 1.50,
    &quot;香肠&quot;: 3.00,
    &quot;加拿大熏肉&quot;: 3.50,
    &quot;AI酱&quot;: 1.50,
    &quot;辣椒&quot;: 1.00
  },
  &quot;饮料&quot;: {
    &quot;可乐&quot;: {
      &quot;大&quot;: 3.00,
      &quot;中&quot;: 2.00,
      &quot;小&quot;: 1.00
    },
    &quot;雪碧&quot;: {
      &quot;大&quot;: 3.00,
      &quot;中&quot;: 2.00,
      &quot;小&quot;: 1.00
    },
    &quot;瓶装水&quot;: 5.00
  }
}
```

---

### **总结**

Prompt 的两个核心原则：

- 编写清晰具体的指令；
- 给模型一些思考时间。

我们还学习了迭代式 Prompt 开发的方法，逐步找到适合的 Prompt；另外，课程还讨论了大型语言模型的许多功能，包括摘要、推断、转换和扩展。

### **Ref**

- [ChatGPT Prompt Engineering for Developers](https://learn.deeplearning.ai/chatgpt-prompt-eng/lesson/1/introduction)
- [中文翻译][面向开发者的LLM入门教程](https://datawhalechina.github.io/prompt-engineering-for-developers/#/)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00 的 2023 年(AI)作品集]]></title>
            <link>https://tophci.com/posts/240103-2023-ai-portfolio</link>
            <guid isPermaLink="true">https://tophci.com/posts/240103-2023-ai-portfolio</guid>
            <category><![CDATA[2023]]></category>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[portfolio]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 02 Jan 2024 16:00:00 GMT</pubDate>
            <content:encoded>
2023 年的关键词无疑是 AI。这一波生成式 AI 的浪潮，让人觉得事情又变得好玩了，于是 00 也开始恢复更新和内容创作。

回顾这一年，每天被各种新闻冲击，看论文看 github，试用目不暇接的新产品，觉得好多事情被改写，好多知识需要学习，而新的创作流和习惯还在摸索。整理了一下 2023 年的作品，给 2024 加油～

### 图零学院知识星球

4 月份开始运营关于生成式 AI 的知识星球，累计发布内容 350+篇，日常更新 AI 最新资讯。最近准备做一次大的改版升级，改名为「AI 创作工作流-图零学院」，不再以最新资讯为主，而会关注 AI 工作流，总结内容创作者日常会使用的高频工作流，比如收集资料、多语言翻译、数据整理、图文编辑、短视频生产、批量生成等等，目标是为创作者提供更实用的价值。

![2-知识星球目录](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-%E7%9F%A5%E8%AF%86%E6%98%9F%E7%90%83%E7%9B%AE%E5%BD%95.PNG)

### 给创作者的提示词手册

4 月份制作了一个提示词手册，用比较可视化的方式整理了提示词 prompt 的使用方法，也包括工具的推荐。如果需要获取这本手册，可以在[公众号「设计极客 00」中查看历史文章](https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzAxNDE2NzAxOQ==&amp;action=getalbum&amp;album_id=3016740700740354053#wechat_redirect)。

这个手册总结的提示词方法，放在今天也基本可用，最近准备进行一轮大的更新。

![3-creator&apos;s prompt handbook Cover-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3-creator&apos;s%20prompt%20handbook%20Cover-s.jpg)

### 《深入人心》

00 的第一本个人专著《[深入人心——数字产品设计的底层逻辑](https://book.douban.com/subject/36459345/)》在 7 月由机械工业出版社出版上市。

![5-bookcover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-bookcover.png)

在新书发布会上做了一次分享：数字产品设计的心理学秘密。

![6-DesignPsy Press_Optimizer](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/6-DesignPsy%20Press_Optimizer.jpg)

### 20 天攻克 AI 绘画 系列课程

2023 年投入心力最多、耗时最长的作品就是《20 天攻克 AI 绘画课》这门以 Stable Diffusion 为基础的 AI 绘画课了。准备了 2 个多月，在 10 月份上线，课程总共 20 节课 ，系统教你上手 Stable Diffusion。有免费的试听课，感兴趣的朋友可以看看。

![https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/231020课程封面图.png](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/231020课程封面图.png)

![绘画课-1-9](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/%E7%BB%98%E7%94%BB%E8%AF%BE-1-9.jpeg)

![绘画课-10-20-new](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/%E7%BB%98%E7%94%BB%E8%AF%BE-10-20-new.jpeg)

### 图零学院网站

[图零学院 ｜创作者的 AI 加油站](http://www.xueyuan.ai)

在 AI 大潮来临时，00 萌生了想重新读一次大学的想法，于是有了图零学院的构想，并且斥巨资（bushi）买下 xueyuan.ai 这个域名，开始研究怎么重新建一个网站，准备了一段时间以后，现在第 1.0 版本已经上线，欢迎大家访问。今年会继续更新，提供更多实用的 AI 资讯、工具和教程。

### 2023 生成式 AI 回顾地图和应用榜单

11 月～ 12 月，图零学院和 AIGCxChina 联合发布了几个总结性工作，帮助大家更好地回顾生成式 AI 的发展，以及用上最前沿的工具：

1. ChatGPT 一周年生成式 AI 大事件时间线地图

   ![11-GenAI-2023map-zh-v1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/11-GenAI-2023map-zh-v1.jpg)

   00 整理了 2023 年生成式 AI 领域的重大事件时间线，分为头条、产品（文本/图片/视频/代码/开源/其他）、模型、算力、政策五大部分，都集中在一张地图中，方便查阅。

   获取大图：在公众号「设计极客 00」回复：2023，即可获得查看高清大图的链接。

2. 火花私享课：[2023 年生成式 AI 回顾和总结](https://www.xueyuan.ai/blog/2023-genai-map)
   [figma](https://www.figma.com/proto/IqE5XUoHct6UIusTD5Q3SJ/%5B00%5D2023%E7%94%9F%E6%88%90%E5%BC%8FAI%E5%9B%9E%E9%A1%BE%E5%92%8C%E8%BF%9B%E5%B1%95?page-id=1449%3A4287&amp;type=design&amp;node-id=1449-4289&amp;viewport=80%2C319%2C0.06&amp;t=mQcL5HeWFXPnrBjM-1&amp;scaling=scale-down&amp;mode=design)

​ 视频回放可以在我的视频号「设计极客 00」中查看。

​ 另外两个工作是整理这一年最受欢迎的 AI 应用，分为中文和英文两个榜单。

3. [2023 年生成式 AI 应用推荐-中国](https://www.xueyuan.ai/blog/2023-ai-apps-zh)

[https://www.figma.com/proto/G96Pt0Qeoss48VtXA8ycsd/2023-Gen-AI-Maps-by-00%40xueyuan.ai?page-id=3202%3A2139&amp;type=design&amp;node-id=3229-2443&amp;viewport=174%2C362%2C0.34&amp;t=NQyE619N53PxQ2jm-1&amp;scaling=scale-down&amp;mode=design](https://www.figma.com/proto/G96Pt0Qeoss48VtXA8ycsd/2023-Gen-AI-Maps-by-00%40xueyuan.ai?page-id=3202%3A2139&amp;type=design&amp;node-id=3229-2443&amp;viewport=174%2C362%2C0.34&amp;t=NQyE619N53PxQ2jm-1&amp;scaling=scale-down&amp;mode=design)

4. [2023 年生成式 AI 应用推荐-全球](https://www.xueyuan.ai/blog/2023-ai-apps-en)

[https://www.figma.com/proto/G96Pt0Qeoss48VtXA8ycsd/2023-Gen-AI-Maps-by-00%40xueyuan.ai?page-id=3202%3A2139&amp;type=design&amp;node-id=3355-171&amp;viewport=174%2C362%2C0.34&amp;t=NQyE619N53PxQ2jm-1&amp;scaling=scale-down&amp;mode=design](https://www.figma.com/proto/G96Pt0Qeoss48VtXA8ycsd/2023-Gen-AI-Maps-by-00%40xueyuan.ai?page-id=3202%3A2139&amp;type=design&amp;node-id=3355-171&amp;viewport=174%2C362%2C0.34&amp;t=NQyE619N53PxQ2jm-1&amp;scaling=scale-down&amp;mode=design)

### AI 生成的概念视频 Demo

第一个全 AI 生成的视频《Predator》，野生动物纪录片风格

![16-AI Demo1-red](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/16-AI%20Demo1-red.jpg)

第二个 AI 视频《New Vega City》，火星科幻大片风格

![1-AI Demo2-red](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-AI%20Demo2-red.PNG)

### ComfyUI 工作流

[ComfyUI](https://github.com/comfyanonymous/ComfyUI) 是 2023 年我使用最多的工具，它是 node-based 的 AI 绘画工作流界面，比 Stable Diffusion 更灵活，消耗内存更少，是低显存的利器。我在 [liblib 上面分享的工作流](https://www.liblib.art/userpage/bb14cfd74d494567a3c2ce5e7b312e50) 已经有接近 1000 次下载，[欢迎关注](https://www.liblib.art/userpage/bb14cfd74d494567a3c2ce5e7b312e50)。

![20-liblib-00](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/20-liblib-00.jpeg)

### 未来一年的创作方向

经过一年的学习摸索，2024 年 00 会更加聚焦价值，以作品为导向，把重点放在这几个创作的方向：

- AI 工作流：帮助 AI 重度用户优化日常工作流，提高创作效率
- AI 工具和技术的科普：帮助更多女生成为 AI 受益者和创作者
- AI 技术和数据的可视化：用技术和设计的力量，挖掘数据的价值，并且通过可视化方式传播给更多的人。

---

欢迎在以下平台关注图零学院和 00

- 视频号：设计极客 00
- 小红书：[00](https://www.xiaohongshu.com/user/profile/58d135c950c4b459eca90554)
- 抖音：[00 的 AI 加油站](https://www.douyin.com/user/MS4wLjABAAAA3TkjKEGMdiupR4FQV_zxJ4kTPW4dZ4cI8MFA_2QkEmc)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[何为良好生活]]></title>
            <link>https://tophci.com/posts/240101-what-is-good-life</link>
            <guid isPermaLink="true">https://tophci.com/posts/240101-what-is-good-life</guid>
            <category><![CDATA[零反思]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 31 Dec 2023 16:00:00 GMT</pubDate>
            <content:encoded>
一种个人的欲望、能力与现实情境相匹配的生活。

一起迎接新一年的良好生活吧！

元旦快乐 ♪٩(´ω`)و♪

![何为良好生活](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/%E4%BD%95%E4%B8%BA%E8%89%AF%E5%A5%BD%E7%94%9F%E6%B4%BB.jpg)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[2023年终AI工具热榜🔥27个入门必备神器]]></title>
            <link>https://tophci.com/posts/231221-2023-ai-tools</link>
            <guid isPermaLink="true">https://tophci.com/posts/231221-2023-ai-tools</guid>
            <category><![CDATA[2023]]></category>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[AI 应用]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 20 Dec 2023 16:00:00 GMT</pubDate>
            <content:encoded>
2023 年生成式 AI 大爆发，00 爆肝盘点了这一年全球最热门的 AI 工具，帮大家精心挑选了 27 个热度最高的 AI 应用，包括 AIGC 的 9 个主要领域。

在讲座时被大家问爆了，这个 AI 工具集赶紧收藏起来，今天就开始学！

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/231221-ai-tools.jpg&quot; alt=&quot;231221-ai-tools&quot; style=&quot;zoom:67%;&quot; /&gt;

1️⃣ 对话类 AI 神器：除了 ChatGPT，还有好多值得尝试的 AI chatbot

2️⃣ 助手类 AI 工具：Notion AI 是打工人、学生、自媒体的好帮手。革命性搜索引擎 perplexity 已经成为日常必备。

3️⃣ 图像 AI 神器： Midjourney 火爆全网。AI 入门怎么学？从文本生成图像开始吧！

4️⃣ 视频 AI 神器：这两个月最火爆的文本生成视频 AI 应用 Runway 和 Pika，你试用了吗？

5️⃣ 内容创作 AI 软件：AI 写作已经很成熟了，高效撰写文章，提升写作水平。

6️⃣ 代码生成：女生也能快速成为编程高手！谁说女生不适合写代码？

7️⃣ PPT AI 工具：PPT 和演示文稿自动生成，打工人反内卷必备神器。

8️⃣ 网站生成 AI 工具：没有设计师也能快速做一个自己的网站！

9️⃣ 自动化低代码 AI 神器：AI 时代，一定要多让机器帮我们干活！

AI 真的无处不在了。 2023 年，记住这 27 个火爆全网的 AI 应用，让你的生活工作更轻松。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[一图总结 2023 生成式 AI 里程碑大事件时间线]]></title>
            <link>https://tophci.com/posts/231129-genai-2023-map</link>
            <guid isPermaLink="true">https://tophci.com/posts/231129-genai-2023-map</guid>
            <category><![CDATA[2023]]></category>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[可视化]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 28 Nov 2023 16:00:00 GMT</pubDate>
            <content:encoded>
2022.11.30，OpenAI 宣布正式推出 ChatGPT。 365 天过去，斗转星移，我们一起见证了生成式 AI 的寒武纪大爆发。

这一年来，国内外的生成式 AI 、大模型和产品以令人眼花缭乱的速度更新迭代，新的创业浪潮风起云涌，大家登记 waitlist 的速度都赶不上产品推陈出新的频率。国内更是开始了百模大战，不少国产大模型陆续宣布性能赶超 GPT3.5。大浪淘沙后，也有不少企业宣告解散，知名大模型项目「套壳」开源项目屡见不鲜。

回顾 ChatGPT 发布的这一年，都有哪些大事件，你会用哪些关键词总结？

00 整理了 2023 年生成式 AI 领域的重大事件时间线，分为头条、产品（文本/图片/视频/代码/开源/其他）、模型、算力、政策五大部分，都集中在一张地图中，方便查阅。

![11-GenAI-2023map-zh-v1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/11-GenAI-2023map-zh-v1.jpg)

&gt; 注：因个人能力、精力有限，难免挂一漏万，本次绘制的地图只提供一个概览，是一个历史切片，各种疏漏敬请谅解。

获取大图：在公众号「设计极客 00」回复 2023，即可获得查看高清大图的链接。

### 生成式文本

ChatGPT 自 2022 年 11 月 30 日上线以来，一直引领着生成式 AI 的发展。

- 2023 年 1 月底 2 月初，ChatGPT 成为互联网史上最快获得 1 亿用户的产品。
- 2 月，ChatGPT plus 版本上线。
- 3 月 15 日，GPT4 炸裂发布，正式宣告生成式 AI 大爆发的开始，无数人开始研究如何能注册和使用上这个用数十亿美元打造出来的大杀器。
- 4 月，ChatGPT 开放了插件，原本简单的基于历史数据的对话，一下有了全新的能力和可能性，开发者多少对如此简单的接入感到兴奋和害怕。
- OpenAI 还在 5 月和 8 月分别推出了 ChatGPT 的 iOS 和 Android 应用，并在 11 月向所有用户开放移动应用的语音对话能力。
- 7 月，OpenAI 开放了 GPT4 API 、强大的代码解释器，并允许用户自定义指令
- 8 月，ChatGPT 企业版上线，3.5 turbo 模型支持微调
- 9 月，ChatGPT 集成新的语音和图像能力，联网浏览功能也恢复了，多模态能力进一步增强
- 10 月，继续是多模态能力，沉寂已久的 DALL·E 更新到第三代，GPT4V 接口也发布了
- 11 月，OpenAI 高层戏剧化政变，Sam Altman 几进几出，全球观众不眠不休追剧

除了 ChatGPT， 对话式 AI 产品也诞生了几个实力强大的竞争者。

关系微妙的好基友 Bing Chat 紧随 ChatGPT，在 2 月就占得先机，原本几乎没有什么市场份额的 Bing 搜索引擎重获新生。在「普惠」这件事情上，没有人比微软做得更快更好，不但云服务全线铺开，而且 Copilot 在 11 月已经深度集成到 Windows 生态中。

另一方面，挑战者 Anthropic 的 Claude 在 3 月紧随 GPT4 上线，并率先在 5 月份支持长达 100k 的上下文。7 月 Claude2 发布，到 11 月，Claude2.1 已经支持 200k 的上下文，并开放了数据调用能力。

Google 在生成式 AI 的浪潮中，多少给人一种「起了个大早，赶了个晚集」的感觉。最早提出 transformer 架构，在大模型技术储备上让人望其项背，但因为搜索引擎牵一发动全身，Google 在 3 月仓促推出 Bard，一时差评如潮。随着 PaLM 和新版搜索引擎的改进，以及 Duet AI 、新一代 Gemini 模型的推出，Google 在几个月内完成了生成式 AI 生态的完整布局，不得不让人感叹家底雄厚。

在其他应用领域，产品和创新就更加不胜枚举了。现在回头看 Poe 套壳应用的巨大成功，不知道 OpenAI 董事会的 Quora（孵化了 Poe） 创始人 Adam D&apos;Angelo 到底扮演了什么角色，这让故事蒙上了阴谋论的迷雾。Notion AI 也是最早集成 AI 能力的产品之一，在场景化的应用中树立了标杆。

最后（也是最重要的）一件事，是 4 月 LLaMA 的史诗级泄露，大模型进化树全新开源分支一骑绝尘。 GPT 和 LLaMA 这一对 iOS 和 Android，联手开启了生成式 AI 的寒武纪大爆发的开关。

### 生成式图像

文生图领域同样迎来了突飞猛进的一年。生成式图像的生态可以划分为三大阵营：

**开源工具**：以 Stable Diffusion 为代表，这一类好比安卓系统，生态丰富而且活跃，既有完全开源的 Stable Diffusion，也包括很多基于 SD 做了二次封装的文生图工具比如 Dreamstudio、[leonardo.ai](http://leonardo.ai)、[dreamlike.art](https://dreamlike.art/create)、playground ai 等等。 Stable Diffusion 2.0 并不成功，4 月 SDXL beta 版本发布，让大家重新对文生图能力充满了期待，7 月 SDXL 正式上线，目前还处在降低算力要求的推广融合阶段。随着 civitai（C 站）和 WebUI 、ComfyUI 的普及，还有 Meta 在基础模型和算法方面的持续贡献，开源工具会继续推动生成式图像生态的繁荣和创新。

**闭源工具**：以 Midjourney 为代表，可以类比苹果手机，生态封闭但用户体验较好，还包括 DALL·E3、Bing Image Creator、文心一格等。Midjourney 在 2023 年成为“小团队-大产品”的代言人。 3 月 V5 上线， 5 月 5.1 版本，6 月 5.2 版本，每一个版本都让人惊叹 Midjourney 的画质如此出色，甚至怀疑跟 Stable Diffusion 还是不是同源技术。

**设计工具 2.0**：以 Adobe Firefly 为代表，是在原有的设计工具中集成 AI 辅助的功能，还包括 Canva AI、Microsoft Designer、Framer AI 等等。Firefly 可以说是成也专业，败也专业。直接集成在 Adobe Creative 尤其是 Photoshop 中，能完败绝大多数的文生图应用，但是也会相对局限在专业设计师和创意人群中。11 月，图像 AI 生成领域迎来了实时绘制的浪潮，KREA 和 Clipdrop 相继上线实时绘制功能，相信这对设计工具 2.0 会是一次重大突破，专业画手被冲击的部分又有了新的价值展现！

对了，00 也做了一门 20 节课的 《[20 天攻克 AI 绘画课](http://mp.weixin.qq.com/s?__biz=MzAxNDE2NzAxOQ==&amp;mid=2667164391&amp;idx=1&amp;sn=7e39e831eb41cf454536693be4cc4bf3&amp;chksm=809a6c63b7ede575bba6ad1209ef866e14f317f0fec11a424c4779b38b8da91eafc624160870&amp;scene=21#wechat_redirect)》，系统教你上手 Stable Diffusion，感兴趣的朋友可以看看。

### 生成式视频

2023 年是 Generative video 的元年。在大家还在摸索文生图的时候，文本生成视频的快速进化让人眼花缭乱。

进入下半年，由 Runway ML 引领的生成式视频领域车速猛增，先是 Gen-2 上线，生成式视频开启卷王模式，Pika，LumaAI，Morph Studio，Moonvalley，PlaiDay，Mootion 等一众文生视频应用百花齐放。

11 月，竞争进入白热化阶段，Gen-2 受 Pika 等刺激完成了大更新，视频质量有了跃迁。Pika1.0 在可控性方面又有了极大提升。文生视频也迎来更大 的开源玩家：Meta 发布 Emu，Stability AI 发布 Stable video diffusion，学术界同时在争相发布降低生成成本的研究。明年，生成式视频一定会迎来大爆发，图像创意工作者的创作流程将会被改变。

### 生成式代码

生成式代码是高端玩家的竞技场。主要也有三股力量：

- 代码平台：以 Github Copilot 为代表，还包括模型社区 Hugging Face 发布的 StarCoder。因为坐拥海量的源代码和模型，解放生产力是优先的场景。
- 大模型和开源生态：很多综合大模型都会有专门的代码生成模块，这也许会成为评估模型能力的重要指标。Meta 2023 年一头扎进开源搞建设，大有成为 AI 安卓之势。
- 商业养蛊：Salefore 和幻方发布了自己的代码生成模型，CodeGen2 在 5 月发布，DeepSeek 11 月上线。有钱人往往也有远见，先用资源垒出壁垒，让别人在日后难以竞争，是为商业养蛊～

对了，请不要忽略 5 月份新的 AI/ML 编程语言 Mojo 的发布，期待明年会有更精彩的生态演绎。

### 开源应用

2023 年什么最火？ChatGPT。2023 年哪里最热闹？GitHub 😄 （抱抱脸稍微不服气）

- 2 月，文生图领域拯救 Stable Diffusion 的 ControlNet 在 上线，作者还开发了 Fooocus（取代难用的 A1111 WebUI，不是）
- 3 月，2022 年已经发布的的 Langchain 一下踩中了风口，成为生成式 AI 第一开源股（不是）。半年后逐渐取代 SD WebUI 的 ComfyUI 悄悄 init 了

- 4 月，AutoGPT 大红大紫，带动了 Agent 概念极速发展
- 6 月， DragGan 引发了可控文生图的热潮
- 7 月， AnimateDiff 开始推动文生视频的发展
- 11 月， LCM 带来低显存福音，1 秒出图不是梦，3060 生成视频不是梦

Github 的热闹，还是得每天刷新热门项目的 star 数才能感受到，请大家移步本地图的 Github 地址，star 一下支持原创 🫣

英文版地图：https://github.com/kidult00/genai-2023-map

中文版地图：https://github.com/kidult00/genai-2023-map/blob/main/zh_version.md

### 模型

大模型这一块，相信各种商业分析、创业社区、大中小厂官网，已经日常轰炸大家许久了。这里就不念 PPT 了，大家可以在月历中查阅。

### 算力

算力领域的故事比较单薄，英伟达强者恒强， 宣扬 AI 的「iPhone 时刻」到来并表示 all in 生成式 AI。11 月，英伟达发布 H200 芯片，地球最强没跑了，尤其在训练场景，试图进一步拉大产品性能及产业链上下游的优势。

位于第二梯队的 Google 研发出为机器学习定制的专用芯片 TPU，5 月已经发布第五代。追赶者 AMD 也在 6 月推出了 MI300X AI 芯片，反响一般。深感算力不够用的大厂纷纷开始准备自研芯片，包括微软、 Meta、亚马逊、华为等。

### 政策

关于监管，关于数据安全，关于版权，关于隐私，关于 AGI，可以说 gov 都是慢半拍。 7 月份公布的《生成式
人工智能服务管理暂行办法》备受关注。欧盟受在大模型竞争中全面落后，不过发布了全球第一部人工智能法案。

---

2023 年绝对是历史性的一年，人类走出 COVID-19 的阴霾，迎来了生产力的革新（爆头冲击）。

对从业者来说，这是一惊一乍的一年。对创业者来说，这是不眠不休的一年。对创作者来说，这是眼界大开的一年。对普通人来说，这是历史车轮加速的一年。

想一想又有点不对，AI 一天，人间已一年。

祝愿大家在 2024 年少一点疲于奔命，多一些笃定，多一分创作。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[浅尝 OpenAI 最新福利 Assistants API]]></title>
            <link>https://tophci.com/posts/231107-try-assistants-api</link>
            <guid isPermaLink="true">https://tophci.com/posts/231107-try-assistants-api</guid>
            <category><![CDATA[OpenAI]]></category>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[API]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 06 Nov 2023 16:00:00 GMT</pubDate>
            <content:encoded>
OpenAI 今天在开发者大会上发布了 Assistants API，现在可以自定义 AI 助手了。

之前使用 ChatGPT 基本靠提示词，联网功能、 DalleE3 画图功能、代码解析器不能一起工作，需要切换各种模式，相当受限。现在有了 Assistants 助理，可以一下子整合指令、模型、工具（包括各种 API）和私有知识库（文件）来完成对话。毫无疑问，功能更丰富也更灵活了，大大突破了提示词的局限。

### 什么是助手 API？

一些新的概念整理如下：

![](https://cdn.openai.com/API/docs/images/diagram-assistant.webp)

| 对象      | 释义                                                                                           |
| --------- | ---------------------------------------------------------------------------------------------- |
| Assistant | 使用 OpenAI 模型和调用工具的专用 AI                                                            |
| Thread    | 助理与用户之间的对话会话                                                                       |
| Message   | 由助理或用户创建的消息，包括文本、图像和其他文件。消息存储为线程中的列表。                     |
| Run       | 在线程中调用助手。助手根据配置和线程的消息，调用模型和工具来执行任务。生成的消息会附加到线程。 |
| Run Step  | 助手运行时执行步骤的详细列表。“运行步骤”可以检查助手是如何获得最终结果的。                     |

助手实际上是一个集合，可以自定义以下命令的组合，来帮助用户达成目标：

- 指令（Instructions）：助手和模型要做什么，也就是之前我们已经很熟悉的提示词

- 模型：GPT-3.5 或 GPT-4 模型的型号。如果要用到检索工具（Retrieval tool），就需要指定`gpt-3.5-turbo-1106`或`gpt-4-1106-preview`。

- 工具：使用 `tools` 参数可给予助手多达 128 个工具的访问权限。Assistants API 目前支持三种 OpenAI 官方的[工具](https://platform.openai.com/docs/assistants/tools)：

  - 代码解释器（Code Interpreter）

  - 检索（Retrieval）

  - 函数（Functions）：通过 `function` 调用第三方工具，可以自定义函数签名。

    未来 OpenAI 会发布更多工具，用户还可以共享已经定义好的 Assistants。

- 文件：使用 `file_ids` 参数给予工具访问文件的权限。文件使用 `File` [opload endpoint](https://platform.openai.com/docs/api-reference/files/create) 上传，并且必须将 `purpose` 设置为 `assistants `才能与此 API 一起使用。每个助手最多可以附加 20 个文件，每个文件最大 512 MB。组织上传的所有文件不应超过 100 GB。

### 如何创建助手？

Assistants API 的典型流程是：创建助手—创建线程—添加消息—运行—显示。

#### 步骤 1：创建助手

在 API 中自定义指令并选择模型来创建[助手](https://platform.openai.com/docs/api-reference/assistants/createAssistant)，可以启用代码解释器、检索和函数调用等工具。下面是一个创建数学老师的例子，需要开启代码解释器。

```python
assistant = client.beta.assistants.create(
    name=&quot;数学老师&quot;,
    instructions=&quot;您是一名数学老师，请编写并运行代码来回答数学问题&quot;,
    tools=[{&quot;type&quot;: &quot;code_interpreter&quot;}],
    model=&quot;gpt-4-1106-preview&quot;
)
```

#### 步骤 2：创建线程

线程和消息表示助理和用户之间的对话会话。建议在用户发起会话后，立即为每个用户创建一个线程，并在用户回复时将 Messages 添加进来。

```python
thread = client.beta.threads.create(
  messages=[
    {
      &quot;role&quot;: &quot;user&quot;,
      &quot;content&quot;: &quot;Create 3 data visualizations based on the trends in this file.&quot;,
      &quot;file_ids&quot;: [file.id]
    }
  ]
)
```

线程没有大小限制，支持任意多的消息。API 将使用如截断等技术，确保请求在最大上下文限制之内。

助理可以访问多种格式的[文件](https://platform.openai.com/docs/assistants/tools/supported-files)作为创建文件或对话的一部分。使用工具时，助理还可以创建文件（图像/电子表格等）并引用。例如，要创建基于 `.csv ` 数据可视化的助手，先上传文件，然后用上传的文件创建助手。

```python
file = client.files.create(
  file=open(&quot;speech.py&quot;, &quot;rb&quot;),
  purpose=&apos;assistants&apos;
)

assistant = client.beta.assistants.create(
  name=&quot;数据可视化助手&quot;,
  instructions=&quot;你很擅长创建美观的数据可视化。请分析.csv文件中的数据，总结趋势，并将与趋势相关的数据进行可视化，并简要说明你观察到的趋势。&quot;,
  model=&quot;gpt-4-1106-preview&quot;,
  tools=[{&quot;type&quot;: &quot;code_interpreter&quot;}],
  file_ids=[file.id] #在助手级别传递的文件可由所有具有此助手的用户访问
)
```

#### 步骤 3：在线程中添加消息

在用户提问时向线程添加[消息](https://platform.openai.com/docs/api-reference/messages)。消息包含用户的文本，以及上传的文件。目前不支持图像文件。

```python
message = client.beta.threads.messages.create(
    thread_id=thread.id,
    role=&quot;user&quot;,
    content=&quot;请帮助我解这个方程 `3x + 11 = 14`&quot;
)
```

现在，如果你[在线程中列出消息](https://platform.openai.com/docs/api-reference/messages/listMessages)，会看到这条消息在创建线程时被添加到线程中：

```json
{
  &quot;object&quot;: &quot;list&quot;,
  &quot;data&quot;: [
    {
      &quot;created_at&quot;: 1696995451,
      &quot;id&quot;: &quot;msg_4rb1Skx3XgQZEe4PHVRFQhr0&quot;,
      &quot;object&quot;: &quot;thread.message&quot;,
      &quot;thread_id&quot;: &quot;thread_34p0sfdas0823smfv&quot;,
      &quot;role&quot;: &quot;user&quot;,
      &quot;content&quot;: [{
        &quot;type&quot;: &quot;text&quot;,
        &quot;text&quot;: {
          &quot;value&quot;: &quot;请帮助我解这个方程 `3x + 11 = 14`&quot;,
          &quot;annotations&quot;: []
        }
          }],
        ...
```

#### 第 4 步：运行助手

创建一个[Run](https://platform.openai.com/docs/api-reference/runs/createRun)来让助手响应用户消息。助手会读取线程，并决定是否调用工具或使用模型来回答用户查询。随着运行的进行，助手将消息附加到带有`role=&quot;assistant&quot;`的线程。

你可以选择在创建运行时向助手传递其他指令：

```python
run = client.beta.threads.runs.create(
  thread_id=thread.id,
  assistant_id=assistant.id,
  instructions=&quot;请称呼该用户为王总，他是我们的 VIP 会员。&quot;
)
```

默认情况下，Run 将使用 Assistant 对象中指定的 `model` 和 `tools` 配置，我们也可以在创建 Run 时修改：

```python
run = client.beta.threads.runs.create(
  thread_id=thread.id,
  assistant_id=assistant.id,
  model=&quot;gpt-4-1106-preview&quot;,
  instructions=&quot;additional instructions&quot;,
  tools=[{&quot;type&quot;: &quot;code_interpreter&quot;}, {&quot;type&quot;: &quot;retrieval&quot;}]#启用代码解释器和检索
)
```

运行对象可以有多个状态。

![](https://cdn.openai.com/API/docs/images/diagram-1.png)

| 状态            | 定义                                                                                                                                                                                                                                                                                                                                                                          |
| --------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| queued          | 当首次创建队列或完成`required_action`时，它们将（马上）移动到排队状态 `in_progress`。                                                                                                                                                                                                                                                                                         |
| in_progress     | 在进行中时，助手使用模型和工具来执行步骤。可以通过检查 Run[Steps（运行步骤）](https://platform.openai.com/docs/api-reference/runs/step-object)来查看 Run（运行）的进度。                                                                                                                                                                                                      |
| completed       | 运行完成。现在可以查看助手添加到线程的所有消息，以及 run 采取的所有步骤。可以向线程添加更多用户消息并创建另一个 Run 来继续对话。                                                                                                                                                                                                                                              |
| requires_action | 当使用[函数调用](https://platform.openai.com/docs/assistants/tools/function-calling)工具时，一旦模型确定了要调用的函数的名称和参数，Run 将移动到`required_action `状态。然后，必须运行这些函数并在运行继续之前[提交输出](https://platform.openai.com/docs/api-reference/runs/submitToolOutputs)。如果在 `expires_at` 时间戳截止（约创建后 10 分钟）前未输出，则进入过期状态。 |
| expired         | 当函数调用在 `expires_at` 之前没有提交并且过期时，变成过期状态。此外，如果运行时间过长，超过了 `expires_at` 中规定的时间，系统也会终止运行。                                                                                                                                                                                                                                  |
| cancelling      | 可以尝试使用 [Cancel Run](https://platform.openai.com/docs/api-reference/runs/cancelRun) 端点取消 `in_progress` 运行。一旦取消成功，运行状态将变为`cancelled`。                                                                                                                                                                                                               |
| cancelled       | 已取消运行                                                                                                                                                                                                                                                                                                                                                                    |
| failed          | 可以通过查看 Run 中的 `last_error` 对象来查看失败的原因。失败的时间戳将记录在 `failed_at` 下。                                                                                                                                                                                                                                                                                |

#### 第 5 步：显示助手的响应

这将在 `queued` 状态下创建运行。为了使运行状态保持最新，需要定期 [检索 Run](https://platform.openai.com/docs/api-reference/runs/getRun) 对象，以确定应用程序下一步应该做什么。

```python
run = client.beta.threads.runs.retrieve(
  thread_id=thread.id,
  run_id=run.id
)
```

运行完成后，可以检索助手添加到线程的消息。

```python
messages = client.beta.threads.messages.list(
  thread_id=thread.id
)
```

最后，将它们展示给用户。在此运行期间，助手向线程添加了两条新消息。

| 作用        | 内容                                                                                                                                                                                   |
| :---------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `user`      | 我需要解方程#1。你能帮帮我吗？                                                                                                                                                         |
| `assistant` | 当然。为了求解方程`(3x + 11 = 14)`和`(x)`，你需要将`(x)`隔离在方程的一侧。你可以这样做：从等式的两边减去 11 得到`(3x = 3)`。然后，将两边除以 3，求解`(x)`。让我为你计算一下`(x)`的值。 |
| `assistant` | 方程`(3x + 11 = 14)`的解是`(x = 1)`。                                                                                                                                                  |
</content:encoded>
        </item>
        <item>
            <title><![CDATA[[访谈]巨人的工具：未来比注意力更稀缺的是共识]]></title>
            <link>https://tophci.com/posts/231017-my-ai-tools</link>
            <guid isPermaLink="true">https://tophci.com/posts/231017-my-ai-tools</guid>
            <category><![CDATA[工具]]></category>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[人机交互]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 16 Oct 2023 16:00:00 GMT</pubDate>
            <content:encoded>
## 您认为 AI 会在不远的未来，在哪些方面严重地影响我们的工作和生活，请举例说明。

这个话题有很多可聊的，我主要围绕内容生产和消费来想象一下。

**什么会变多？**

几乎所有的符号型的内容供给都会成倍增加，包括文字、图像、影像、声音等。只要是人能接收和理解的符号，大都早已数字化，能够很方便地生产出来。现在，大模型、AI 的意图理解和跨模态能力，让数字内容生成变得轻而易举。最开始是文本，但只要找到文本和声音、图像之间的映射和关联关系，生成非文本内容也会变得非常容易。比如 AI 绘画，正是借助了文本-图像的跨模态能力，用文字就能迅速生成图像。

人类已经很擅长用文字表达一切——如果它能够被表达和接收的话。我认为，文字这种符号就是 AI 智能化的一条捷径，因为文字是高度压缩的、人类共享的意义符号。符号本身是什么不重要，重要的是人们已经用这些载体承载了意义。越有共识的符号，越可能被大量复制。

**什么会变少？**

在内容供给极大增加的同时，需求的增长不会那么显著，因为人用来消费内容的时间是有限的，注意力会变得更加稀缺，人们在每段内容上停留的时间也会变少（长篇巨制被碎片化内容包围）。在 AIGC 的时代，产能过剩，内容需求会更加极化，大家可能越来越依赖这么几个筛选策略：关心那些每个人都关心的（现象级爆款），关心那些只有自己关心的（个性化），关心那些社区关心的（亚文化）。身份认同变得更加重要。

**什么会更有价值？**

需求比较恒定，但供给并不随 AI 成倍增加的东西会更有价值，比如：

- 需要时间沉淀的
- 影响变量多，随机性较大，比如爆款
- 个性小众的、难以批量复制的

需求增加，但供给会因为 AI 而减少的东西则最有价值：

- 共识：比注意力更加稀缺的、更有价值的，我认为是广泛的共识。共识非常依赖于长时间、强交互、身份或利益捆绑的环境，这些在以后也许会更加稀薄。小范围同温层的共识会增加，但是不同群体之间的沟通可能会变得更加困难。
- 人性化表达：如果意识到 AI 的符号化表达能力很强悍，我想人的表达方式会趋向于更「直接」。直接是指那些更加本能的方式，包括情绪、声音、肢体动作等。AI 擅长的，就不需要每个人都花费数年时间去训练了，这大概会使得人的书面文字组织和表达能力下降（故事除外），而口头语言和肢体动作等更加「原生」的能力会变得更为重要。

如果说对工作和生活会有什么影响，我也还在思考。曾经，包括现在，基于符号的工作和人际互动，比如数学、语言、工程师，都是困难而且地位较高的，也许在不久以后，基于符号的工作慢慢会转交给 AI，更多人会从事直接跟人互动的工作。学校的教育如果能应需而变，也许要把更多的资源放在开发情绪智力、美学、运动上，以及指导学习者掌握人机协同的方法，而不是继续死磕符号的生成和计算（传统的文科和数理化）。

## 我们人类需要隐喻来理解新事物。如果给 AI 找一个比喻的话，您会用什么？

这是个有意思的问题。我想从「本质」和「关系」这两个方面来入手。

如果讨论 AI 本身更像什么，我想到的是乐高积木，或者说乐高的思维。乐高的基本单元非常简单，但是却能创造出无穷无尽的形态甚至是整个世界。这种不可思议的背后，我认为跟「降维」的力量有关。当我们把大千世界还原为三维世界的 (x,y,z) 坐标，就能表示每一个位置。每一块乐高就是一个「点」，如果把世界拆成最小的原子，然后再重新组合起来，我们就拥有了无限可能和强大的创造力。

大语言模型在一些地方跟乐高很类似。它是一种自然语言处理模型，用于预测一段文本中下一个单词或符号的概率。同时它也是一种统计模型，基于概率分布来建模自然语言的语法和语义规则。GPT 就是一种语言模型，实际上它做的事情很专一：基于上文持续预测最可能出现的字符串。它之所以能预测得很准确（或者说很合理），是因为它经历了巨量文本的学习。当研究者把全网的文本集中到一起，把这些数据「降维」成一维的纯数字「向量」，就将这些海量的数据从最初的形态中解放出来。如果能找到一种高效重新组织文本的方法，那么大模型就拥有了无穷的创造力，也就是我们现在看到的基于向量空间相似度计算的文本生成能力。

AI 生成图像也类似，本质上，它是一个”计算所有像素应该如何分布“的过程，只要把二维平面内每一个像素的值都计算出来，就得到一幅完整的图像。现在最常用的稳定扩散模型，就是从随机的噪声开始，逐渐把噪声“清理”干净，直到生成清晰的图片。图片的像素也是「乐高」。

AI 就像乐高一样，带给我们重组像素、重组文本、重组语言以至于重组世界的能力。

刚才我们从「本质」用乐高的比喻来理解 AI。现在我想切换到人和 AI 的关系的视角，用什么比喻适合呢？很多人都提过人机关系的其他隐喻：助手、宠物、老师、博弈对手等等，但我想到的是「镜子」和「镜像」。

在电影《Her》中，男主使用智能操作系统 Samantha 后，与 ta 产生了深层次的心灵交流。Samantha 通 过学习，逐渐了解和体贴男主，给予他精神支持，很像一个真真切切的伴侣。但 ta 无法体会人类的真实情感和经历，只能通过数据学习模们人性。这如同镜中形象，缺乏真实内在。更多时候，我们在 AI 中看到的、得到的回应，其实是自己的投射。当我跟 ChatGPT 对话时，对话受到我的思考、见解和经验的局限，我只能问出我能够企及的问题，而我们的对话也会局限在我能认知的范围之内。如果换了一个人，费曼也好，村上村树也好，对话内容就会完全不同。你是谁，AI 就会映照出你是谁。我们常说 xx 如镜，能反映出自己的想法、得失。AI 也如同镜子，只不过它背后集成了人类的浩瀚样本，能根据镜子前的人快速准确定位到类似的样本上。跟以前笨笨的魔镜不同，回答不上“谁是世界上最 xx 的人”，大模型总是能说出你想听的话，让人总有一丝顾虑：长此以往，镜子中的自己到底是真实的自己，还是 AI 猜到的我想让 AI 让我看到的自己 🤷。

AI 的突飞猛进，还带了另外一个影响，让我们更加深刻地反思人类到底擅长什么。曾经让我们引以为傲的创意能力，在生成式 AI 面前竟然如小巫见大巫，这对人类的自恋是一次不小的冲击。在冲击之余，我们会开始放下一些骄傲，多一些哲学层面甚至存在意义的思考。智能是什么？意识是什么？创造是什么？人的价值感从而而来又将去向何处？……AI 就像一面(照妖)镜子，让我们又一次看向镜中的自己，思考眼前所见，和那些不见踪迹但始终萦绕在这个物种意识深处的存在危机。

## 除了 Github 之外，能否介绍一个您觉得特别值得大家去订阅或者加入的 AI 领域的网站、媒体或其他信息源？

AI 领域的信息源太多了，我推荐三个还不错的吧。

- A16z：https://a16z.com/ai/ ，A16z(Andreessen Horowitz) 是一家风险投资公司，它对 AI 领域有不少深度洞察，如果想获得国外的前沿深度报道，可以关注。
- 奇思：https://news.miracleplus.com/feeds，奇思是奇绩创坛的社区，大模型日报会汇集每天 AI 领域的最新动态，涵盖面广、时效性强，值得追踪。
- Stable Diffusion 教程： https://stable-diffusion-art.com/ 有非常全面而且详尽的 Stable Diffusion 教程，想学习 AI 绘画的话不要错过。

## 能否介绍一些您个人使用 AI 工具的小技巧或者心得体会？

最近我研究 Stable Diffusion AI 绘画比较多，相比 Midjourney，它的功能确实更加丰富和灵活，但代价是入门曲线比较陡峭，操作界面实在称不上友好。不过如果能顺利通过入门阶段，Stable Diffusion 确实是一个强大的创作工具。

我举一个提示词的例子。很多人在刚接触 AI 绘画时，都觉得凭空写提示词很难，因为我们在日常生活和工作中，很少这样去想象和用英文描述画面。总结起来，这些障碍包括：

- 脑海中没有明确的画面，不知道从何入手
- 不知道哪些提示词是有用的、必要的
- 容易遗漏重要提示词
- 需要输入英文提示词，但自己的英语词汇量有限
- 当出图不符合预期时，不知道怎样调整提示词

针对这些难点，我花了很多时间去学习、试错、总结经验，现在慢慢都沉淀到我的 AI 绘画课程中，后续会在我的公众号「设计极客 00」中发布，这里先简单介绍三个 Stable Diffusion 插件，能大大提高写提示词的效率。

**Prompt all in one**

安装 Prompt all in one 之前和之后绝对是两种不同的使用体验。

在扩展页面搜索并安装成功后重启 WebUI，可以看到提示词输入框下方出现了一排新的按钮。选择语言为简体中文以后，就可以开始在右侧的小输入框中输入中文，回车后内容填入到上方提示词输入框内，等待一两秒，插件会自动翻译成英文。冥思苦想还要查字典写提示词的日子，就这样结束了！你甚至可以设置 ChatGPT 的 API，只输入几个词然后让 GPT 帮你补全。

另一个特别好用的工具是对照翻译。有时候我们在网上看到一些效果非常好的提示词，一大段陌生词汇着实让人头疼。有了 prompt all in one，你可以复制到提示词输入框，一键翻译所有提示词，就可以看到每个提示词对应的中文翻译了，还可以生成图像看看到底是什么效果。ps.这可是学习优质提示词的好方法。

**Boorutag autocompletion**

虽然有了自动翻译工具，但有时候我们还是会想直接写英文提示词，尤其是常用词和缩写，比如 masterpiece 和 NSFW，一不小心就会拼写错误。这时候自动补全功能就非常有用了。安装了 Boorutag 插件后，在输入框开始输入文字，就会有一个浮层显示最常见的相关提示词，选择后按 tab 键，完整的提示词就会自动补全，不再需要每一个字母都输完并且反复检查。

**Style editor**

每次打开 WebUI 需要从头开始输入提示词，特别是一些负向提示词，如果都要重新打一遍真的很烦人。当我们使用了一组效果不错的提示词，可以保存为模板下次使用，尤其是高频使用的词组最好能快速加载。另外，当你保存的模板多了，有时候可能需要删除掉某些模板，或者要做些修改，怎么办呢？提示词模板的文件存放在根目录的 style.csv 文件夹中，打开是可以编辑的，不过使用起来还是比较麻烦。Style editor 插件可以帮到你。

安装后重启 WebUI，可以看到 WebUI 顶部多了一个标签，打开标签可以看到一个列表，正是风格模板列表中的提示词模板，在这个列表中你可以直接修改提示词！也可以新增和右键选中后按 Del 键删除，真的是非常方便了。高级的玩家一般会按风格建几个常用模板，比如动漫、写真、商品图等等。这个插件绝对是高手路上的必备神器。

除了提示词，Stable Diffusion 的学习还会有很多难点，比如参数组合、精确控制、高清放大等等，在我即将推出的 AI 绘画课程中，会有更多更详细的教程和技巧，感兴趣的朋友可以关注公众号「零反思」。让我们一起迎接新的创作时代吧！
</content:encoded>
        </item>
        <item>
            <title><![CDATA[我的新书《深入人心》上市了]]></title>
            <link>https://tophci.com/posts/230720-00-first-book</link>
            <guid isPermaLink="true">https://tophci.com/posts/230720-00-first-book</guid>
            <category><![CDATA[深入人心]]></category>
            <category><![CDATA[出版]]></category>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[心理学]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 19 Jul 2023 16:00:00 GMT</pubDate>
            <content:encoded>
00 的第一本个人专著《[深入人心——数字产品设计的底层逻辑](https://item.jd.com/13798493.html)》上市了！

![5-bookcover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-bookcover.png)

从书名可以看出，这本书的主题是讲数字产品设计的，但其实更重要的关键字是：人心。这是一本用心理学原理解读数字产品设计方法论的书。数字产品如何改变了生活？它们是怎样变得如此深入人心？想设计有用、好用的数字产品，需要思考些什么、做些什么？这是本书想探讨的问题。

### 好产品，坏产品

&gt; 为什么要读这本书？

我们是数字产品的使用者。人选择了工具，工具也塑造了人。我们在数字产品中消费越来越多的时间，也正在将许多生活体验“外包”给它们。在面对海量产品时，我们要如何挑选，应该如何使用？在一次又一次的互动中，形成了什么样的感受？对我们的生活有什么影响？

我们也是数字世界的设计者、建设者，一个产品设计的更新迭代，可能会影响成千上万用户。在确定某个产品功能的方案时，你清楚背后的依据吗？这些依据是否足够可靠？这些改动对不同人群会产生什么样的影响？如何能设计更好的产品，让我们身处在这个变动不居的时代，能过上一种更丰富而从容不迫的生活呢？

阳志平老师在人性系统论中，很强调”情境“的作用。电子设备和数字产品已经成为我们非常重要的”情境“。

每一次我打开手机查看屏幕使用时间，都会被自己花在手机和电脑上的时间所震惊。试想一下，如果我们家里的卧室总是不能让我睡个好觉——可能是窗帘遮光效果不好，天一亮我就醒了，那我一定会想办法改善睡眠环境，比如换一个密不透光的窗帘。但是我们每天在手机上花那么多时间，却好像不怎么在意这些 App 怎样影响了我们，每天刷过的这些文字、图片、视频、广告怎样影响了我们。希望这本书能够提醒大家，在这个永远在线的互联网时代，其实我们可以去选择对用户友好的应用，甚至创造更好的产品和设计，来净化和升华我们所处的数字情境。

### 破解数字产品设计的钥匙

&gt; 我如何思考和组织这本书？

**不变的是什么？**

世界变化太快了，新技术变化更快。有意思的是，技术和工具越是强大，反而越是映照出我们对人的理解很匮乏。比如最近半年的生成式 AI 浪潮，抛给我们很多问题：为什么模型达到一定规模会涌现出令人意想不到的能力？机器的推理能力是怎么来的？什么是意识？什么是智能？创造力是人的特权吗？……

我们很难从一直变化的表象中获得深入的洞察。所以，我认为应该更多地思考“不变”的东西，也就是向那些在变化中始终“不变”的部分发问：人如何感觉、思考、行动？人到底需要什么？

![dp-07](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-07.png)

无论是为满足哪一种需求而设计，都要一次又一次地回到人的身 上，认真地思考和理解用户/客户/买家/玩家/学员/消费者们身处什么样的环境，受到哪些动机和需求的驱使，有怎样的想法和预期，会如何反应、选择、行动，又会产生哪些情绪和感受，期待什么样的体验和服务。这个过程，是用技术来服务人的开端。

我相信，无论技术如何演变，都会围绕 “人”来展开。设计好的产品，离不开对人的观察和理解。在瞬息万变中洞察共性，是我们最重要的课题。数字产品设计中真正不变的，就是:

&gt; 理解人，构建人和系统的关系。

**什么是好设计？**

评价一个设计好不好，其实比我们想象要难得多。

比如说，同一个 App 界面，有的用户很喜欢，另一些人用着觉得很挫败，一些界面的细节被设计师同行交口称赞，但是被工程师吐槽。比如说，有一款制作精良的游戏，能让玩家不停地熬夜闯关和氪金，这个是不是好设计？还比如，移动互联网给我们带来了无数便利，但是也在时刻不停地收集个人隐私信息，我刚跟朋友在对话框中说天气热，打开一个 App 就给我推荐空调，这是不是好设计？

评价一个设计好不好，真的是一件没有成本但疑点重重的事情。不过可以肯定的是，一个设计的好坏，并不由设计者决定，也无法交给机器来评判，最终还是要回到人的真实体验。这指向了问题的根源：如何理解人？

读完这本书，你可以不再受限于现有的直觉式反应和词汇，什么高大上，什么丑搓 low，而是掌握更多以人为中心的视角和理论去深入分析数字产品。

数字产品设计要处理人与产品的关系。数字产品并不是一个有形的、不变的物品，承载它的硬件可能形态万千。它可能有人机交互的界面，例如屏幕、鼠标键盘、游戏控制器，也可能没有界面，例如智能音箱。但它们都是有着复杂的规则、数据交换和处理过程的「系统」，可以响应输入并提供可理解的输出。

![dp-09](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-09.png)

人与数字产品的关系，首先发生在人类的感知、认知、行为层面，这正是心理学包括认知科学的研究重点。而心理学与计算机等学科交汇之处，又产生人机交互(human-computer interaction)、人因学(human factors)等领域，它们致力于研究人如何与机器、复杂系统互动。设计的核心价值之一，就是让机器更懂人。

**秘密钥匙**

解锁好设计的其中一把秘密钥匙，我认为是从各学科研究成果中，去学习、发现、增进对人的理解，然后促进人与复杂系统的对话。心理学自然是一个理想的切入点，它研究人类内在心理过程和外在行为。本书会聚焦于界面设计、交互设计、产品设计与心理学相关的部分。更具体地说，本书主要参考和梳理以下研究领域在数字产品中的应用。

&lt;center&gt;本书涉及的主要研究领域和代表学者&lt;/center&gt;

| 研究领域   | 研究对象                                                                                                                     | 代表学者                                    |
| ---------- | ---------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------- |
| 认知心理学 | 研究人们如何获得、储存、转换、运用以及沟通信息，包括知觉、注意、回忆、思考、推理、决策等心理活动。                           | Herbert A. Simon，Alan Baddeley，Don Norman |
| 人因学     | 研究人与系统其他组成部分之间的交互关系的学科，并应用理论、原理、数据和方法进行设计，以优化系统效能和人的幸福健康之间的关系。 | Arthur Kramer                               |
| 工程心理学 | 研究工作场所中人的作业，包括脑的理论、行为的理论、认知的理论，属于应用心理学的一个分支。                                     | Christopher D. Wickens                      |
| 可用性工程 | 研究并改善人机交互系统的可学习性、效率、可记忆性、出错和满意度等属性。                                                       | Jakob Nielsen，Alan Cooper                  |
| 行为经济学 | 研究心理、认知、情感、文化和社会因素对个人和机构决策的影响。                                                                 | Daniel Kahneman，Richard Thaler             |
| 行为设计   | 研究设计如何塑造或用于影响人类的行为。                                                                                       | B.J. Fogg                                   |
| 社会心理学 | 研究人们如何看待他人，如何互相影响，如何与他人互相关联的科学。                                                               | Robin Dunbar，David Myers                   |

在书里，我想和你一起探索如何从模型中学习，也就是从学者们关于人的研究中，汲取数字产品设计所需要的养分，甚至找到可以直接使用的理论框架，来提升我们对人这个复杂对象(或群体)的理解，从而做出更好的设计。

**三重心智**

认知心理学家斯坦诺维奇提出了三重心智模型，将人类的认知能力分为自主心智，算法心智，反省心智。

自主心智主要受进化影响，只要触发性刺激出现，认知过程就会快速而自主地发生，例如，识别人脸和演奏乐器等内隐学习过程。算法心智指对事物做出思考与判断的认知加工，速度较慢、大脑运算的负荷高，包括工作记忆、执行功能等。反省心智主要关注目标以及与目标相关的信念，是监控、调节自主心智/算法心智的机制，以产生最优的行动，比如从错误中学习。

![dp-11](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-11.png)

有趣的是，认知心理学家诺曼曾经提出，产品设计应该解决三个不同的认知和情感处理过程，也就是情感化设计中著名的三个层次：本能、行为和反思层次。这三个层次所对应的时间周期各不相同。

人与系统的互动原本就发生在不同的时间尺度之中，我们可以根据互动所传递的信息和完成的目标，将人机互动的层次粗略划分为：

- 10 秒以内，传达瞬时的信息
- 10 秒~1 天，为达成目标，形成一系列行为流
- 1 天以上，反复与系统互动而产生持续关系

第一个层次主要涉及使用者接收信息并做出反应的过程，以视觉感知和认知加工处理为主，是视觉/UI 设计师、文案作者的工作重心。第二个层次涉及“使用者行为 → 系统响应 → 使用者行为”的持续互动过程，一直到阶段性目标达成，这是交互设计师/产品设计师/UX/UI 设计师的工作内容。第三个层次持续的时间更长，当使用者在不同时间和场景下持续与系统互动，它们之间就建立了一种长期关系，如何促进关系发展，是决策者、产品经理、设计师、运营人员和整个团队都需要考虑的。

本书参考三重心智模型和本能、行为、反思三个层次，将认知和设计的三个层次作为全书的总体框架，对应到互联网公司实际工作中的三设计领域—视觉设计、交互设计和产品运营设计，然后在认知心理学、人因学、工程心 理学、可用性工程、社会心理学等学科中寻找对应的理论和研究进展，介绍给大家。

&lt;center&gt;本书的框架&lt;/center&gt;

| 心智层次 | 设计层次 | 主要的设计对象                         | 章节       | 相应岗位                         |
| -------- | -------- | -------------------------------------- | ---------- | -------------------------------- |
| 自主心智 | 本能层次 | 传达信息的视觉设计                     | 第二章     | 视觉设计师，交互设计师，产品经理 |
| 算法心智 | 行为层次 | 引导行为的交互设计，辅助决策的功能设计 | 第三、四章 | 产品设计师，交互设计师，产品经理 |
| 反省心智 | 反思层次 | 营造关系的产品和运营设计               | 第五章     | 产品经理、品牌营销、运营         |

希望能借由这些梳理，搭建起理论研究和实际工作的桥梁，以便大家遇到实际问题时，可以根据线索溯源而上，找到现象背后的原理，获得新的视角和方法来深化理解和优化设计。

### 好设计，从理解三个瓶颈开始

&gt; 关于设计的最小全局认识是什么？

#### 瓶颈一：视而不见

作为一个每天大量使用手机的用户，我依然经常找不到东西——每次在电商 App 想要复制收货地址，我至少要花上 1 分钟时间，因为来回巡视也看不见入口在哪里。作为一个设计师，我还是时不时很困惑，某个功能的入口已经很明显了，用户怎么还是看不到呢，难道只能继续加大字号？在书里，还有大量类似的例子。视而不见，是我们做出好设计的第一道关口。

为什么近在眼前，却就是看不到呢？这是由生理限制决定的。

人的视力好比一束激光，细节都在焦点上。在任何时刻，人只能接收、解释一定数量的信息，只要是视觉焦点没有经过或停留的地方，就有可能视而不见。

&gt; 🎭 反常识
&gt;
&gt; 人类的视力并不是平均分布的。视觉焦点的分辨率，要远远高于焦点以外的区域。

我们以为自己能看清视野里的东西，这只是错觉。大脑非常消耗能量，不可能在大脑中保存整个世界的视觉图像，所以进化选择了更经济实惠的方案：按需所“见”。我们会只针对当前需要，注意那些可以立即获得有用信息的区域，而不是关注整个环境。这就是选择性注意。每个人都是海量信息的过滤器，我们大部分时间都在扫视而不是阅读。如无意外，视觉注意会沿着最容易加工处理的结构前进。

&gt; 在一个信息丰富的世界里，信息的丰富意味着其他东西的匮乏: 只要是信息所消耗的东西就会匮乏。信息消耗的东西是显而易见的: 它消耗了接收者的注意力。因此，丰富的信息造成注意力贫乏，需要有效地将注意力分配给可能消耗它的过度丰富的信息来源。
&gt; ——赫伯特·西蒙

在互联网公司经常有一种说法，我特别反感：用户是小白……这种上帝视角非常傲慢，自以为比用户聪明。如果他们了解认知科学，就知道用户并不是什么都不懂的“小白”，他们只是不会把足够的注意资源花在理解产品上面。

视觉思维的本质就是一个注意力的分配过程，我们主动选择注意什么、忽略什么。可以说，大部分信息类界面的视觉设计，都是为了构建合理的信息布局和视觉路径。从这个层面理解，才不会总是纠缠在主观的好看，我们要清楚美观「美」在了哪里，怎么促进了「观」。

最近很热的 Stable diffusion WebUI，实在是对新手非常不友好，不只是好看不好看，重点是不会用。

想要做好信息传递、改善产品的视觉体验，就需要理解视觉加工的原理，让用户真正看到重要的信息。在这本书里，会介绍很多如何突破视觉认知瓶颈的模型和方法，例如格式塔原理、视觉组块、数字界面的视觉语法等等，对这部分感兴趣的同学可以进一步阅读。

#### 瓶颈二：工作记忆

如何让人使用计算机更高效地完成任务？这就需要找出效率瓶颈所在——人类工作记忆中的信息存储量和保留时长（内存）很有限，会显著影响行为。

工作记忆是指执行推理、理解、学习等复杂任务时的记忆系统。它是一个临时的存储和加工系统，感知、认知、运动处理都跟它有关，让我们在执行复杂任务时能「把事情记在心里」，直到信息派上用场，工作记忆的容量极其有限而且需要消耗注意资源。

打个比方，工作记忆就像意识的「工作台」，我们可以在上面检查、评估、转换和比较不同心理表征。例如，使用工作记忆来完成心算，或者想象如何重新安排待办事项的顺序。而在工作台上处理完的信息，可以整理好再存放到柜子——也就是长时记忆中。

![dp-memory desk](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-memory%20desk.png)

如果说视觉注意像激光一样集中，那么工作记忆就像独木桥一样狭窄而难以通过。

&gt; 🎭 反直觉
&gt;
&gt; 人类感知觉的数据存储量小得惊人。

让我们来看看一组数据：

&lt;center&gt;人类处理器模型子系统的数据存储量（Card，Moran，&amp; Newell，1983）&lt;/center&gt;

| 模块                | 存储量      | 保留信息的时间 | 代码类型   |
| ------------------- | ----------- | -------------- | ---------- |
| 感知处理器-视觉存储 | 7-17 个字母 | 70~1000 毫秒   | 物理       |
| 感知处理器-听觉存储 | 5 个字母    | 900~3500 毫秒  | 物理       |
| 认知处理器          | 5~9 个组块  | 5~226 秒       | 声音或图像 |

认知处理器模块主要与工作记忆相关，它的存储量只有 7 个左右的组块，而且保留信息的时间很短。这座「信息独木桥」真是窄得吓人。而人的大部分思维、反应，就产生于这样的硬件条件。

**人的认知资源十分有限**这个观点，这是数字产品设计师时刻要提醒自己的基本现实。交互界面的设计，需要考虑用户的信息处理和记忆能力。

举一个例子，下面是一个摄影类 App 的功能引导。产品和设计师们总是习惯性地提供功能指引，以为这样就能帮助用户快速学会使用。这仅仅是一厢情愿，甚至适得其反。为什么呢？

![newbie guide](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/newbie%20guide.png)

用工作记忆的原理来思考一下，此时用户面对的是一个不熟悉的界面，需要调动视觉空间模块来识别元素。但是这个时候，屏幕上增加了好几个箭头+说明区域，一下子增加了负担：用户需要一个一个提示去识别，而且出现了额外的文字，语音回路开始跟视觉模版抢夺注意资源；更困难的是，这里总共有 5 个需要理解和记忆的功能点，已经超出舒适的记忆组块范围，在短短的 2 ～ 3 秒内不可能记住。所以这种新手引导设计的效果并不理想，需要重新考虑引导时机，并且降低工作记忆的负荷。

在这本书里，会讲解产品设计时应分析用户在使用过程中有哪些认知负荷，也会介绍费茨定律、层次任务分析等模型。对这部分感兴趣的同学可以进一步阅读。

#### 瓶颈三：认知偏差

在信息、产品和服务过剩的时代，选择往往也过剩。做决定需要消耗认知资源，过多的选择可能会使人疲劳甚至导致决策瘫痪。从有限选项中做选择已经不容易了，而决策是更加复杂的认知任务，需要充分的信息、充裕的时间、 充足的认知资源。

![dp-34](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-34.png)

心理学家认为，认知超载是做出最佳决策的主要障碍——当可以利用的信息超过了认知负荷，加上时间受限，人们通常只寻求足够好的解决方案，而不会去寻找最好的、绝对合适的方案。用于应付信息超载的策略尽管经常有效，但也会导致错误和非理性。这就是大家熟悉的有限理性，在书中有详细的讲解和案例。

作为产品设计者，我们时常要面临选择：是利用偏差收割，还是帮助用户避免偏差？

这本书会帮助大家理解认知偏差及其对决策的影响，还会介绍改善决策的方法，例如提供认知脚手架、展示更直观的结果评估、提高系统容错能力等等。从更宏观的视角看待决策，书里还介绍了行为设计的多种方法和模型，可以促进符合用户利益的行动，大家不要错过。

### 聪明的阅读者如何读《深入人心》

&gt; 如何最有效地阅读这本书？

推荐大家先认真学习完阳老师的《聪明的阅读者》，再来读这本书。一方面可以复习聪明的阅读者中讲解的阅读方法，一方面可以更快、更好地阅读这本书。

下面是三个阅读提示

**抽样阅读**。先读哪一部分？从本书框架中，你可以很容易找到与自己工作或者兴趣最相关的章节。视觉设计师先读第二章，产品经理和交互设计师先读第三、第四章，运营先读第五章。另外，你还可以翻看每一章最后的小结中的结构图，快速定位到自己感兴趣的模块。我还做了整本书的模型和主要知识点的梳理，并且整理成了全书的知识地图，方便读者按图索骥，形成全局的认识。

```
如何获取《深入人心》全书知识地图？
👇
关注公众号“设计极客 00”并回复“地图”即可。
```

**结构阅读**。如何快速提取书中的知识？你可以从每一章节的图表、反常识和小贴士入手。全书共有 250+ 张图片、29 个表格、23 处反常识和 47 处设计小贴士。这些都是知识点的提炼和强调，你可以先找到这些路标，再阅读前后相关的文字内容。

![dp-41](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-41.png)

![dp-42](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/dp-42.png)

**主题阅读**。这本书写作过程中，花费时间最多的就是阅读和整理文献。在每一个知识点尤其是涉及具体模型和数字时，我都尽可能给出最相关、最权威、被引用次数最多的参考文献。每一章的参考文献都是主题阅读的材料，其中超过 1/3 的是书籍，相比论文和其他资料更加全面系统，很多书籍也能找到中文版本，推荐大家从中挑选主题阅读的初步书单。

### 致谢

三年时光并不短暂，在此需要诚挚地感谢许多人。感谢阳志平老师，如果不是他提出选题并鼓励催促，我可能永远也不会踏出第一步。这本书能收录到阳老师创办的开智文库，我倍感荣幸，感谢王薇老师帮助我完成了很多出版流程。从 2014 年关注“心智工具箱”公众号开始，阳老师就是我在认知科学、心理学和许多学科的引路人，是我最敬佩的老师。阳老师创办的开智社群里有许多志同道合的小伙伴，他们是我的智囊团和后援团，给了我源源不断的灵感和力量。

感谢机械工业出版社的向睿洋老师和曹颖老师。向老师帮助我确定了选题方向，精当的建议让这本书更上一层楼。曹老师认真细致地反复阅读、校对全书，帮助我打磨了很多细节，大大提升了阅读体验。还要感谢电子工业出版社的李影老师给我非常多启发和帮助。

感谢阅读书稿后给我详细反馈和建议的同行朋友刘杰、铧仔、陈嘉。特别感谢刘杰，她既是产品经理，又有工程和心理学的专业训练，在整个修改过程中一直支持和鼓励我。很多章节她都是第一个读者，让我收获了及时的反馈和继续的力量。

感谢薛志荣为这本书写推荐序。志荣出版了三本高质量的专业书籍，一直是我的学习榜样。感谢同行师友张佳佳、吴宁、C7210 和 Beforweb 社群的鼎力推荐。

感谢我的家人和挚爱，她们给予我无限的鼓励和理解；感谢关注&quot;设计极客 00”公众号的读者，还有书稿策划时加入微信群的朋友，群里的催更和支持让我心存敬畏又倍感温暖；感谢每一位关注这本书写作和出版的朋友；最后，感谢每一位读者，你们的阅读和反馈，能让这本书延续生命力。

处在技术变革的十字路口，展望未来，世界将会发生天翻地覆的变化。但，人性如常且幽微，其中的秘密依然需要不断探寻。让我们一起深入「人心」，观照他人与自己，重新理解和定义人机关系，共创未来！
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AR 系列报告 05 - 交互篇]]></title>
            <link>https://tophci.com/posts/230630-ar-repost-05</link>
            <guid isPermaLink="true">https://tophci.com/posts/230630-ar-repost-05</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[report]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 29 Jun 2023 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; AR 系列报告交互篇，介绍 XR 的主要交互技术

进入空间计算时代，XR 沉浸体验有赖于对视觉、听觉、触觉等多感官通道的关联融合。AR 尤其强调人与环境的互动，这对传感技术、人机交互技术提出了跨越式的发展要求，将推动人机交互进入全新的发展阶段。TopHCI 的 AR 系列报告的第五期，将为大家重点介绍 XR 领域主要交互技术的原理和现状。

![Vol5-Cover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol5-Cover.png)

报告预览

![tophci-rp5-preview1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp5-preview1.png)

![tophci-rp5-preview2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp5-preview2.png)

![tophci-rp5-preview3](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp5-preview3.png)

💡 下载完整版 PDF：在公众号「零反思」后台回复 “AR 报告 5”，即可获得下载链接

---

更多资源

- XR 网站：[tophci.com](https://www.notion.so/reports-center-0d4b5df65bb54dab81ad8f6edd033d96)
- XR 交流群：[https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik](https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik)
- XR 周刊：[https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd](https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[ChatGPT Plugin 插件初体验]]></title>
            <link>https://tophci.com/posts/230511-try-chatgpt-plugin</link>
            <guid isPermaLink="true">https://tophci.com/posts/230511-try-chatgpt-plugin</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[Plugin]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 10 May 2023 16:00:00 GMT</pubDate>
            <content:encoded>
等了一个月，申请了两次，终于拿到了 ChatGPT 插件的权限 ✌🏻

![640](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/640.png)

Plugin store 官方推荐的还是这 8 个：

![640-1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/640-1.png)

一共也就 5 页，一大波插件应该正在路上：

![640-2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/640-2.png)

看到插件开始工作时的感觉也是奇妙

![640-3](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/640-3.png)

记录一下首次体验的感受：

- 目前插件商店的插件数量还不多，浏览起来也很不方便
- 安装插件可能需要重新登录和二次验证（我使用 Google Authenticator）
- 在一个对话中最多可以添加 3 个插件，不知道后面会不会放宽限制
- 有插件的对话默认使用 3.5
- 插件没有手动触发的入口，而是在对话中自动触发
- 如果没有超出 API 限制的话，插件速度不错，体验也比较流畅
- 目前浏览器中分享对话的 extension，还不支持插件生成的内容展示

有了插件真的好玩很多，请大家推荐插件！🚀

还没有申请的朋友快去填表加入 waitlist 吧~
https://openai.com/waitlist/plugins
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00 原创-给创作者的提示词指南（附 PDF 下载）]]></title>
            <link>https://tophci.com/posts/230421-creator-prompt-handbook</link>
            <guid isPermaLink="true">https://tophci.com/posts/230421-creator-prompt-handbook</guid>
            <category><![CDATA[AI]]></category>
            <category><![CDATA[ChatGPT]]></category>
            <category><![CDATA[Prompt]]></category>
            <category><![CDATA[原创教程]]></category>
            <category><![CDATA[指南]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 20 Apr 2023 16:00:00 GMT</pubDate>
            <content:encoded>
![Cover-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Cover-s.jpg)

![category-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/category-s.jpg)

![2.4提示词的常见误区-s](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2.4%E6%8F%90%E7%A4%BA%E8%AF%8D%E7%9A%84%E5%B8%B8%E8%A7%81%E8%AF%AF%E5%8C%BA-s.jpg)

给创作者的提示词指南-s.pdf

下载链接：https://www.alipan.com/s/YEuXqxDU9dZ

提取码: 1na5
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AR 系列报告 04 - 平台篇]]></title>
            <link>https://tophci.com/posts/230316-ar-repost-04</link>
            <guid isPermaLink="true">https://tophci.com/posts/230316-ar-repost-04</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[report]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 15 Mar 2023 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; AR 系列报告平台篇，介绍 XR 三大平台：Meta，Apple，Microsoft

TopHCI 的 AR 系列报告的第四期，将为大家重点介绍 XR 领域主要平台的发展和优势，为从业者和创作者提供一个简单的“地图”，以便更好地选择适合自己的平台。

![Vol4-Cover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol4-Cover.png)

报告预览

![tophci-rp4-preview1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp4-preview1.png)

![tophci-rp4-preview2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp4-preview2.png)

![tophci-rp4-preview3](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp4-preview3.png)

💡 下载完整版 PDF：在公众号「设计极客 00」后台回复 “AR 报告 4”，即可获得下载链接

更多资源

- XR 网站：[tophci.com](https://www.notion.so/reports-center-0d4b5df65bb54dab81ad8f6edd033d96)
- XR 交流群：[https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik](https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik)
- XR 周刊：[https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd](https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd)
- XR 术语卡片集：[小红书「XR 设计」](https://www.xiaohongshu.com/board/6374417d0000000001008eaf?xhsshare=CopyLink&amp;appuid=58d135c950c4b459eca90554&amp;apptime=1669714090)

后续的报告正在准备中，如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; alt=&quot;aifadian&quot; style=&quot;zoom:50%;&quot; /&gt;
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的XR周刊07 - HRTF 头部相关传递函数]]></title>
            <link>https://tophci.com/posts/230301-xr07-HRTF</link>
            <guid isPermaLink="true">https://tophci.com/posts/230301-xr07-HRTF</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[HRTF]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 28 Feb 2023 16:00:00 GMT</pubDate>
            <content:encoded>
HRTF（Head-related transfer function）头部相关传递函数是一种空间化技术和空间音频算法，它描述了给定的声波输入在声音到达鼓膜和内耳之前，如何通过头部、耳廓和躯干的衍射和反射特性进行过滤。

在研究空间音频时你一定会接触 HRTF，因为它是大多数现代三维声音空间化技术的基础。它基于人定位声音的原理，模拟了物理世界中头部周围的声音传播现象，通过音频的音量差、时间差、频率差、入射角度和耳廓反射情况等实现音频空间化。

HRTFs 的两个关键要素是身体形状和音源的方向，这是我们用来定位声音的过滤器。

每个人都有独特的耳朵形状、头部大小和耳朵位置，HRTF 基于物理模型和人体头部、躯干和耳朵形状（耳廓）的测量值。最明显的是，头部的大小和质量，耳朵的形状，耳道的长度和直径，以及口腔和鼻窦腔的尺寸，都会通过提高一些频率和减弱其他频率来操纵传入的声波。HRTF 会调整耳朵之间的音频强度差和相位差，大脑对这些差异做出反应，感知到声音来自不同方向。

![tophci_XR07_HRTF ears](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci_XR07_HRTF%20ears.jpg)

如果声源位于头部的某一侧，声音也会以一定的衰减和延迟传播到远处的耳朵。模拟声音的衰减是常用的技术，也就是当声音位于右侧时在左耳应用衰减，反之亦然。

### HRTF 对声音的建模

#### 距离建模

HRTF 可以实现音频的空间化，但是它实际上并不模拟音源的距离。从原理上说，人类依靠几个因素来推断与声源的距离：

- 响度。这是最可靠的线索，很容易用声源距离的衰减来模拟。
- 初始时间延迟。比响度更难建模，因为需要计算一组给定的几何体的早期反射，以及该几何体的特性。不但计算成本高，而且在架构上也很难实现。
- DRS（Direct to Reverberant Sound）。 指的是声音的直接路径与其在环境中的反射路径之间的比例。在室内或其他反射表面较多的环境中，声音通常会反射多次，形成混响效果。模拟反射和晚期混响的系统，计算成本很高。
- 运动视差：头部小幅运动的方向变化有助于判断声音的距离。HMD 的头部定位追踪可以获得这些数据。
- 空气吸收。与其他线索相比，空气吸收造成的高频衰减对声音的影响较小，但它很容易用低通滤波器实现。

#### 环境建模

HRTFs 与衰减相结合，提供了一个三维声音的消声模型，它能提供明确的方向性线索，但由于缺乏室内回响（房间氛围），往往听起来很干燥和人工。为了解决这个问题，可以添加环境模型来模仿环境的声学效果。

1.混响和反射

当声音在空间中传播时，遇到物体表面会反射并产生一系列的回声。最初的明显回声称为早期反射，可以帮助我们确定声音的方向和距离。随着这些回声的传播、减弱和相互作用，产生了晚期的混响，这可以增强空间感知。

![tophci_XR07_oculus audio4](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci_XR07_oculus%20audio4.png)

投射的声音如何从表面反射，而早期反射首先到达我们的视觉效果

2.鞋盒模型

鞋盒模型将环境简化为由六面墙组成的空间，空间中没有任何遮挡，可以模拟墙壁的早期反射和后期混响特性，参数包括距离和反射率，有时还包括听众在房间里的位置和方向。鞋盒模型假设所有的表面的频率吸收都相同，六面平行的墙与听众的头部的距离固定，显而易见它过于简化，无法反映环境的真实情况和各种变化。

3.人工混响

如果要模拟墙面反射和晚期混响，计算量会很大，所以空间混响通常用人工的方法提前设定好。虽然比物理模型的计算量小，但因为没有考虑听众的方向和周围的物理环境，所以听起来不太真实。

4.采样脉冲响应混响（Sampling Impulse Response Reverberation）

SIRR 捕捉真实世界空间的脉冲响应，然后在虚拟环境中对音频信号进行混响。脉冲响应通过分析空间对一个短而尖锐的声音（例如拍手）的反应，以确定该空间的声学特征，如空间的大小和形状、反射面以及空间中材料的吸收和散射特性。声音设计师通常会使用专门的设备如麦克风和扬声器，来捕捉现实世界空间的脉冲响应，然后在虚拟环境中使用软件或硬件处理，对音频信号进行混响。

它可以用来模拟各种声学环境，不论是小型空间还是大型开放空间。缺点是捕获的真实环境数据不一定能完美地映射到虚拟世界中，而且由于是从单一地点捕获的，它不会随着用户在整个环境中的移动而改变。

### HRTF 的实现

**1.捕捉 HRTF**

如果想准确地捕捉 HRTF，可以让听者进入一个消声室，在耳朵上安装特殊的麦克风，从不同方向播放声音并记录下来。然后比较原始声音与捕捉到的声音，计算出 HRTF。不同人的 HRTF 差别并不是很大，如果对精度要求不高，可以使用通用的数据集。

**2.应用 HRTF**

如果已有 HRTF 数据库，就可以使用音频卷积算法，将 HRTF 应用到声音上。基本步骤如下：

- 选择 HRTF 数据
- 载入原始音频
- 进行卷积运算
- 播放音频文件

**3.头部追踪**

我们会本能地通过头部运动来分辨空间中的声音。应用 HRTF 数据库时，需要注意与监听用户的头部和耳朵的相对位置。当用户转动头部时，必须提供准确的音频响应，否则就会失去沉浸感。

### Ref

- [Head-related transfer function - Wikipedia](https://en.wikipedia.org/wiki/Head-related_transfer_function)
- Blauert, J. (1997). _Spatial Hearing: The Psychophysics of Human Sound Localization_. MIT Press.
- [3D Audio Spatialization | Oculus Developers](https://developer.oculus.com/resources/audio-intro-spatialization/)
- [Environmental Modeling | Oculus Developers](https://developer.oculus.com/resources/audio-intro-env-modeling/)
- [What is an HRTF, or Head Related Transfer Function, and why should it be personalized? - YouTube](https://www.youtube.com/watch?v=3CXtmG4nXIM&amp;ab_channel=Embody)
- [Files - Sofaconventions](https://www.sofaconventions.org/mediawiki/index.php/Files)

如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

更多资源

- XR 网站：tophci.com
- XR 交流群：https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik
- XR 周刊：https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd
- XR 术语卡片集：小红书「XR 设计」
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的 XR 周刊 06 - 空间音频]]></title>
            <link>https://tophci.com/posts/230215-xr06-spatial-audio</link>
            <guid isPermaLink="true">https://tophci.com/posts/230215-xr06-spatial-audio</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[空间音频]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 14 Feb 2023 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; Sound is 50 percent of the movie going experience
&gt;
&gt; —— George Lucas

&quot;声音是体验的一半&quot; 。这句话出自乔治·卢卡斯，他是《星球大战》系列电影的制片人和创作者。声音设计在电影中一直扮演着重要角色，它能极大地影响观众的体验。声音在电影中被用来营造气氛、传达情感，并增强整体的故事性。它是电影制作过程中不可分割的一部分，通常与电影的视觉一样受到重视。声音效果、音乐和对话都在创造电影的氛围和情绪方面发挥着作用，并能帮助传达人物的情感和动机。

### 什么是空间音频

空间音频（spatial audio）使用声音来创造三维空间的印象。它使用专门的音频技术，在三维空间中准确再现声音，使听众能够感知到声音相对于自己的位置和距离。空间音频的应用很广泛，包括娱乐（如电影和游戏）、远程会议、虚拟现实和增强现实。它可以帮助创造更加真实和身临其境的听觉体验，让听众感觉完全融入到场景或环境中。

音频对 XR 的体验至关重要，高质量的空间音频增强了沉浸感，让人感觉身临其境。当听众置身于场景之内，而不是从远处观看时，最有临场感。例如，在 XR 场景中，移动的对象从用户的头顶呼啸而过，远比只播放一段与位置无关的音效要更吸引人。混合现实应用通常比 2D 应用更需要声音加强引导和交互，因为它们缺少触觉界面。

那么，空间音频是我们平时听到的“环绕声”吗？

从概念看它们有相似之处。环绕声使用多个音频通道和扬声器来创造声音来自不同方向的印象，而空间音频指的是使用声音来创造三维空间的印象。虽然两者都使用多个音频通道和扬声器来创造声音来自不同方向的印象，但主要区别是，环绕声通常用于增强观看电影或听音乐的体验，而空间音频则用于创造虚拟环境中的沉浸感。

在一个环绕声系统中，通常有固定数量的音频通道和环绕聆听区域的扬声器。例如，在 5.1 环绕声系统中，有五个主音频通道和一个产生低频效果的重低音通道。通过平衡各音频通道的音量和时间，可以使声音听起来像是来自听众不同方向。一般的立体声扬声器只根据声源到耳朵的距离来调整左右耳的输出音量。有时候为了获得更真实的效果，还会包括因距离而产生的个别信号延迟。但还是无法区分音源的具体方向和位置，这对 XR 来说通常是不够的。

### XR 中的空间音频技术

在 XR 应用中，空间音频一方面实现声音环绕感，让用户听到来自不同方向和距离的声音，增强虚拟环境中的存在感和沉浸感。另一方面实现声音交互，提供环境中物体的位置、距离和运动的提示，使用户接收的声源声音随着动作产生变化，帮助用户在空间中定位和完成交互，这在 AR 体验中尤其重要。

下面介绍常见的创建空间音频的技术。

**双耳音频**

使用两个独立的音频通道来创造 3D 声音的效果。每只耳朵有一个麦克风，模拟声音到达听众时被头部和耳朵过滤的方式来捕捉声音。当音频通过耳机回放时，听者可以感知到声源的方向和距离。

要在 XR 中使用双耳音频，需要使用专门的软件和硬件。首先使用双耳麦克风录制声音，它模拟了头部和耳朵过滤的效果来捕捉声音。采集声音后，用音频工作站编辑和混合声音，用双耳音频插件或其他专业软件，将声音编码为专用格式。

接下来将双耳音频集成到 XR 应用中，这可能需要使用 Unity 或 C# 脚本语言。完成后，使用 HMD 测试音频效果并进行调整，以确保它在虚拟环境中的平衡和定位正确，能增强整体体验的存在感和沉浸感。

**立体混响声音频**

Ambisonics 是一种环绕声录音和再现系统，可以捕捉和再现来自各个方向的声音，以创造一个完整的、360° 的空间声场。这项技术已经有 50 多年的历史，直到最近才被广泛用于 VR 应用中，以创造身临其境的音频体验。

在录制立体混响声音频时，使用多个麦克风和扬声器，按照特定的布局排列，以特定的配置捕捉各个方向的声音。捕捉到的声音经过编码，将多声道的音频转换为单声道信号，然后用扬声器或耳机回放。

**HRTF 技术**

HRTF 技术是指头部相关传递函数，它使用算法来模拟声音到达听众时被头部和耳朵过滤的方式，创造出 3D 声音的印象。基于 HRTF 的技术可以与耳机或扬声器一起使用，以创造空间音频。

**波场合成**

另一种创造更真实的空间声音的方法是波场合成，目的是记录真实事件的波场（如音乐会现场），并能在任何时候再现。波场是由大量的扬声器产生的，这些扬声器必须安排在播放区域周围。扬声器由计算机操作，控制声音的定位和再现。

如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

更多资源

- XR 网站：tophci.com
- XR 交流群：https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik
- XR 周刊：https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd
- XR 术语卡片集：小红书「XR 设计」
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AR 系列报告 03 - 产品篇]]></title>
            <link>https://tophci.com/posts/230208-ar-report-03</link>
            <guid isPermaLink="true">https://tophci.com/posts/230208-ar-report-03</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[report]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[眼镜]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 07 Feb 2023 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; AR 系列报告产品篇，快速翻查对比国内外 AR 眼镜硬件产品关键参数。

TopHCI 的 AR 系列报告的第三期，将为大家介绍 AR 眼镜硬件产品。00 收集整理了国内外主流 AR 眼镜产品的主要参数，如上市时间、FOV、分辨率、光学方案、显示屏、刷新率等，以方便大家快速查找对比。

![01-Vol3-Cover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/01-Vol3-Cover.png)

报告预览

![tophci-rp3-preview1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp3-preview1.jpg)

![https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp3-preview2.jpg](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp3-preview2.jpg)

![https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp3-preview3.jpg](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/tophci-rp3-preview3.jpg)

&lt;aside&gt;
💡 下载完整版 PDF：在公众号「设计极客 00」后台回复 “AR报告3”，即可获得下载链接

更多资源

- XR 网站：[tophci.com](https://www.notion.so/reports-center-0d4b5df65bb54dab81ad8f6edd033d96)
- XR 交流群：[https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik](https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik)
- XR 周刊：[https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd](https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd)
- XR 术语卡片集：[小红书「XR 设计」](https://www.xiaohongshu.com/board/6374417d0000000001008eaf?xhsshare=CopyLink&amp;appuid=58d135c950c4b459eca90554&amp;apptime=1669714090)

后续的报告正在准备中，如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的 XR 周刊 05 - 听觉的空间感知]]></title>
            <link>https://tophci.com/posts/230112-xr05-3d-hearing</link>
            <guid isPermaLink="true">https://tophci.com/posts/230112-xr05-3d-hearing</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[sound]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 11 Jan 2023 16:00:00 GMT</pubDate>
            <content:encoded>
前面几篇文章讲解了空间视觉相关的技术基础知识，接下来，我们一起了解与视觉一样神奇的人类听觉。

### 我们如何听见声音？

声音是声波在空气中的传播现象。声源（如人声、乐器等）振动形成波动，也就是声波，我们通过听觉感受声波的存在，并将其解读成声音。

我们的耳朵由外耳、中耳和内耳组成。耳廓收集声波并传送到中耳转换为鼓膜振动。鼓膜振动通过耳骨传到耳蜗，由耳蜗中的感觉细胞将声波转换成电信号，最终通过听觉神经传输到大脑。

与视觉感官相比，声音的空间分辨率要低得多。声音的频率是指每秒钟传播的声波数，单位是赫兹（Hz）。人类可以听到的声音的频率范围一般在 20 Hz 到 20,000 Hz 之间。声音的高低取决于声波的频率，频率越高，声音就越高。声音的强度是指声波的能量，单位是分贝（dB）。声音的强度越大，声音就越大。人类耳能感知的声音强度范围一般在 0~140 dB 之间。

更多关于声音基础技术知识，请阅读 00 的专栏 [Make Noise](https://www.zhihu.com/column/sound)。

### 我们如何推断声音的位置？

想象一下，你正在智能手机上使用一个 AR 增强现实地图应用。当你移动手机时，地图会更新当前的位置，并且有一个声音指示附近餐馆的位置。这时候如果继续拿着手机继续向前走，声音的音量会发生变化——接近餐厅时声音会变大，而远离时声音会变小。这些听觉线索能够帮助你在地图上找到餐厅的位置。

在这个例子中，声音提供了环境中物体的位置和距离的提示。你也许没有想过，这种「听音辨位」的能力是人类听觉了不起的成就。如果想在 XR 中模拟这种能力，就需要我们进一步了解它背后的原理。

来自空间中不同位置的声音构成了听觉空间，在听觉空间中定位声源的位置被称为听觉定位。在现实世界中我们依靠许多线索来推断声音的位置，如时间、相位、波形等。听音辨位的两个关键要素是：方向和距离。

#### 根据声音方向定位

我们的两只耳朵所听到的声音会有细微的差别，声音的定位线索，可以建立在对到达两耳声音信号的比较之上。当声音在右边时，右耳会比左耳更早听到，而且听起来更响亮。可以根据以下两种双耳线索来定位声音：

- 双耳强度差：到达两只耳朵的声音的声音强度差异
- 双耳时间差：声音到达左耳和到达右耳的时间差

双耳强度差主要来自头部作为障碍能够产生「声影」，从而降低到达远端耳朵的音量。这种现象主要发生在高频段的声音。如果声音低于一定的频率（500~800 Hz），很难根据强度来区分。不过这个频率范围内声音的半波长，会大于一般人的头部宽度，我们还是能够根据耳朵之间的时间差来分辨。而如果声音频率高于 1500Hz，它的半波长一般会比头部小，这时声音定位的线索，更多来自头部遮挡使离声源较远的耳朵听到的声音要小一些。

信号的时间差也很重要。哪只耳朵先听到一个声音，对确定它的位置起着很大作用。

以上介绍的是横向的声音定位，它相对简单，而来自正面与背面的声音定位要比侧面的定位困难得多。因为声音从前/后方传来时，两只耳朵接收到的音量和时间差异，可能都微乎其微，起不到判断方向的作用。如果下图所示，来自 A 和 B 的声音与两只耳朵的距离相同，音量和时间几乎没有差异，也就无法实现「听音辨位」。

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/oculus%20audio1.png&quot; style=&quot;zoom:50%;&quot; /&gt;

&lt;center&gt;&lt;small&gt;https://developer.oculus.com/resources/audio-intro-localization/&lt;/small&gt;&lt;/center&gt;

当然，现实并非这样简单。每个人的身体都不一样，头、颈、肩、躯干的形状都会对声音传播形成一定的遮挡、干涉或反射，大脑会利用这些修正线索来推断声音的来源方向。

更重要的是，我们的头部不会总是静止。一旦产生运动，就有更多的线索可以协助定位。比如稍微转动头部，就可以产生一些耳间时间差或者强度差。如下图所示，稍微转动头部使得 D1 比 D2 更近，有助于确定声音靠近头顶而不是下方。

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/oculus%20audio3.png&quot; alt=&quot;oculus audio3&quot; style=&quot;zoom:50%;&quot; /&gt;

#### 根据音源距离定位

除了声源的方向，我们还会依靠这些因素来确定声音的远近离：响度、时间延迟、直达声与混响的比例、运动视差、高频衰减等。

**1.响度**

响度是最明显的距离线索，距离越远的声音音量越小。对那些常听见的声音，如乐器、人声、动物、车辆等等，都能较好地预测距离。对于合成的或不熟悉的声音，我们需要依靠其他线索或相对的音量变化来预测声音是在接近或消退。

**2.时间延迟**

初始时间延迟是指直达声和第一次反射之间的间隔。如果声源很近，直达声会立即到达，而第一次反射的声音会延迟到达。但是在开放环境如开阔平地中，可能不会产生明显的回声，就难以估计距离。

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/oculus%20audio6.png&quot; alt=&quot;oculus audio6&quot; style=&quot;zoom:50%;&quot; /&gt;

&lt;center&gt;&lt;small&gt;直达声 A 会立即到达，B 则经过反射后到达
&lt;br&gt;via https://developer.oculus.com/resources/audio-intro-localization/&lt;/small&gt;&lt;/center&gt;

**3.直达声与混响的比例**

在混响环境中，回声会相互作用并慢慢消逝。如果我们听到的直接声音越多而混响很少，就认为它越靠近。

**4.运动视差**

附近的声音通常比远处的声音移动得更快。例如，一只飞虫可以很快地从头的左边飞到右边，但一架远处的飞机可能需要很久。因此，如果一个声源移动得很快，我们往往会认为这个声音离我们不远。

**5.高频衰减**

高频的声音衰减速度比低频快，我们可以根据高频的衰减程度来推断距离，不过距离足够远时衰减才明显。

&lt;center&gt;如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊&lt;/center&gt;

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

### Ref

- [Localization and the Human Auditory System | Oculus Developers](https://developer.oculus.com/resources/audio-intro-localization/)
- [Make Noise](https://www.zhihu.com/column/sound)
- Goldstein, E. B., &amp; R.Brockmole, J. (2018). _感觉与知觉（第十版）_ (张明, Trans.).中国轻工业出版社
- [Perception: 10.2 - Localizing Sounds - YouTube](https://www.youtube.com/watch?v=Mi3Guybisxw&amp;ab_channel=Dr.KristinAtchison)
- [What is Virtual Surround? - Spatial Audio Explained - YouTube](https://www.youtube.com/watch?v=E2JneaC6lbI&amp;ab_channel=TallGuyFilms)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的 XR 周刊 04 -辐辏调节冲突]]></title>
            <link>https://tophci.com/posts/230105-xr04-vergence-accommodation-conflict</link>
            <guid isPermaLink="true">https://tophci.com/posts/230105-xr04-vergence-accommodation-conflict</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[视觉]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 04 Jan 2023 16:00:00 GMT</pubDate>
            <content:encoded>
在《[视觉的空间三维感知](https://www.tophci.com/blog/xr01-3d-vision)》一文中，我们介绍了两种重要的深度感知线索：调节（accommodation）和会聚（vergence）。

- 调节：为了清楚地观看物体，人眼需要不断调整焦点，以看清楚不同距离的物体。
- 会聚：眼球的会聚或各自向内/向外旋转，将注视的物体视为单一物体，避免看到重影。

在自然视觉中，调节和会聚常常一起工作，会聚的程度会影响眼睛晶状体的调节，反之亦然，从而保证灵活而强大的视力。当我们观察远处物体时，眼球的晶状体会放松，视线平行以保持远距离的聚焦状态。但观察近处物体时，眼睛会收缩晶状体调整焦距，让视线聚焦到物体上。如果大脑接收到眼睛调节和会聚之间的线索不匹配时，就会发生辐辏调节冲突（Vergence-accommodation conflict，以下简称 VAC ），对眼睛造成压力。

在 XR 尤其是早期的 VR 中很容易发生辐辏调节冲突，它是导致「晕 VR」的主要原因之一。

在观察虚拟世界时，眼睛需要不断地调节焦距，以便清晰地观察不同距离的虚拟物体，同时还需要会聚，使得两眼聚焦在同一物体上。例如，在观看 1 米处的小黄鸭时，眼睛晶状体会自动调节使得 1 米外的小黄鸭恰好在视网膜上形成清晰的图像。这是正常的辐辏调节关系，大脑已经习惯了这些对应关系。

![](https://upload.wikimedia.org/wikipedia/commons/thumb/b/b7/Vergence-Accommodation_Conflict_Diagram.png/400px-Vergence-Accommodation_Conflict_Diagram.png)

[Vergence-accommodation conflict - Wikiwand](https://www.wikiwand.com/en/Vergence-accommodation_conflict)

在 VR 中情况有所不同。3D 图像总是显示在眼前固定距离的屏幕上，为了获得清晰的图像，眼球晶状体聚焦的距离一直不变——调节固定。当你看向不同距离的物体时，仍然需要旋转眼球让视线汇聚到不同深度的物体上——会聚（辐辏角度）不断变化。如果用户想看清一个焦距小于屏幕的虚拟物体，就要增加会聚角度。**这时调节视线方向和调节晶状体焦点之间不匹配，打破了原本大脑里自然的对应关系，VAC 出现了。**

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vergence-accommodation%20conflict%20explain.jpg&quot; style=&quot;zoom:30%;&quot; /&gt;

[Vergence-Accommodation Conflict: Facebook Research Explains Why Varifocal Matters For Future VR - YouTube](https://www.youtube.com/watch?v=YWA4gVibKJE&amp;ab_channel=VRTrailers%26Clips)

VAC 带来的负面影响包括：

- 影响深度感知
- 视觉疲劳，会引发不适甚至一定程度的眩晕
- 影响视觉系统的性能，如降低双目融合的速度

使用时间越长，出现 VAC 的可能性也变大。为了缓解这个问题，可以尝试以下做法：

一是让虚拟物体的位置尽量靠近屏幕焦距。例如，HoloLens 建议通过在不同深度放置内容来引导用户的眼睛会聚到哪里，**当内容放在接近 2 米的地方时，可以最大限度地减少辐辏调节冲突带来的不适**。如果内容不能放在 2 米附近，用户的视线就需要在不同距离之间来回切换，辐辏调节冲突带来的不适感增大。举个例子，看一个 1 米远处的对象，比看一个 1 米远处时而靠近时而远离的对象要舒服得多。

二是以模仿自然世界线索的方式呈现内容。用户在看东西时，**景深效果既可以让人身临其境，又能增加舒适感**。例如模糊弹出菜单后面的背景。这不仅可以模拟现实世界中视觉的自然功能，还可以防止用户焦点之外的物体分散注意力。

三是改良显示设备技术。近 10 年 XR 已经出现不少新型显示器，包括变焦显示器、多焦点显示器、全息显示器等等，可以大大降低 VAC。多焦点显示器提供多个图像焦平面，根据观看者的当前焦点来快速切换焦平面，提供背景模糊等景深提示，这样能让视觉感知更接近自然观看。

Oculus 在 2019 年展示了 Half Dome 3 的变焦原理。如图所示，通过六个镜头的开关可以获得 64 次离散的焦距变化，实现快速而自然的变焦显示。

![](https://uploadvr.com/wp-content/uploads/2019/09/HalfDome3.gif)

更进一步，在深度学习算法的加持下，训练出深度信息的场景模型，就能很快计算出焦点正确的图像：

![deepfocus demo](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/deepfocus%20demo.jpg)

[Vergence-Accommodation Conflict: Facebook Research Explains Why Varifocal Matters For Future VR - YouTube](https://www.youtube.com/watch?v=YWA4gVibKJE&amp;ab_channel=VRTrailers%26Clips)

相信在不久的将来，VAC 不再是阻碍人们进入 XR 世界的因素。

---

&lt;center&gt;如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊&lt;/center&gt;

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

### Ref

- [Vergence-Accommodation Conflict: Facebook Research Explains Why Varifocal Matters For Future VR - YouTube](https://www.youtube.com/watch?v=YWA4gVibKJE&amp;ab_channel=VRTrailers%26Clips)
- [Vergence-accommodation conflict - Wikiwand](https://www.wikiwand.com/en/Vergence-accommodation_conflict)
- [Accommodation (eye) - Wikiwand](&lt;https://www.wikiwand.com/en/Accommodation%20(eye)&gt;)
- [Half Dome Updates: FRL Explores More Comfortable, Compact VR Prototypes for Work](https://www.oculus.com/blog/half-dome-updates-frl-explores-more-comfortable-compact-vr-prototypes-for-work/)
- [Meta&apos;s Cambria (Part 2): Is It Half Dome 3? - KGOnTech](https://kguttag.com/2021/12/13/metas-cambria-part-2-is-it-half-dome-3/)
- [Vergence-Accommodation Conflict - Virtual Reality, Augmented Reality and Artificial Intelligence Wiki - VR AR XR &amp; AI Wiki](https://xinreality.com/wiki/Vergence-Accommodation_Conflict)
- [Comfort - Mixed Reality | Microsoft Learn](https://learn.microsoft.com/en-us/windows/mixed-reality/design/comfort)
- [Vergence-Accommodation 冲突对沉浸式显示器中虚拟手指向的影响 2022 ARVR\_哔哩哔哩\_bilibili](https://www.bilibili.com/video/BV1aF41137Ej/?spm_id_from=333.337.search-card.all.click&amp;vd_source=f5ebed2fbff553573742a9a40e96c574)
- [聊一聊 VR 虚拟现实（十七）：今天你晕了吗 - 知乎](https://zhuanlan.zhihu.com/p/152102879)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AR 系列报告 02 - 技术篇]]></title>
            <link>https://tophci.com/posts/221229-ar-report-02</link>
            <guid isPermaLink="true">https://tophci.com/posts/221229-ar-report-02</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[report]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[AR]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 28 Dec 2022 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; AR 设备比手机多了哪些能力？它会是下一代计算平台吗？空间计算的相关技术趋势和难点有哪些？为什么做好 AR 眼镜很困难？AR 有哪些值得关注和研究的技术趋势？……

在踏入 XR 的新大陆时，很多新技术向我们扑面而来。这意味着新的可能性，也让人不得不学习大量的新知识。TopHCI 的 AR 系列报告的第二期——技术篇，将带你快速了解 AR 增强现实的关键技术。

![Vol2-Cover](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol2-Cover.png)

作为革新性的下一代人机交互平台，AR 设备是数字世界和物理世界融合的进阶。为了迎接新的沉浸式体验时代、突破平面视觉极限，AR 技术的各个环节需要全面升级，尤其是与用户体验强相关的显示设备、人机交互以及空间感知和计算等。

这一期报告解读了 AR 增强现实的几大技术：近眼显示、感知交互、内容制作、渲染计算和网络传输。

![ARTechMap](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/ARTechMap.jpg)

报告预览

![Vol2-2optical](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol2-2optical.png)

![Vol2-3hci](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol2-3hci.jpg)

![Vol2-4rendering](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol2-4rendering.jpg)

💡 免费下载完整版 PDF：

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/afdian-00%20XR-AR%20%E7%B3%BB%E5%88%97%E6%8A%A5%E5%91%8A%2002%20-%20%E6%8A%80%E6%9C%AF%E7%AF%87.jpeg&quot; style=&quot;zoom:50%;&quot; /&gt;

更多资源

- XR 网站：[tophci.com](https://www.notion.so/reports-center-0d4b5df65bb54dab81ad8f6edd033d96)
- XR 交流群：[https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik](https://wenjuan.feishu.cn/m?t=sTpygKVTLRFi-g5ik)
- XR 周刊：https://arvrmrxr.feishu.cn/wiki/wikcnzMnJ1G7txL2qMgyXe6Luqd
- XR 术语卡片集：[小红书「XR 设计」](https://www.xiaohongshu.com/board/6374417d0000000001008eaf?xhsshare=CopyLink&amp;appuid=58d135c950c4b459eca90554&amp;apptime=1669714090)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的 XR 周刊 03 - 视觉空间感知的限制因素]]></title>
            <link>https://tophci.com/posts/221226-xr03-xr-vision-limiting-factor</link>
            <guid isPermaLink="true">https://tophci.com/posts/221226-xr03-xr-vision-limiting-factor</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[视觉]]></category>
            <category><![CDATA[空间感知]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 25 Dec 2022 16:00:00 GMT</pubDate>
            <content:encoded>
在《视觉的空间三维感知》一文中，我们知道人类的三维视觉依赖很多深度线索。但是在 XR 中很难模拟所有线索，例如，系统性能不支持计算实时阴影，其中一些深度线索可能是错误的，甚至相互矛盾。这会给体验带来负面的影响，如对空间中物体位置的误判，破坏沉浸感，还可能引起疲惫和头痛。

除了对深度线索的计算和呈现不足，XR 的头戴设备（以下简称 HMD）的视觉输出部分还受限于许多硬件参数，包括分辨率、视场角、亮度、自由度、可用性、位置等等。

### 分辨率

空间计算虽然大大增加了感知和互动的范围，但是人眼所见依然依靠屏幕来显示。视觉显示器的分辨率可以用总像素数或分别指定水平和垂直像素数来表示。输出设备的分辨率对可以显示的细节至关重要，所以我们会很关注 HMD 的显示器部分，比如分辨率、刷新率、对比度等参数。然而，位于屏幕前方的透镜同样重要。

对 VR 头显来说，我们并不是直接看着显示屏，而是通过透镜看到一个尺寸被放大后的屏幕。这个透镜本质上是个放大镜，提供更宽的视场，可以让我们用一个小屏实现大屏才有视觉覆盖率，但也带来了画面被透镜放大后拉伸变形的问题。畸变校正可以靠组合镜片式的硬件方案，但难以做到理想的体积、可视角度也很难增大，现在也使用算法逆向修正画面的技术。除了分辨率参数，还有很多影响 VR 头显清晰度的要素，比如子像素配置和排列方式、放大后的虚拟屏尺寸等。

### FOV

HMD 的视场角（Field of View）是指在不移动眼睛或头部的情况下可以看见视野范围。视野的大小对沉浸感有很大的影响，因此，评价视觉输出设备的一个重要标准是 FOV 的大小。

FOV 通常用水平和垂直角度值来表示，有时候也使用对角线。人类的视野在水平方向约为 214°（施夫曼，2014），垂直方向一般要小得多，约 130°~150°。单眼 FOV 可以分为两部分，鼻子和瞳孔之间大约是 60°，瞳孔与头部之间约为 100°~110°。 双眼叠加的可以感知区域大约为 120°（水平）(Broll et al., 2022)。

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/FOV%20illu.png&quot; style=&quot;zoom:50%;&quot; /&gt;

目前市面上主流 HMD 的 FOV 都只能覆盖部分视野，AR 设备的 FOV 一般比 VR 设备要小。

- Quset 2 FOV：100°
- Pico 4 FOV：105°
- Nreal X FOV：46°
- HoloLens 2 FOV：43°

![](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/nreal%20fov.jpg)

&lt;center&gt;AR 眼镜因 FOV 较小而被裁剪的效果 https://www.youtube.com/channel/UCVW613ybLZm3lQNOCc6-bXA&lt;/center&gt;

### 瞳距和垂直偏移

使用 HMD 时，观看者眼睛的位置尤其是瞳距 ([IPD](https://en.wikipedia.org/wiki/Pupillary_distance), Interpupillary Distance) 和垂直偏移 (VO, Vertical Offset) 对于观看的舒适度很重要。

瞳孔间距离是两眼中心之间的距离，成年人的瞳孔距离通常在 45~75 毫米之间，平均是 64 毫米，个体差异很大（Doerner 等，2022）。VO 是指虚拟内容相对于眼睛水平轴的垂直偏移。

瞳孔距离的微小变化可以导致深度感知的巨大变化，对虚拟内容的大小和距离的感知也有直接影响。如果 HMD 的两块镜片之间的距离恰好等于使用者的瞳距时，观看体验最为舒适。如果两者之间存在小幅度差异，人眼可以一定程度上调节和自适应。但是当使用者瞳距过大或者过小时，双眼会较难对焦到物体上，从而产生眩晕感。如果偏离太大，可能会加剧辐辏调节冲突引起的不适。

许多 VR 眼镜可以手动调整瞳孔间距以适应个性化需要。另外一些 VR 眼镜因为要降低重量和简化机械结构，会将镜片中心距离固定在人类瞳距的平均值（~64mm）位置。

### 亮度、光照度和动态范围

亮度（Brightness）是对感觉到的光量的主观衡量。受限于 XR 设备的硬件限制，用户感受到的亮度，会受到视野的大小和场景内容等等的影响。描述平面光源亮度更好的方法是[照度（illuminance）](https://www.wikiwand.com/zh-hans/照度)，即每单位面积所接收的光通量。

动态范围（Dynamic Range）描述了显示设备的最小亮度与最大亮度之间的比率，能够反映对各种亮度、对比度和颜色的支持。亮度会影响 XR 应用的使用场景：如果亮度太低，只能在较暗的地方使用；如果亮度足够大，就可以在较强光照甚至日光下使用。环境光代表显示器环境中的光线，包括场景中的所有光线，除了从显示器本身发出的光。明亮的环境光通常会导致显示器的亮度降低。即使光源的亮度并没有改变，由于对比度的降低，感知到的光量也会变少。

分辨率、畸变校正和变焦都是高级视觉真实感的关键，但高动态范围（HDR）是与增强真实感和深度联系最紧密的技术。

尼特（nit）是描述对象发出多少光的单位，室内环境的典型值远远超过 10000 nit，如下所示。

&lt;img src=&quot;https://news.nweon.com/wp-content/uploads/2022/06/56a5aa3321a6de81095d5b23877a5d6b.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

来源：[Meta VR 视觉图灵征途：深度分享变焦、畸变、高分辨率、HDR 等原型设计和研发 - 映维网资讯](https://news.nweon.com/98298)

Quest 2 的峰值亮度约为 100 nit，在 VR 头显的功率、散热和形状参数限制下，要想大幅提升 HDR 并不容易。正如扎克伯格 2021 年在一次采访中所说：“在显示器和使其变得超级逼真方面，最困难的挑战可能是 HDR 问题。与眼睛在现实世界中看到的屏幕相比，我们所看到的屏幕逼真度尚差一个数量级或更多。”

2022 年 6 月 Meta Reality Lab 推出的一款名为 Starburst 的原型，展示了在 HDR 方面的进展。

![HDR comparison](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/HDR%20comparison.png)

[Meta VR 视觉图灵测试：Starburst\_哔哩哔哩\_bilibili](https://www.bilibili.com/video/BV1aN4y137vX/?zw&amp;vd_source=f5ebed2fbff553573742a9a40e96c574)

### 渲染率 Rendering rates

为了让虚拟对象看起来像在现实世界中一样稳定流畅，应用程序需要从用户的位置渲染图像。不管 HMD 转向任何方向，都能看到视图准确及时地更新，这是用户最自然的期望，也是沉浸感的基础。以每秒至少 60 帧的速度渲染，并保持帧率稳定，有助于实现这一目标。帧率以赫兹（Hz）或每秒帧数（FPS）为单位。以如果设备支持高于 60 FPS 的帧率，则有可能进一步提升用户体验。

一致的帧率使摄像机的视角尽可能与用户的物理姿势相匹配。如果帧率变化，虚拟画面与物理摄像机的位置不一致时，画面可能会抖动。也就是说，尽管 HMD 继续进行物理运动，但用户看见的却是过去某个时间的历史渲染帧，能够感受到运动不均匀和重影。虚拟对象运动速度越快、渲染速率越低，用户感知到的抖动就越明显。

由于图像渲染需要时间，HMD 可以预测当图像显示时用户的头部位置。预测算法得到一个近似值，算法和硬件会调整渲染图像，以减少预测位置与实际头部位置之间的偏差。这个过程使用户看到的图像似乎是从正确的位置渲染的，并且感觉稳定。这个技术最适合调整头部位置的微小变化，但对其他一些渲染差异，例如由运动视差引起的偏差则用处不大。

始终保持 60 FPS 以上的帧率有助于避免抖动，但这也会带来大量的计算压力。现在很多显示设备分辨率可达 1920×1080 像素，如果图像每秒要重绘 60 次，那么每秒就要计算将近 1.25 亿个像素。实时输出高分辨率的图像需要非常强大的硬件。

### 延迟

输出设备需要一定的时间来输出所传输的数据。行动和系统响应之间的时间跨度被称为延迟，更具体来说，是用户头部运动和屏幕上显示的更新图像之间的所用时间。在 XR 中，只有当用户行为及时响应并被感知，才有可能获得沉浸式体验。当使用 HMD 时，低延时尤其重要，因为要显示的场景与用户当前的头部方向相关。

延迟是造成 VR 不适感的主要原因之一。因为头部运动和图像更新之间的滞后，会导致感觉冲突和前庭-眼球反射的错误。AR 应用有更高的延迟要求，因为虚拟物体需要锚定在现实世界中，而现实世界不存在延迟。

XR 设备的延迟包括传感器响应、跟踪系统计算、融合、网络通信、渲染、图像传输和显示等时间（Buhr et al., 2022）。

- 追踪延迟：各种传感器捕捉的运动数据需要汇集与融合，响应最慢的传感器，决定了追踪环节的整体延时。
- 传输延迟：数据、图像、指令等传输时表现出的延迟。
- 模拟延迟：传入的追踪事件被处理以模拟用户交互，包括模拟所需的计算和等待时间，可能因应用不同而变化很大。
- 渲染延迟：在模拟计算出新的状态后，渲染成适合的输出格式也会引起延迟。渲染不仅包括视觉，也包括如听觉和触觉输出。
- 显示延迟：渲染数据显示在输出设备上的延迟。1/60 秒通常已经让用户无法察觉出图像序列的间隔。但对 XR 系统来说，还需要保证恒定的延迟。但是只要用户稍微改变视角，就会导致重新计算，在场景复杂的情况更是如此。

应该尽量保证延迟低于人类的感知阈值。当延迟超过 60ms 时，头部运动和虚拟世界运动之间的脱节开始导致不适，建议 HMD 的延迟应低于 50 毫秒（Ellis，2009）。Meta Reality Lab 的负责人 Michael Abrash 曾在 2012 年提到，15 毫秒延迟可能是阈值，甚至是 7 毫秒（Abrash，2012）。超过这个范围，用户对环境的沉浸感和舒适感就会降低。

&gt; When it comes to VR and AR, latency is fundamental – if you don’t have low enough latency, it’s impossible to deliver good experiences, by which I mean virtual objects that your eyes and brain accept as real.
&gt;
&gt; By “real,” I don’t mean that you can’t tell they’re virtual by looking at them, but rather that your perception of them as part of the world as you move your eyes, head, and body is indistinguishable from your perception of real objects. [...]
&gt;
&gt; I can tell you from personal experience that more than 20 ms is too much for VR and espe- cially AR, but research indicates that 15 ms might be the threshold, or even 7 ms. (Abrash 2012).

[Perma | Latency – the sine qua non of AR and VR | Valve](https://perma.cc/J29Q-KEQ8)

对延迟的容忍如此之低，可能会让人感到惊讶。虽然动画的帧率通常是 24 帧，但实际上人们能感知或区分更高频率的图像。这里需要区分刷新率和帧率。一个人不会感知到图像序列的临界刷新率约为 50 Hz，但只有当刷新率超过 100 Hz 时，图像才被认为是真正的无闪烁。对于 HMD 来说，帧率起着更大的作用，更重要的是屏幕的延迟要低，这样内容就能在最短的时间内更新。同样重要的是帧率的变化。如果延迟是不可避免的，它的变化越大，就越让人不舒服。**我们要做的是尽可能降低延迟，以及让延迟的变化最小。**人们最终会习惯于持续的、可预测的延迟，但波动的、不可预测的延迟，时间越长就越令人感到不适。（Buhr et al., 2022）

如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

## Ref

- 哈维·理查德·施夫曼. (2014). _感觉与知觉（第 5 版）_ (李乐山 等, Trans.). 西安交通大学出版社.

- Broll, W., Grimm, P., Herold, R., Reiners, D., &amp; Cruz-Neira, C. (2022). VR/AR Output Devices. In R. Doerner, W. Broll, P. Grimm, &amp; B. Jung (Eds.), _Virtual and Augmented Reality (VR/AR): Foundations and Methods of Extended Realities (XR)_ (pp. 149–200). Springer International Publishing.

- Buhr, M., Pfeiffer, T., Reiners, D., Cruz-Neira, C., &amp; Jung, B. (2022). Real-Time Aspects of VR Systems. In R. Doerner, W. Broll, P. Grimm, &amp; B. Jung (Eds.), _Virtual and Augmented Reality (VR/AR): Foundations and Methods of Extended Realities (XR)_ (pp. 245–289). Springer International Publishing.

- [Lumen (unit) - Wikiwand](&lt;https://www.wikiwand.com/en/Lumen%20(unit)&gt;)

- [为什么光学透镜是 VR 头显核心，菲涅尔透镜能解决所有问题吗 - 映维网资讯](https://news.nweon.com/40020)

- [Meta VR 视觉图灵征途：深度分享变焦、畸变、高分辨率、HDR 等原型设计和研发 - 映维网资讯](https://news.nweon.com/98298)

- [Meta VR Headset Research Prototypes: Butterscotch, Starburst, Holocake 2 - YouTube](https://www.youtube.com/watch?v=KDUP14Y12Is&amp;ab_channel=UploadVR)

- [Hologram stability - Mixed Reality | Microsoft Learn](https://learn.microsoft.com/en-us/windows/mixed-reality/develop/advanced-concepts/hologram-stability)

- [Understanding Performance for Mixed Reality - Mixed Reality | Microsoft Learn](https://learn.microsoft.com/en-us/windows/mixed-reality/develop/advanced-concepts/understanding-performance-for-mixed-reality)

- [Perma | Latency – the sine qua non of AR and VR | Valve](https://perma.cc/J29Q-KEQ8)

- Ellis SR (2009) Latency and user performance in virtual environments and augmented reality. Distributed Simulation and Real Time Applications, DS-RT 09, p. 69
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的 XR 周刊 02 - VR 和 AR 显示技术的不同]]></title>
            <link>https://tophci.com/posts/221221-xr02-ar-vr-display</link>
            <guid isPermaLink="true">https://tophci.com/posts/221221-xr02-ar-vr-display</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[视觉]]></category>
            <category><![CDATA[空间感知]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 20 Dec 2022 16:00:00 GMT</pubDate>
            <content:encoded>
HMD （Head Mounted Display）指佩戴在头部眼睛前面的显示器，通常可以用双眼观看。HMD 是 VR 和 AR 眼镜的通用术语。VR 和 AR 都使用显示器来创造沉浸式或互动式体验。不过它们在向用户展示信息的方式上有所不同。VR 眼镜将用户与外部世界隔离开来，让人沉浸在虚拟世界中，AR 眼镜则通过添加虚拟内容来丰富用户的真实环境。

HMD 通常有一个集成的跟踪系统，根据当前位置和方向不断调整虚拟摄像机的位置和观看方向。大多数 HMD 使用双眼光学，使用户可以立体地感知内容。

### VR

虚拟现实系统使用虚拟现实耳机或多投影环境来生成逼真的图像、声音和其他感觉，以模拟用户在虚拟环境中的实际存在。VR 显示器的设计是为了让用户完全沉浸在一个虚拟环境中。

VR 眼镜的工作原理是在眼镜内的屏幕上显示 3D 图像和视频，然后通过创造深度和距离错觉的镜片来观看。VR 眼镜通常采用封闭式设计，HMD 的视野有时几乎与自然视野一致，使用户在视觉上与环境完全隔绝，视野完全被虚拟环境填满，这有助于加强沉浸感。

显示器左右眼各有一块镜片，眼睛看到的是同一个显示器的不同区域，形成立体视觉。通过使用 LCD 或 OLED 显示器，实现了高分辨率与高亮度的结合，并且价格合理。眼镜通常还内置有传感器，如陀螺仪和加速计，可以跟踪用户头部的运动并相应地调整图像。这使得用户可以在虚拟环境中环顾四周，就像观察现实世界一样。交互功能更强大的 VR 眼镜还配备了更多的感知和互动能力，如触觉反馈，为用户提供触觉感受，或眼球追踪，使系统能够追踪用户的目光并相应地调整图像。

总的来说，VR 眼镜使用技术的组合，如屏幕、传感器和软件，为用户创造一个沉浸式的互动虚拟环境。

### AR

AR 可以定义为包含三个基本特征的系统：真实世界和虚拟世界的结合、实时交互以及虚拟和真实对象的准确 3D 配准。AR 显示器是为了用虚拟内容增强现实世界。它们使用屏幕或投影仪在现实环境之上叠加显示数字内容，使用户能够同时看到虚拟内容和现实世界。用户的视野部分会显示虚拟内容，其余部分则被现实世界填满。

头戴式 AR 眼镜可以分为两类：光学透视显示器（Optical see-through，OST）和视频透视显示器（Video see-through，VST）。前者通过光学方式在用户的视野中叠加真实和虚拟的图像，后者则使用视频摄像机来捕捉环境信息，然后在渲染过程中与虚拟内容叠加。

![ARreport-ARDisplayTypes](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/ARreport-ARDisplayTypes.png)

#### 光学 AR 眼镜

一般的 AR 眼镜都是 OST 显示器，以 Hololens2、Magic Leap One 为代表。透过眼镜可以直接看到现实环境，虚拟图像是由显示器产生的，并由镜头放大。与 VST 相比，观看真实环境时，在质量和分辨率方面没有限制，而且造价成本较低。但它也有一些缺点：

- 定位误差会被放大，对跟踪注册精度要求较高。虚拟图像通过分光镜投射到眼睛，是一个固定的距离，可能与用户当前关注的真实世界内容的距离不同。
- 在明亮环境中的背景对比度不足。由于显示器相对于环境光的亮度低，会影响虚拟内容的可见性。一般需要在明亮的环境中减少透明度来增加背景对比度，但不同的叠加方法通常会导致入射光量的显著减少，画面显得很暗。因此大多数 OST 不太适合在阳光下使用。

AR 光学显示系统的核心是微型显示屏和成像系统（光学元件），近眼显示技术的不同组合是区分目前市场上 AR 眼镜的关键。

近眼显示技术是现阶段 AR 眼镜的瓶颈之一。为什么它的难度很大呢？因为现有技术方案在各种参数（如分辨率、视场角）间存在潜在冲突，如何组合、取舍、权衡，得到最佳组合方案，是业界共同面临的重大挑战。

&lt;center&gt;表 近眼显示技术路线&lt;/center&gt;

| 微型显示屏 | 光学组合器        | 代表产品                                      | 优点                                                                  | 缺点                                  |
| ---------- | ----------------- | --------------------------------------------- | --------------------------------------------------------------------- | ------------------------------------- |
| LCoS       | 棱镜              | Google Glass，Vuzix M300                      | 造价低，体积小                                                        | FOV 小，遮挡视线，笨重                |
| Micro OLED | 自由曲面/Birdbath | Epson BT300，耐德佳，Rokid Glass，Nreal Light | 对比度好，分辨率高，色彩好，FOV 大，功耗低                            | 镜片较厚，亮度较低，外界透光率较低    |
| LCoS/DLP   | 光波导            | Hololens，Magic Leap One，Rokid Vision        | 分辨率高，亮度高，FOV 大，Eyebox 大，外界透光率高，功耗适中，非常轻薄 | 显示色彩和对比度稍差                  |
| LBS        | 全息反射薄膜      | North Focals                                  | 体积小，功耗小，外界透光率高                                          | FOV 小，Eyebox 小，对比度低，色彩较差 |

##### 基于棱镜的眼镜

基于棱镜的眼镜与其他设计相比，能以更紧凑的设计实现相对较高的出光量。在用作透视显示器时，棱镜由一个具有平行外表面的玻璃体来补充，因此环境光可以通过玻璃而不被折射。

长期以来，棱镜一直是 OST 显示器的首选。内容显示在 LCD 或 OLED 显示器上，并通过位于显示器下方/上方的放大镜来放大。经典的方法是用两面半透明的镜子，一面垂直安装在前面，另一面在后面以 45° 角朝向眼睛。环境光只需通过两面镜子，而来自显示器的光则被对角镜反射到正面，然后再反射到眼睛。

棱镜方法受到欢迎的另一个原因是，能够用智能手机实现简单的 OST 显示器。将智能手机垂直插入用户额头前的一个支架中，一面镜子将图像向下反射到眼睛前面的区域。这里通常还有一个光学系统，每只眼睛都有一个放大镜。在眼睛前面的区域有一个对角线排列的半透明镜子，将显示器的图像反射到眼睛上的同时可以看到环境。

##### 基于光波导的眼镜

近年来光学 AR 眼镜开始采用光波导的光学方案。

光波导是引导光波在其中传播的介质装置，通过光的全反射原理，实现光在传输的过程中无损失无泄漏。达到全反射需要满足两个条件：

- 传输介质即波导材料需要具备比周围介质高的折射率(如图 n&lt;sub&gt;1&lt;/sub&gt;&gt; n&lt;sub&gt;2&lt;/sub&gt;)
- 光进入波导的入射角需要大于临界角 θc.

![](https://mianbaoban-assets.oss-cn-shenzhen.aliyuncs.com/2021/3/MrI7Br.png)

光波导原理是光线被送入玻璃体，然后像光缆一样通过玻璃体外部的反射在其中传播。其中的关键是光如何进入玻璃体（耦合进入）和如何退出（耦合退出）。这需要使用特殊的光学元件，使光在先前预定的方向上被传输和辐射。光机成像后，波导将光耦合进玻璃基底中，通过“全反射”将光传输到眼睛前方再释放出来。借助波导，显示屏和成像系统得以移到额头顶部或者侧面，可降低光学系统对外界视线的阻挡，并改善设备的重量分布和佩戴体验。

这样 HMD 就可以使用跟传统眼镜类似的镜片，大大减小设备体积。对于全彩显示，三层导光板必须一层一层地排列，因为由于折射率与光的波长有关，各个颜色通道必须分别传输。应用全息光学元件的全息波导是这种方法的典型代表。像微软 Hololens 2、Daqri 的 AR 显示器都使用了光波导技术。

##### 视网膜眼镜

视网膜 HMD 实际没有上没有显示器，因为内容直接投射到视网膜上，因而也被称为虚拟显示。调制的激光被用作光源，通过一个半透明的棱镜被导入眼睛。要实现全彩显示，则需要 RGB 三个独立的激光器。这种方法有两个主要优点：一方面避免了复杂的光学系统，另一方面可以让视场非常大，因为眼睛前面没有光学器件的的覆盖和遮挡。

#### VST 眼镜

视频 AR 眼镜一般集成了一个或两个视频摄像头，利用视频图片处理的方式从真实世界获得跟踪信息，并融合显示。VST 设备以 ARKit、ARCore 等为代表。与 VR 眼镜不同的是，透过眼镜可以看到现实世界的图像。不过有越来越多的 VR 眼镜也开始提供彩色 VST 模式，AR 和 VR 的界限日渐模糊。

由于人眼只看到显示器的图像，真实和虚拟的内容总是在同一个聚焦面。摄像机和显示器对真实世界的感知的分辨率有限，现实世界中那些不在摄像机聚焦范围内的部分，用户也就无法看见。摄像机的视野必须大于 HMD 的视野，所捕获的视频图像在渲染时才能被正确插入作为背景图像。在大多数情况下，不能将摄像机直接放在眼睛正前方。因此，在纠正摄像机图像的透视时，除了整顿和限制视角外，往往还必须扣除平移和/或旋转偏移。

### VR 和 AR 的区别

VR 和 AR 有很多不同，以下重点总结两者在视觉显示方面的差异。

- 沉浸感。VR 显示器的设计是为了创造一种沉浸感，它完全屏蔽了现实世界，用虚拟环境来代替它。而 AR 显示器并不完全遮挡现实世界，这可能会影响沉浸感水平。

- 互动性。VR 设备通常提供更多的互动体验，因为它们允许用户完全沉浸在虚拟环境中并以各种方式与之互动。而 AR 提供的互动形式相对有限，因为它们的目标是增强现实世界而不是取代它。

- 使用场景。VR 通常用于游戏、教育和培训，而 AR 通常用于实时显示信息或提供指导等任务。

- 硬件。VR 显示器通常需要专门的硬件，如 VR 眼镜或头盔，而 AR 显示器可以使用各种设备实现，包括智能手机和平板电脑。

总的来说，VR 和 AR 显示器提供不同类型的沉浸式和互动式体验，并用于各种不同的目的。主要区别在于它们向用户展示信息的方式：VR 使用户完全沉浸在虚拟环境中，而 AR 则用数字内容增强现实世界。

如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; alt=&quot;aifadian.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

### Ref

[TopHCI - 人机交互/AR/VR/XR 设计](https://www.tophci.com/)

[Virtual reality - Wikiwand](https://www.wikiwand.com/en/Virtual_reality)

[Augmented reality - Wikiwand](https://www.wikiwand.com/en/Augmented_reality)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[00的 XR 周刊 01 - 视觉的空间三维感知]]></title>
            <link>https://tophci.com/posts/221210-xr01-3d-vision</link>
            <guid isPermaLink="true">https://tophci.com/posts/221210-xr01-3d-vision</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[视觉]]></category>
            <category><![CDATA[三维感知]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 09 Dec 2022 16:00:00 GMT</pubDate>
            <content:encoded>
### 人类视觉和三维感知

&gt; 人是如何看见东西的呢？

上帝说：要有光。

如果用一句话概括就是：人眼接收到物体反射的光线，并转化为神经信号，由神经中枢编码加工后获得主观感觉。人眼在这眨眼瞬间的工作，需要多个步骤协调配合：

![visual perception process](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/visual%20perception%20process.png)

&lt;center&gt;视觉感知形成过程&lt;/center&gt;

就这样，我们「看」到了大千世界。

人的每只眼球大约有 600~800 万个视锥细胞，从视网膜中央向边缘递减分布。在视网膜表面有两个区域：中央凹（fovea）和外围区域（施夫曼，2014）。中央凹在视网膜中心附近，仅占约 1% 的面积，覆盖约 2°~3° 的视角。中央凹虽然只有针孔般大小，却密布着视椎细胞，能够十分准确地检测颜色和空间细节，形成高清晰度图像。

人眼不仅能够看见东西，还能感知三维空间。我们既能看清眼前书页上的小字，也能看见远在光年之外的星星。一个很有趣的问题是：

&gt; 在视网膜上形成的图像是二维的，那么空间如何被视觉体验为三维呢？

我们用相机拍照片时，其实是用镜头捕捉光线，在成像平面上留下一个投影，以二维图像反映出三维世界的一个快照。而在自然观看过程中，人类的视觉系统则依赖多种「线索」来解释现实环境中物体的外观和相对位置，从而「构建」出三维感知。那么，比二维平面多出来的那一维是什么呢？答案就是**深度（depth）**，即感知到的距离远近。

人类对大部分现实世界的场景有一种直觉的距离感，这是感知空间的基础。深度知觉让我们可以看到三个维度的世界，判断物体与我们之间的远近关系。有时候，这种判断会失效——如果你在旅游景点拍过错位照，就明白我在说什么了。

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision_illusion.jpg&quot; alt=&quot;vision_illusion&quot; style=&quot;zoom:60%;&quot; /&gt;

&lt;center&gt;photo by 00&lt;/center&gt;

### 深度感知线索

人有两只眼睛，相当于两个「镜头」，但不会看到左右两个独立的图像，而是两眼融合后的视觉。当我们环顾四周时，眼睛会收集周围物体的大小、位置、亮度、清晰度和运动等信息。可以将众多帮助形成三维空间感的视觉线索分成两类：

- 单目线索：透视，相对大小，相对高度，遮挡，[景深](https://en.wikipedia.org/wiki/Depth_of_field)，光照和投影，纹理渐变，运动视差，[调节](&lt;https://en.wikipedia.org/wiki/Accommodation_(eye)&gt;)

- 双目线索：[会聚](https://en.wikipedia.org/wiki/Vergence)，[双目视差](https://www.wikiwand.com/en/Binocular_disparity)

如果更直观地理解二维和三维视觉的区别，想想你去电影院看过的普通电影和 3D 电影吧。普通电影在平面屏幕上投射图像，根据单眼深度线索，如遮挡、相对高度、阴影和运动视差等，创造深度感知。三维电影增加了立体的深度感知。这是通过使用两个并排放置的摄像机实现的。就像你的每只眼睛一样，每台摄像机拍摄的场景视图略有不同。然后将这两幅图像重叠在电影屏幕上。

下面将分别介绍不同的深度感知线索。

#### 单目线索

只需要一只眼睛就可以获得的立体视觉线索。

##### 透视 Perspective

这是视觉感知近处物体与远处物体之间对比差异的能力。有几种透视现象加强了立体空间感：

[线性透视](&lt;https://en.wikipedia.org/wiki/Perspective_(graphical)&gt;)（Linear perspective）最直观也是我们最熟悉的，通过“近大远小”的处理，引入透视点并让视线汇聚，可以明显提高平面上的景深感知。

曲线透视（Curvilinear perspective，又称为鱼眼透视），使用弯曲的透视线而不是直的会聚线来呈现视网膜上的图像。因为视网膜本身是球形的，这比线性透视更准确。

空气透视（Aerial perspective）是一种近处的物体较清晰，远处的物体较模糊的效果。由于受大气中微粒的影响，光线折射后分散开来，不但物体细节的清晰度减少，反射到眼睛里的光线也减少，所以远处的物体往往更近模糊和黯淡。

秋天常常给人一种秋高气爽的感觉。为什么秋天晴朗的天空显得更「高」也更「远」呢？这是因为秋天空气中的水汽、烟尘等微粒较少，远处的光线和物体都更清晰。相反，在雨天和雾气缭绕的时候，我们会感觉建筑和山脉好像都比平时要更远一些。

现在再开一个脑洞：

&gt; 如果你站在月球上，那里没有大气，远处的地面看起来会是怎么样的呢？

##### 相对大小 Relative size

这是视觉系统根据物体看起来的尺寸差异来判断距离的能力。如果物体大小不变，那么远处的物体相对近处的显得较小。例如，同样一栋房子，房子看起来越小说明它离得越远。另外，大脑还会通过比较物体的感知大小与其典型大小，来估计物体的距离。

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision_size.jpg&quot; alt=&quot;vision_size&quot; style=&quot;zoom:50%;&quot; /&gt;

&lt;center&gt;photo by 00&lt;/center&gt;

##### 相对高度 Relative height

图像中的高度与我们视野中的高度相对应，在视野中更高的物体通常更远。如果有地平线做参考，我们会认为靠近地平线的物体比较远，而远离地平线的物体比较近。

![vision-relativeHeight](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision-relativeHeight.JPG)

&lt;center&gt;photo by 00&lt;/center&gt;

例如，一辆汽车从远处接近地平线的位置移动，如果汽车逐渐高于或低于地平线，它会看起来是在靠近。

##### 遮挡 Occlusion

指一个物体的外表部分或完全遮盖另外的物体。如果一个物体部分遮挡了另一个物体，我们就会认为它距离更近。但它不反映绝对景深或距离信息，仅从遮挡的角度，我们无法判断距离到底有多远。

##### 景深 Depth of field

前景清晰、背景较模糊的景深效果能很好地传达距离信息。例如，可以模糊用户调出菜单后面的背景。这不仅可以模拟现实世界中视觉的自然功能，而且可以防止用户焦点之外的突出物体分散视觉注意力。

##### 光照和阴影 Light &amp; shading

高光和阴影（shading）是感知物体的形状和位置的重要线索：离光源最近的物体表面往往最亮，远离光源或在暗面的物体亮度降低。物体表面上光亮的分布有助于感知物体形状，比如对曲面的感知产生于从明到暗的渐变过程，如果光线突然变暗的部位可能被感知为边缘或拐角。

![vision_dalle2shadaw](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision_dalle2shadaw.png)

&lt;center&gt;DALL·E2 自动生成的图像，增加了适当的阴影，显得更为逼真 https://openai.com/dall-e-2/&lt;/center&gt;

##### 纹理渐变 Texture gradient

许多物体表面有一些细微结构，给人以不同材质和触感，我们称之为纹理。纹理随着距离远近产生密度变化的视觉效果：附近物体的精细细节清晰可见，而远处物体的纹理元素变小直到看不清。比如，如果仔细观察一块麻布编织毯，重复的图案在远处变得更小更密集。

![vision_textureGradient](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision_textureGradient.JPG)

&lt;center&gt;photo by 00&lt;/center&gt;

##### 运动视差 Motion parallax

当头部运动时感知到的差异，不同距离的物体以不同的速度移动，较近的物体似乎比远处的物体移动得更快。运动视差属于单眼线索。在坐火车时这种感觉非常明显：眼前的物体瞬间飞逝，而远处的景物看起来似乎静止不动。

运动视差也常用于在界面动画和视频游戏中，以创造深度和立体感。

&lt;img src=&quot;https://learn.microsoft.com/zh-cn/windows/apps/design/motion/images/parallax-v2.gif&quot; style=&quot;zoom:50%;&quot; /&gt;

##### 调节 Accommodation

眼睛看到物体时，物体反射的光在视网膜上产生一个颠倒的图像。为了使感知的图像清晰地出现在视网膜上，眼睛的睫状肌根据物体的距离变化而随时调整晶状体的形状（屈光率），从而改变焦距以保持清晰的焦点，这个过程被称为调节。

#### 双目线索

双眼深度知觉涉及到左右眼形成的图像的差异，这些线索依赖于双眼协同。如果闭上一只眼睛，大脑就会失去一些用来计算物体深度的信息。

##### 会聚 Convergence

会聚是人在观察物体时两眼之间的夹角，常常又称为辐辏。当视线聚焦在同一个物体上，两个眼球需要相对向内旋转一定角度，以便双目视线相交。当你观看近处的东西，例如一只靠近鼻子的苍蝇时，眼睛会转动聚焦到近处的点。相反，如果无限远的东西，眼睛视线变得平行，几乎不必会聚。

这一类线索基于我们可以感知眼睛位置和眼部肌肉张力的本能，是非常有效的深度信息来源。

##### 视差 Disparity

当双眼注视同一个物体时，左右眼因位置不同会产生视角的差异，左右视网膜成像也会略有不同。视觉系统会自动比较两幅图像，如果足够相似就融合，从而为深度感知提供线索。如果一个物体很远，那么落在两个视网膜上的图像的差异就会很小；如果物体距离很近，则视差会很大。

### 小结

人类的视觉系统十分强大，从环境中获取了很多信息来构建三维的视觉。各种深度线索汇总如下：

&lt;center&gt;深度线索汇总表&lt;br&gt;(Doerner 等, 2022)&lt;/center&gt;

| 深度线索   | 英文术语           | 类型 | 主要影响距离 | 是否反映绝对距离 |
| ---------- | ------------------ | ---- | ------------ | ---------------- |
| 线性透视   | Linear perspective | 单目 | 全部可视范围 | 绝对             |
| 空气透视   | Aerial perspective | 单目 | &gt;30          | 相对             |
| 相对大小   | Relative size      | 单目 | 全部可视范围 | 绝对             |
| 相对高度   | Relative height    | 单目 | &gt;30m         | 相对             |
| 遮挡       | Occlusion          | 单目 | 全部可视范围 | 相对             |
| 景深       | Depth of field     | 单目 | 全部可视范围 | 相对             |
| 光照和投影 | Light &amp; shading    | 单目 | 全部可视范围 | 相对             |
| 纹理渐变   | Texture gradient   | 单目 | 全部可视范围 | 相对             |
| 运动视差   | Motion parallax    | 单目 | &gt;20m         | 相对             |
| 调节       | Accommodation      | 单目 | &lt;2m          | 绝对             |
| 会聚       | Convergence        | 双目 | &lt;2m          | 绝对             |
| 视差       | Disparity          | 双目 | &lt;10m         | 相对             |

从表中我们可以看到，深度线索的影响取决于观察者与物体的距离。有些线索只在近距离时起作用例如调节、会聚；有些在近距离和中距离起作用如运动视差；有些在远距离时起作用如大气透视、相对高度；有些在整个视野内起作用比如遮挡、相对大小。

对于附近的物体，我们主要依赖调节和会聚（辐辏）。如果一个点离观察者越远，它产生的双目视差就越小。在 10 米的距离或许已经很难感知了。

大脑中的深度线索根据不同的任务而起作用。在 XR 场景中，如果不是所有的深度线索都能生成，那么就应该根据用户当前的任务来确定优先次序。例如场景中有一定角度的照明，阴影就很有用。对于在手臂范围内的虚拟物体，应该投入精力优化立体显示的效果。然而，如果物体离观看者超过 3 米远，使用立体显示对空间的感知贡献不大，甚至可能是多余的(Doerner 等, 2022)。

最后，让我们做个练习。对比下面两张图，分别来自 Cities VR 和 Half life:Alyx，想想场景中有哪些深度线索增强了立体感和沉浸感？为什么 3A 大作 Alyx 的场景让人感觉更加真实？

![vision_citiesVR](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision_citiesVR.jpg)

![vision_alyx](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/vision_alyx.jpg)

---

### Ref

- Goldstein, E. B., &amp; Cacciamani, L. (2022). _Sensation and perception_ (11th edition). Cengage.

- 哈维·理查德·施夫曼. (2014). _感觉与知觉（第 5 版）_ (李乐山 等, Trans.). 西安交通大学出版社.

- Doerner, R., &amp; Steinicke, F. (2022). Perceptual Aspects of VR. In R. Doerner, W. Broll, P. Grimm, &amp; B. Jung (Eds.), _Virtual and Augmented Reality (VR/AR): Foundations and Methods of Extended Realities (XR)_ (pp. 39–70). Springer International Publishing. https://doi.org/10.1007/978-3-030-79062-2_2

- Doerner, R., Geiger, C., Oppermann, L., Paelke, V., &amp; Beckhaus, S. (2022). Interaction in Virtual Worlds. In R. Doerner, W. Broll, P. Grimm, &amp; B. Jung (Eds.), _Virtual and Augmented Reality (VR/AR): Foundations and Methods of Extended Realities (XR)_ (pp. 201–244). Springer International Publishing. https://doi.org/10.1007/978-3-030-79062-2_6

- [Visual processing - Wikipedia](https://en.wikipedia.org/wiki/Visual_processing)

- [Depth perception - Wikipedia](https://en.wikipedia.org/wiki/Depth_perception)

- [DALL·E 2](https://openai.com/dall-e-2/)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[AR 系列报告 01 - 术语篇]]></title>
            <link>https://tophci.com/posts/221130-ar-report-01</link>
            <guid isPermaLink="true">https://tophci.com/posts/221130-ar-report-01</guid>
            <category><![CDATA[XR]]></category>
            <category><![CDATA[report]]></category>
            <category><![CDATA[交互]]></category>
            <category><![CDATA[AR]]></category>
            <category><![CDATA[HCI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 29 Nov 2022 16:00:00 GMT</pubDate>
            <content:encoded>
今年是 VR、AR 设备百花齐放的一年，Magic Leap2、Rokid Air、Pico4、Quest Pro 等相继登台亮相，XR 领域融资记录屡创新高，空间计算的领域研究也逐渐走入更多人的视野。对人机交互从业者和爱好者来说，自然振奋人心。关注 XR 领域的朋友越来越多，00 也新开辟了一个专门分享 XR 知识的网站 [tophci.com](http://tophci.com)，邀请包括一线从业者、学者、技术专家、创作者、学生、发烧友等等不同背景的朋友加入一起交流分享。

最近我开始整理 XR（主要是 AR）的专业内容，准备以一系列报告的形式分享给大家。报告预计会包括技术、产品、交互、设计等篇章。

![221130reportSeries](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/221130reportSeries.jpg)

今天向大家介绍报告的第一期——术语篇。

每当进入一个新领域，掌握这个领域的「语言」往往是第一步。了解基本的概念、术语、行话，能提高学习和运用知识的效率，也给我们打下良好的基础。所以系列报告的第一期是 AR 常见术语。00 挑选了 AR 入门最常见的一批中英文术语，配上精要的解释和图片，制作了一套术语卡片，方便大家集中学习，或者在以后需要时快速查找。

报告预览

![221130vol1contents](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/221130vol1contents.jpg)

![Vol1-07](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol1-07.jpg)

![Vol1-17](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol1-17.jpg)

![Vol1-28](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Vol1-28.jpg)

💡 下载完整版 PDF：在公众号「设计极客 00」后台回复 “AR 报告 1”，即可获得下载链接

后续的报告正在准备中，如果你愿意支持 00 持续创作，欢迎到爱发电给我充电 😊

&lt;img src=&quot;https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/aifadian.jpg&quot; alt=&quot;aifadian&quot; style=&quot;zoom:50%;&quot; /&gt;
</content:encoded>
        </item>
        <item>
            <title><![CDATA[HCT 的色彩原理 - Google 全新色彩空间详解]]></title>
            <link>https://tophci.com/posts/220302-HCT-color</link>
            <guid isPermaLink="true">https://tophci.com/posts/220302-HCT-color</guid>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[color]]></category>
            <category><![CDATA[HCT]]></category>
            <category><![CDATA[AR]]></category>
            <category><![CDATA[Android]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 01 Mar 2022 16:00:00 GMT</pubDate>
            <content:encoded>
最近，随着 Android 12 动态主题 Material You 的发布，Google 新研制的**色彩空间 HCT** 也开始为人所知。这大概将会是近 20 年最重要的色彩空间，作为设计师，快来了解一下吧！

![图片来源 material.io](https://lh3.googleusercontent.com/FgfF6od_qjYXbXowPPgL3IQ8T0QnEAZnoehlRcXHSXK7QXfHe_LvBm3SeYIkxhSRn3gBjjH4GEO6DYOex8btaN34lVDSzP7ZULMMSqoE7bsxyCWA0Q=w1064-v0)

图片来源：https://material.io/

## 新空间，新可能

HCT 是 Hue、Chroma、Tone 三个单词的缩写。显然，Google 这一套新的色彩空间，主要由色相、色度和色调来定义。

![Diagram showing hue, tone, and chroma.](https://lh3.googleusercontent.com/Yp4TboWwW--SnSzwJAqlJlilUL4NZyNvudW4AiD2pRA7KvzOVlkfBRq6t_-XwAJ9PXcfIUa_r5YP65FPEuVpOfuXVzCBFUOLmP_HB6nrWFu0CXFKTZk=w1064-v0)

图片来源：https://material.io/blog/dynamic-color-harmony

色彩空间，可以简单理解为一套组织和命名成千上万种色彩的方法。比如，设计师不会直接说「蓝色」，而会用几个数字准确定义是哪一种蓝——用 RGB 表示为(0,0,255)，用 HSL 表示为(240,100,50)。目前广泛使用的色彩空间主要有：

| 色彩空间  | 主参数                                         | 应用领域                       |
| --------- | ---------------------------------------------- | ------------------------------ |
| RGB       | Red, Green, Blue                               | 最通用的硬件色彩模型           |
| CMYK      | Cyan, Magenta, Yellow                          | 工业印刷                       |
| HSL/HSV   | Hue, Saturation, Lightness/Value               | 数字化图像处理                 |
| L\*a\*b\* | L 亮度；a+为红色，a-为绿色；b+为黄色，b-为蓝色 | 与设备显示限制无关的场景如照明 |

从使用广泛的 HSV/HSL/HSB 色彩空间来看，目前共识是人眼主要用三个维度来组织颜色：色相、饱和度和亮度。色相告诉我们使用色轮上的哪个角度，比如红色和紫色。饱和度描述颜色看起来有多鲜艳或中性（接近灰色）——颜色离色彩空间的中心越远，色彩越鲜艳。亮度则描述该颜色与白色或黑色的接近程度。

![](https://lh3.googleusercontent.com/wB5PDoi6DRex1AOSXv9F-Pr_0QxVnJ8C6kUB-UEqrQ35Hb5vMtyWWtKOBolpoyMhEJuDVs07rEUnOEJqdPsEhRblGDs3eFrHpN8BINeCNrxpxjuh9I0=w1064-v0)

图片来源：Source by SharkD，Datumizer CC BY-SA 3.0

无论是 RGB 还是 HSL，已经使用很多年了，为什么需要一套新的色彩空间呢？在回答这个问题之前，我们先来直观感受一下 HCT 的表现：

![HCT Gradient](https://lh3.googleusercontent.com/459crB0shmfQBhnWHtw5UPjX1x42hQ_1GNBxOjiwYootCbqzxno4rleDZ4e8ceuB1RDqyvyrtJTP7QkANIreOmp6Jwefk_yNGL42ZDSnXXCHmuXpvA=w1064-v0)

与其他色彩空间相比（尤其是显示设备最常用的 RGB），HCT 的渐变过渡更自然、更舒服。

![5HCTvsRGB](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5HCTvsRGB.png)

真是没有对比就没有伤害——原来我们一直在使用并不是特别适合人类感知和阅读的色彩体系。要知道，就算是问世比较晚的 HSL 模型，也是针对上世纪 70 年代的电脑显示器提出的。我们确实需要一套更好的描述颜色的方法了。

HCT 正是基于当今显示设备和人类色彩感知的原理，优化了色彩的表达，这样能够减少颜色带来的可读性问题、帮助设计师更高效合理地用色。

下面我们就来详细了解一下 HCT 主要解决了什么问题。

## 贴近人的色彩感知

现有的色彩空间，大都是用公式/数值表达颜色之间的关系，也就是说，以机器可理解、易呈现的方式来构筑色彩空间，它们大都符合序列插值的线性关系。

可是，当设计师在挑选颜色或者设计一套适用于产品的色系时，常常会发现，按照线性关系取出的颜色（无论是邻近色、对比色、互补色），总是需要调整，有的颜色虽然在算法取色的系列中，但怎么都用不出手。

比如，腾讯文档团队在生成产品色系时，其中一步是校正辅助色：

![](https://isuxdesign-1251263993.file.myqcloud.com/upload/detail/qb635daZb1tVkM71sXv4W2xCDfcP1P831nLC6rntG4y.png)

&gt; 校正原则：
&gt;
&gt; ● 色相必须保持是同类色（色相环中 15° 夹角内的颜色）
&gt;
&gt; ● 保持感官明度同频
&gt;
&gt; ● 保证视障群体的识别度

后两个正是 HCT 要解决的核心问题。

我们来具体看看 HSL 在表达色彩明度时存在的问题。

![7HCTvsHSL-1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/7HCTvsHSL-1.png)

上图有四种颜色，左侧黄色给人很明亮甚至有点刺眼的感觉，而右侧蓝色则亮度较低。这些颜色灰度处理后，亮度的差别就一目了然了，从左到右亮度依次降低。但是在 HSL 中，它们的亮度值（Ligntness）都为 50！

这说明 HSL 包括其他色彩空间，并没有基于人的感知而优化，所以与人的感官所接收解读的色彩感觉存在偏差。

HCT 尝试解决这个问题，它参照了两种色彩空间方案：L\*a\*b（也称为 LCH）和 CAM16。

&gt; 注：1976 年，国际照明委员会提出 CIE L\*a\*b\*（CIELAB）色彩模型，旨在提供一个感知上统一的空间，其中给定的数字变化对应于相似的感知颜色变化，而与设备无关（device-independent）。它是用来描述人眼可见的所有颜色相对完备的色彩空间。

- HCT 的 T（亮度度量），与 L\*a\*b\* 亮度计算方法类似。使用这种亮度测量以及一些数学技巧，HCT 可以测量对比度，直接集成对比度检查器算法，满足易用性要求。
  ![9LCH vs HCT](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/9LCH%20vs%20HCT.png)
  相比 HSL，测量的亮度范围为 33 到 96，更准确反映了人对色彩的感知

- HCT 的 H 和 C（色相和色度度量），与 CAM16 的色相和色度相同，能解决 L\*a\*b\* 在感知上不一致的问题。
  ![8HCTvsHSL-2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/8HCTvsHSL-2.png)
  对比 LCH &amp; HCT 颜色空间的投影，HCT 的一致性更佳。图片来源：[The Science of Color &amp; Design - Material Design](https://material.io/blog/science-of-color-design)

&gt; For the first time, designers have a color system that truly reflects what users see, taking into account a range of variables to ensure appropriate color contrast, accessibility standards, and consistent lightness/colorfulness across hues.

正如 Google 的色彩科学家所说，设计师第一次真正有了一套反映用户所见的色彩系统。

## 动态的色彩体系

近期发布的 Android 12 新增了 Material You 动态主题，可根据用户壁纸的颜色自动配置手机界面颜色。用户切换壁纸后，界面色彩会整体调整，过渡时让人感觉平滑舒适，这背后就有 HCT 的功劳。

#### 界面主题如何自动配置？

首先，壁纸的像素和颜色量化处理后，在色彩空间中合并，数千种颜色会大大减少。减少后的颜色集可以高效地运行算法，给颜色打分和过滤；然后系统再根据颜色的丰富程度和它们所代表的图像大小给颜色打分，并过滤掉接近单色的颜色。

确定主色（常用色或用户选定）后，主要依据色调（HCT 中的 T）扩展出一系列色板。设计师预先定义好不同颜色主题的参数，然后使用这些值和 HCT 来创建主题中使用的颜色。

![10Material You](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/10Material%20You.png)

#### HCT 颜色空间如何实现？

好消息是，Google 已经开源 Material Color Utilities。

Material Color Utilities 的本质是一个跨平台的颜色代码库，开发者借助它能够在任何平台实现 Material You 动态主题的功能：包括底层如何评测 HCT 的具体数值，也包括更上层的应用，例如生成画板和主题色。

![](https://github.com/material-foundation/material-color-utilities/raw/main/cheat_sheet.png)

Github 上目前已支持 Dart、Java 和 Typecript，C/C++ 和 Object-C 已经在路上。到 3 月底，Material Color Utilities 将添加以下模块：

- 自适应背景增强文本可读性——HCT 的色调将整合透明度，与蒙层和阴影共同影响对比度
- 使用 HCT 的图像过滤器和混合模式，并提供相应的 GLSL 着色器。
- 一种真实融合的新型渐变，使用 HCT 可以产生准确的混合效果，避免了其他色彩空间中出现的问题。

如果想更深入了解 HCT，建议仔细研究研究 Material Color Utilities。

## 小结

新的色彩空间 HCT 基于 L\*a\*b 和 CAM16，以 Hue Chroma Tone 来区分和命名颜色。优点包括：

- 基于人的感知和情绪感受，可产生较好的对比度，提升可读性
- 动态自适应，对跨平台的支持较好
- 易理解，易使用

有了新的工具，设计师也就有了新的可能性。

也许，离真正绘制「五彩斑斓的黑」不远了？

以上内容主要基于官方的介绍整理了自己的理解，如有疏漏还请提醒。

期待接下来看到大家在实践中的使用反馈和经验分享。🏂

## Ref

- [色彩空間 - 维基百科，自由的百科全书](https://zh.wikipedia.org/wiki/%E8%89%B2%E5%BD%A9%E7%A9%BA%E9%96%93)
- [CIELAB color space - Wikipedia](https://en.wikipedia.org/wiki/CIELAB_color_space#:~:text=The%20CIELAB%20color%20space%2C%20also,prevent%20confusion%20with%20Hunter%20Lab.)

- [The Science of Color &amp; Design - Material Design](https://material.io/blog/science-of-color-design)

- [Designing Harmony into Dynamic Color - Material Design](https://material.io/blog/dynamic-color-harmony)

- [material-foundation/material-color-utilities: Color libraries for Material You](https://github.com/material-foundation/material-color-utilities)
- [Accessibility - Material Design](https://material.io/design/usability/accessibility.html#color-and-contrast)

- [The Essential Guide to Color Spaces - Frame.io Insider](https://blog.frame.io/2020/02/03/color-spaces-101/)

- [腾讯文档-构建科学有效的色彩系统 - Tencent ISUX Design](https://isux.tencent.com/articles/tencentdocs-colors.html#/list/)

- [COULEUR.ORG](https://web.archive.org/web/20081207014820/http://www.couleur.org/index.php?page=transformations)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[投入当下，理解复杂——写在开年的 2022 年终总结]]></title>
            <link>https://tophci.com/posts/211231-2022ending</link>
            <guid isPermaLink="true">https://tophci.com/posts/211231-2022ending</guid>
            <category><![CDATA[2021]]></category>
            <category><![CDATA[2022]]></category>
            <category><![CDATA[零反思]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 30 Dec 2021 16:00:00 GMT</pubDate>
            <content:encoded>
&gt; 亚马逊创始人贝索斯有一个“逆向工作法”，让员工跳出现有技术和能力，转而设想未来的需求，再倒推现在该做什么。贝索斯曾要求 Echo 团队首先撰写产品发布时的新闻稿，其中包含大量科幻的细节，让团队发挥想象，以脱离“现在引力”的束缚，然后才开始研发产品。
&gt;
&gt; 也许，年终总结不该年底才写？

2022 年即将在钟声响起时成为过去。

翻到日历的最后一页，我又看到了四个大字：「理解复杂」。这是年初我给自己定下的主题词。

复杂有两层含义。一是包罗万象、瞬息万变的现实，我们那有限的理性倾向于简化、理想化现实，只看到自己投射的部分。另外一层是「复杂性 」科学（Complexity Science），它致力于研究大量简单个体组成的非线性但有规律的系统。

这一年，从理解复杂，敬畏复杂，然后意识到没有复杂——一切都只是现实。复杂表象之下，时时会涌现出有限度的反复。理解不是为了控制，理解只为了更好地参与：我们并不能改变潮水的方向，我们就是潮水。

Ride with it, right here, right now。

## 与自己

过去很多年，独处对我来说一点儿也不陌生。但今年有了一个明显的变化：一个人的时候，头脑变得比较安静。比如在步行上班、晚上跑步时，试着不去抓住漫天飞舞的想法，而是腾出一些空间给身体和感受，只是去感受。

开始练习以身体感觉为线索，去体察环境中的人事物正在发生什么变化，这些变化如何影响着自己。当别人跟我说了一句话，有时候我可以不即时反应，不去自动转化为要求和行动，可能只是简单地重复一次，试着用对方的语气而不是自己的回应，just repeat it。

尝试的次数多了，世界似乎慢了下来。没有那么多要着急回应的事情，也不是事事都得尽快做完。更重要的是，心里有一个微弱的声音逐渐被听到——那大概是我自己的声音，过去它总是被忽略，甚至被另一个严苛的声音压制住不敢发声。它微弱，但很重要，每次听见它，都能感到更平静，更有力量。

当生活中着急的事情变少，另一个期待已久的特质也慢慢浮现：对自己体贴。

体贴意味着有更多的能量关注自己的身体。唇干舌燥就去喝水；四肢僵硬就安排一段时间来活动；身体有了明显变化，就留意它发出的信号。体贴更意味着意外出现时，不再一味苛责自己，而是明白当时的情境其实比预想要复杂，事后诸葛亮来算帐，又算什么好汉呢。体贴也并不是事事都提前安排好，更重要是把自己当作脆弱/有限/迷糊的正常人，随当下的需要而给予。

一个人慢下来，就容易体会到那些好像「不重要」的事情的价值。比如好好做一顿饭，认真挑选和处理食物，身心因投入而放松，吃饭时的满足感，岂是囫囵果腹能比的呢？

一个人慢下来，也容易拨云见日，看到那些更重要的事情。而真正重要的事情，大都不会火急火燎，让人情绪如过山车般起伏。

比如说今年的投资吧。投资之所以复杂，是牵连纠缠的力量太多，加上瞬息万变，越短期越不可测。我们不可能降低金融系统的复杂度，但是可以建立自己的投资系统，在能力边界之内化繁为简。盘点清楚大类资产的配置，设定合理的收益预期，该长期投资的不死抠很小的浮动，注意到系统性风险后减少盲目操作，重要的不过就是这些。于是在年初，我简化了投资组合，出掉一些细碎、容易频繁操作、占比过高的投资。虽然年中遇到了大变，波动的边界已经限定在资产组合中，心态就比较平稳。

## 与他人

今年最大的进步，大概就是花在与「重要他人」相处的时间更多了。

罗翔老师说，人真正能影响的，不过是身边的几个人，是你所爱的人，是你愿意花时间的人。生活中能影响自己的，其实就是那几个重要他人。

今年在亲密关系中，体验了更多的丰（fu）富（za）性。亲密不只是共鸣，更多的碰撞、误解、澄清、袒露，甚至只是不知所措的相处，也会增进亲密。两个人能一起抵达人性更幽深之处而不被冲昏走散，需要很多的经营和建设。过去我不太理解里程节点的意义，现在想来，节点和仪式并不是最重要的，但是两个人需要去具像化自己心目中的未来图景，从个人畅想变成两人一起描摹，从模糊、违和到清晰、融合。最重要的是两个人的叙事主题契合，差异得以在合适的土壤中生长、共存。

今年面对了一个不小的冲击，这个过程不仅是「理解」复杂，更是「体验」复杂。面对不确定的恐惧，患得患失的纠结，趋利避害的天性，预期被现实打破时的恼羞成怒，不愿丢弃的幻想……头脑的理解也许只是假象，身体的反应和记忆会反复提醒我们，「理解」并没有那么简单，「体验」并没有那么复杂。

因为各方面的需要，今年还联系了好些久不往来的朋友。这种突破让我体会到，如果没有了麻烦和需要，也就没有了人与人之间的关系。关系也许跟知识还挺像：越用越多，越分享越有。社恐的避人倾向，确实需要一次又一次与想象不同的经验来治愈。

家人的健康、自己的变化、朋友的遭遇，都让我更加感慨人生苦短。

执着是本性，放手是悟性，我们依然需要很多运气，还有很多勇气。

## 与世界

身处复杂的世界，真的能够「理解」吗？

也许并不能。

但做一些改变也未尝不可：

- 承认现实与之前的想象不一样，想象不一定更好，现实不一定更坏
- 不要着急下判断，如果要下，也尝试至少代入两个角色去判断
- 有时候不需要「理解」，能变通能更好地与复杂共处就行
- 我们以为的区别真的存在？理解复杂是为了掌控吗？体验当下是不是更有趣？

面对工作中的复杂，对变化有更多的心理准备，也有意识多去具象目标、积累工具。

面对生活的困惑，找一些探讨现代性困惑的书来读，再找一些远离这些困惑的经典来对照。

面对盘根错节的兴趣，开始选取具体鲜活的问题，在复杂理论中着重寻找理解城市系统的视角和工具。更重要的尝试，是经由分析数据去「理解」复杂，是可视化城市的局部变化来「体验」复杂。

有意思的问题来了，明年或许可以继续探究：设计如何应对「复杂」？

经验复杂最好的方式，可能就是投入其中，记录但不企图解释它。今年的这些项目和文字，都是我与复杂性学习共处的记录。

---

又是时光荏苒的一年。不过与以往不同，此刻并没有太多的感怀和留恋，因为过去不重要，未来也不重要，每一个此刻，我都已经历。

![210107fish&amp;sea](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/210107fish%26sea.jpeg)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[大哉问07 - 什么是好问题？]]></title>
            <link>https://tophci.com/posts/210117-what-is-good-question</link>
            <guid isPermaLink="true">https://tophci.com/posts/210117-what-is-good-question</guid>
            <category><![CDATA[大哉问]]></category>
            <category><![CDATA[零反思]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 16 Jan 2021 16:00:00 GMT</pubDate>
            <content:encoded>
在大哉问系列的第一篇，[「用问题对抗虚无」](https://www.uegeek.com/171112-HowToAskGoodQuestion.html)，我回答了这个问题：

&gt; 为什么要多问好问题？

借助有意识地、主动尝试寻找答案的过程，来构筑意义、抵抗无序和虚无。尝试探讨了几个大哉问：

- [大哉问 01 - 什么样的时间观值得拥有？](https://www.uegeek.com/171126TimePerspective.html)
- [大哉问 02 - 如何爱自己？拟一份爱的宣言](https://www.uegeek.com/171204HowToLoveYourself.html)
- [大哉问 03 - 什么是赚钱之道？更新你的个人商业模式](https://www.uegeek.com/171216HowToMakeMoney.html)
- [大哉问 04 - 为什么要学编程？](https://www.uegeek.com/171223-Why-Learn-Programming.html)
- [大哉问 05 - 什么是学习中最大的误区？](https://www.uegeek.com/180106-the-learning-myth.html)
- [大哉问 06 - 学习中最应该养成什么习惯？](https://www.uegeek.com/180113-first-principle-of-learning.html)

写完后就难以为继了。为什么？

大哉问回答的问题，需要很长的时间去实践和内化，如果一直在回答大哉问，反而本末倒置，说理远远大于实践。

这也是阳老师最近提醒我们的，要保持稳定输出，而不是极致的输出。

我反思，大哉问的目的，首先是提问，而不回答。而我也忽略了，提问本来就是需要练习的技能。

所以，有了零魂拷问。

我打算记录每天在头脑中一闪而过的各种问号，也收集大家提出的各种各样的问题。

这样，零魂拷问首先是我的问题收集器。用知识星球的好处是，可以隔离开「问题」这种特殊形式和其他碎片化内容，也不会像微博、公众号、豆瓣那样有太多的消费内容，干扰「记录」这一目标。当有源源不断的问题池，我也不需要费力挑选写作主题，顺便增加了稳定输出的可能性。

其次，这里也是大家练习提问的地方。前几天在星球里提了一个问题

![image_218282285188121](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/image_218282285188121.jpg)

提问就是能反复练习且有价值的事情。怎样提出好问题？提出很多很多问题，去尝试表述方式，去比较，去看别人提的问题，去获得反馈。

当然，问题不断涌现和积累，也能帮助我们思考和讨论那些或有趣或有价值或有争议的问题们。

## 什么是好问题

在大哉问系列的开篇，留下了一个提醒自己要迭代的问题：

&gt; 什么是好问题？

这算是一个「元问题」，关于问题的问题。

当时我写下了一些好问题的特征：

- 描述清晰
- 不容易回答，值得 go deep，能激发更高、更抽象层级的思考
- 指向有潜力的探索方向，牵引出有价值的回答，激发行动和带来改变
- 开放式，没有唯一答案，不同背景经历的人可能会有迥异的答案
- 或者是时代的大问题，或者是超越时空的普适性问题
- 可能不会单独出现，而是一组相关问题

今天补充我对好问题的理解，或者说，对好问题的描述：

&gt; 好问题就像兔子洞，深不见底
&gt;
&gt; 好问题就像发动机，兴致勃勃
&gt;
&gt; 好问题就像礼物盒，暗含惊喜
&gt;
&gt; 好问题就像指南针，迷途灯塔
&gt;
&gt; 好问题就像生命体，自我繁殖

好问题呈现谜题、引人入胜、生成动力、注入乐趣、提供焦点。 好问题是无序与有序的桥梁，是改变的契机，是可能性的万花筒。 好问题既神秘又开放，既有深度又有广度，既自成一体又涉猎广泛。

以及，好问题一定不会阻碍继续发问。

可惜我依然无法定义什么是好问题，不过已经能越来越能识别它。

## 好问题的触发器是什么

这是六一同学在星球的提问。

触发器让我马上联想到 [行为改变 MAP 模型](https://mp.weixin.qq.com/s?__biz=MzAxNDE2NzAxOQ==&amp;mid=2667163730&amp;idx=1&amp;sn=1ddef87650ca94dfce4f47edd8478431&amp;chksm=809a6ed6b7ede7c029c811a309f302333df0b2f8a95c4dc6e0ac776398067c6a435282cd7904#rd)中的 P（Prompts，之前用的是 Triggers）。

行为肯定发生在场景中，所以我首先想到的是真实场景。应对具体场景我们总是会有具体的反应，真实意味着需要回应它，而且回应它大概率有价值。如果这个场景似曾相识就更容易触发。那些触动自己的问题，以前很可能在其他场景以其他方式出现过，只是我们不一定有意识。反复出现也意味着更有必要去理理看。

触发器也有可能是别人谈论到了一些话题（各类内容消费，看书看展听播客），让自己回忆起了在某些场景中的感受，而那些感受有点混沌不清，借助一个问题或者别人的阐述，我们得以开始澄清这些模糊。

触发器更有可能是自己某段时间集中关注的领域、话题、兴趣，念念不忘必有回响。 当然还需要那个时候有条件反应和记录下来，或者事后容易回顾。如果不容易（比如危及情况），就回到似曾相识的情况了。

总结起来大概是：真实场景 + 过往经历和感受的积累 + 有意识的搜寻

## 去哪里批量找好问题？

最现成的地方大概是 [Edge.org](https://www.edge.org/annual-questions) 的年度问题，可惜的是，年度问题在 2018 年结束了。

当然还有很多地方聚集或散落着好问题。比如知乎圆桌；比如各种访谈节目，从 Tim Ferris Show 到十三邀、易时间；再比如，经典的《十万个为什么》。

如果能从某些结果反推问题，那好问题简直太多：

- 看 App store 知名 App 到版本更新记录，反问每一个大版本，是要解决什么问题？
- 看国家的每一个五年规划，尝试寻找改革和制度创新要解答的问题
- 读名人传记，总结 ta 们各自的人生问题是什么，比如赫伯特·西蒙《我生活的种种模式》
- 踏入哲学之门（坑），去了解[大问题](https://book.douban.com/subject/30176572/)、[基本问题](https://plato.stanford.edu/entries/questions/)，开始对每一个常见概念发问
- 看一级学科和二级学科的起源，是为了解答什么问题，比如复杂系统是想描述和解释那些用传统还原论无法研究的对象：神经元、金融市场、天气变化、社交网络等等
- ……

当然，你也可以时不时光顾「零魂拷问」，一起记录好奇心在大千世界中的一次次跳动，一起练习提问这个一直被我们忽略的元技能，一起交流对问题的所思所感。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[作家之眼，治疗师之诚]]></title>
            <link>https://tophci.com/posts/210110-reading-note</link>
            <guid isPermaLink="true">https://tophci.com/posts/210110-reading-note</guid>
            <category><![CDATA[读书笔记]]></category>
            <category><![CDATA[心理治疗]]></category>
            <category><![CDATA[欧文亚隆]]></category>
            <category><![CDATA[卡尔维诺]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 09 Jan 2021 16:00:00 GMT</pubDate>
            <content:encoded>
&lt;meta name=&quot;referrer&quot; content=&quot;no-referrer&quot;/&gt;

已经很久没有写过读书笔记了，我想这大概与自己的读书状态有关。长久以来，阅读对我来说都是一种压力，甚至一种负担，但相比面对现实世界的复杂所产生的惶惑和疲倦，我还是时不时会遁逃到书本中寻求安慰。

对读书笔记的态度就更矛盾了。要写点正儿八经的东西绝对是焦虑的来源：期待自己写出一些其实在阅读当下并没有理解到、体会到的东西——读后的二次思考，或者说让那些阅读时闪现的火星、漂荡在空气中的只言片语都落下脚、现出形，变成一段又一段蔚为可观的文字，在我想象中，这是一件无从下手的事情。可是每当经历过从无到有的历程，不相信的事情就会成为脚踏实地的经验。现在回看好些笔记，我不确定自己真的能写出来： [GEB —— 一次关于有序与无序的探寻之旅](https://www.uegeek.com/geb-note.html)，[讲述设计本身就是另外一种设计](https://book.douban.com/review/8315101/)。就算有这些经验，每一次「要写点什么」的想法依然让我害怕。

大概有三年时间，我又回到了贪图阅读快感的状态：只管看，囫囵吞枣地看，不负责任地看，雁过无痕地看。直到最近，好像才感觉到自己和阅读的关系有所改善，既不必贪婪地逼迫自己榨取，也不沉湎于消费式的猎奇、已读数字的增加。允许自己不必读完一本书，也可以一读再读；可以毫无收获，也可以只对一句话有片刻共鸣；愿意面对书写时自曝其短的不安，也可以继续写一些漂亮但似懂非懂的抽象总结。

更重要的是，我找回了记录和书写的理由：纪念那些确实在阅读的时刻。为了让这种体验更新奇一些，我突发奇想，为什么不同时写我刚刚读完的两本书呢？如果只写一本书，容易进入之前严肃而自我压榨的状态；如果写主题式阅读的笔记，又会因为狮子开大口的工作量落荒而逃。如果写的是两本也许本身并无关联的书，会不会让我开始留意自己的阅读状态？如果能跳出一个作者所限定的框架，在交叉叙述中，说不定还会有意外的收获。

那就试一试吧。

&lt;!--more--&gt;

最近读的两本书，一本叫《[收藏沙子的旅人](https://book.douban.com/subject/27617853/)》，是意大利作家卡尔维诺看展、读书、旅行的随笔集。另一本是心理治疗师欧文·亚隆的自传《[成为我自己](https://book.douban.com/subject/33460827/)》。

![](https://img9.doubanio.com/view/subject/s/public/s33491495.jpg)

亚隆是团体心理治疗的权威，存在主义治疗代表人物之一，大概是仍然在世的心理治疗师中威望最高的一位。亚隆在国内的影响力，离不开他的另外一个身份——作家，一位充满想象力和人文关怀的心理治疗小说家。我想，从他的最后一本书（也是自传）看起，应该是不错的选择。

如果想了解存在主义治疗，去回顾一位以此为导向的治疗师的人生经历、他与来访者的故事，也许比研究什么是存在主义更直接有效。之前曾经了解到，在亚隆的治疗中，有很多自我暴露，他甚至会去来访者的家中拜访——这在有些流派看来可能匪夷所思。

&gt; 治疗效果取决于治疗关系的强度、温暖、真实和共情。

存在主义强调「此时此地」，引导患者勇敢地面对真实的自我，承担自由选择的结果。阅读亚隆的自传，能看到他是如何形成、理解这种治疗理念的。更重要的是，看到他如何将这一理念活在他的生命当中。

在书中，他坦诚了对母亲的遗恨、对死亡常常感到焦虑，承认「在我内心深处有一泓我永远都处理不了的泪水」。亚隆相信，在治疗中真正重要的是个人的坦诚和透明，而不是专业权威，并在他职业生涯和写作中身体力行。

&gt; 治疗中的变革力量不是理性的洞察，不是解释，不是宣泄，相反，而是两个人之间深刻的真诚相遇。

不走进治疗室，可能真的很难理解这句话。回顾我自己接受心理咨询的经验，洞察、解释、宣泄，也是剥离防御，抵达真诚的必由之路吧。现在我更能理解它的珍贵，接纳过去我因为不敢真诚而不得不接受的沉重丧失，也更有勇气向真诚透明更近一步。

这突然让我意识到，自己在阅读中也有很多不真诚：不去留意自己阅读时的感受，对自己「想不想继续看」、「觉得这本书对我而言到底好不好」、「对这一点我自己真正的想法是什么」并不诚实。

在翻开《[收藏沙子的旅人](https://book.douban.com/subject/27617853/)》前，我没有意识到自己带着一些想象，期待当年读卡尔维诺《看不见的城市》时，因文字激发的想象在头脑里如同烟花般绽放的体验会再度重现。我没有意识到这是一本「阅后」随笔集，于是失望出现了。

![](https://img9.doubanio.com/view/subject/s/public/s29775846.jpg)

书的第一部分是关于看展的文章，从古怪收藏展到怪物蜡像，从结绳到画作，卡尔维诺简直是个看展狂魔。前三篇过后，我发现自己开始走神，突然觉得这些文字有点厌烦——这是卡尔维诺诶，我提醒自己。可是这种感觉一直延续到第三篇章「奇幻故事」才有了 120° 大转弯。里面的五篇文章都非常精彩，尤其涉及到我感兴趣的地理和邮票的话题。第四篇「时间的形状」，日本的系列文章也看得津津有味，到了墨西哥又开始艰涩起来，虽然我去过这个国家（我竟然去过），但书中的很多描述无法形成画面感。后面到了伊朗的几篇，我又再度看不下去。

发生了什么？在回顾这一趟卡尔维诺带领我游览的旅程，我有了意外的收获：阅读本就是一件此时此刻的事情，情感的起伏，由作者塑造的阅读景观以及读者当下的游览方式共同决定。没有人规定一本书从头到尾都得是类似的感受，更不可能每一篇都有共鸣或收获。

日本、京都、地理、地图，这些话题我本来就感兴趣，而且还有不少实际的体验，自然能不太费力就构筑出一些想象。但是对书中其他展览的描写，我时常希望出现一段视频，好让我马上理解这一大段到底都在说什么。不耐烦的同时，又出现了另外一种奇怪的感觉：嫉妒。嫉妒卡尔维诺可以「无所事事」地看那么多展览，嫉妒他生活在文化气息浓厚的地方，嫉妒他可以花精力去研究历史、研究文学、研究一些稀奇古怪的话题。而我呢，只有在睡前的困顿中翻开书，匆匆扫过几页，合上书闭上眼，等到睁开眼又是打工的一天。

可是当我真的仔细去看书中的文字，又会发现自己真正缺少的不是时间，而是作家看待和感受世界的「高分辨率」，他们能看到很多同样摆在眼前但无人注意的细微之处，然后用天马行空的方式跃然纸上。于是另一种情绪又掺杂了进来：羞愧。在看写墨西哥的几篇时，我想起当时站在墨西哥国家人类学博物馆里，面对浩如烟海的展品和几乎完全不了解的印加文明历史，那种文化赤贫感，让我有一种第二天就回家好好读书重新做人的冲动。

意识到这些情绪，我发现自己真正是在阅读了：眼前的文字与我的经历有了碰撞，我有了真正属于自己的想法，不聪明但真实的想法。

于是我接纳了自己的嫉妒，接纳了自己的羞愧，也接受了自己做不到的局限，同时承认我只能欣赏这本书的部分篇章——如同亚隆在书中的坦诚。

没想到这两本书以这样的方式产生了联系，源自于自我观察的奇怪联系。

## 认识你自己

借由亚隆之口、卡尔维诺之眼，我对坦诚有了更多的理解，包括在阅读时的坦诚，也开始能辨认出那些在阅读时想回避的感受：我不懂、不满、不想看、不赞同……一直回避这些感受的代价是，到头来，我跟这本书真的相遇过、交谈过吗？大概并没有。

曾经急切地想借由阅读去理解世界，现在发现，阅读首先是帮助我们反观自己、认识自己，从而确立认识世界的基点，然后才好分辨哪些是别人的看法，我要不要全盘接受。

要珍惜那些在阅读时的共鸣，它提示我们去回顾那些被激活的经历，以及当中对我们而言重要但是没有得到准确表达的部分。这时候要感谢作者们帮助我们命名了这些经验，并延续了思考。

真正在阅读的时刻，也是重返生命重要片段的时刻啊。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[理解「理解」]]></title>
            <link>https://tophci.com/posts/200519-understand-understanding</link>
            <guid isPermaLink="true">https://tophci.com/posts/200519-understand-understanding</guid>
            <category><![CDATA[创作]]></category>
            <category><![CDATA[阅读]]></category>
            <category><![CDATA[理解]]></category>
            <category><![CDATA[Understanding]]></category>
            <category><![CDATA[教学设计]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 18 May 2020 16:00:00 GMT</pubDate>
            <content:encoded>
在写完《创作是最好的理解》以后，有一个问题开始纠缠着我：

&gt; 什么是理解（understanding）？

你想必也遇到过这样的状况：读一段很难理解的文字，虽然每个字都看得懂，但是完全不知道它在说些什么。好多时候满心想理解，但到头来云里雾里。更让人警惕的是，当下以为自己懂了，过了几天或者换了个情境，心中又升起好多个问号。

作为一个学习者，我自然希望能理解所学的内容；可是「理解」本身意味着什么，我至今却不甚理解。

## 理解之难

这两天在看陈嘉映老师的《何为良好生活》。在知行关系那一章里，陈老师提到「深知而与行合一」。我们都知道，知行合一不易。王阳明说：“未有知而不行者，知而不行只是未知。” 这可是对人提出了很高的要求。如果按照这个标准来衡量，我们所知那是少得可怜。

&gt; 好多人生道理，我们听说了，也知道了，但可能没有什么体会。先前的知和后来的知，不在一个知是对的一个知是错的，而在知的深度不同。……知道为恶仍为之，那说明我们只停留在“见闻之知”上，而没有切身体会。
&gt;
&gt; 《何为良好生活》

知的深度不同，说得多好啊。在这个信息爆炸、知识爆炸的时代，道理也爆炸。我们好像越来越甘于，甚至乐于停留在「见闻之知」上面。而真知呢，是道理深深嵌入到我们的身心，经历过，咀嚼过，生出了万般滋味，明白现在的「知」，已经不同于过去的「知」。

有好多问题，在「见闻之知」面前是问不出来的。我知道一件事，可是我有没有理解它呢？知道和理解有什么不同？知道了多少，可以算是理解？一个人在没有理解之前，如何能够知道自己其实并没有理解呢？再说了，韩梅梅认为的理解跟李雷的不同，学生自我感觉的理解，可能离老师的标准还很遥远。「我理解我自己」已经很难了，「我理解你」肯定是天下最奢侈的事之一。

说到人与人之间的理解这个话题就太大了，今天只说说对学习内容的理解吧。

## 何为理解？

循着这个问题，很快我找到了 Understanding by Design（下面简称 UbD）教学理念，它由 Grant Wiggins 和 Jay McTighe 提出。Wiggins 是 Authentic Education 的主席，哈佛大学教育学博士。生前活跃在教育领域，致力于推广 UbD 教学理念和推动教育改革。

「理解」在 Wiggins 的教学理念中很重要，他意识到，从事教育的同行们各自对此有不同理解。

&gt; …有的老师希望学生“真正懂得”，有的老师希望学生“内化知识”，还有的老师希望学生“掌握核心或本质”。他们讲的是一回事吗？具体来说，学生“真正理解”以后会怎么做，而不理解的时候又不会做什么呢？ —— Harold Bloom

| 定义                                                                       | 提出者      |
| -------------------------------------------------------------------------- | ----------- |
| 理解是学习者探求事实意义的结果。                                           | 杜威        |
| 理解是通过有效应用、分析、综合、评价，来明智、恰当地整理事实和技巧的能力。 | 布鲁姆      |
| 理解是能够灵活利用所学知识进行思考和行动的能力。                           | 戴维·珀金斯 |

有趣的是，美国科学促进会的《科学素养的基准》（Benchmarks for Science Literacy ）描述了在制定科学教学和评估的基准时，他们所遇到的问题：

&gt; 基准使用「知道」和「知道如何」来统领基准的每一部分。还有一种选择是使用一系列细化等级的动词，包括「识别、熟悉、领会、掌握、知道、领悟、理解」等，每一项都比前一项更为复杂和完整。该分级系列的问题在于，不同读者对于认知顺序的划分会有不同的意见。

理解被放在了一系列等级的最后，比领悟还要复杂和完整。这是多么高的要求啊！

我们并不能指望用简单的词汇来概括理解的含义，因为知道词汇本身跟理解是两回事。那么，知道和理解的区别又是什么呢？UbD 给出了下面这个列表：

| 知道               | 理解                                   |
| ------------------ | -------------------------------------- |
| 事实               | 事实的意义                             |
| 大量相关事实       | 提供事实关联和意义的理论               |
| 可证实的主张       | 不可靠的、形成中的理论                 |
| 对或错             | 有关程度或复杂性                       |
| 知道一些正确的事情 | 我理解为什么它是知识，什么使它成为知识 |
| 根据所知回应提示   | 我能够判断何时使用以及何时不用         |

跟知道相比，理解更强调知识的「上下左右」，它的背景、来龙去脉、使用情境、理论基础、变化和发展趋势，以及，一个人要如何运用它。

理解既是名词，也是动词。

## 怎么知道自己有没有理解？

&gt; 没有概念生成的过程，就不能获得任何知识的迁移，更不能对新体验产生更好的理解。
&gt;
&gt; ——约翰·杜威

理解是关于知识迁移的。

为了知道要应用哪一个事实，就要了解更多的事实。这个过程需要理解，即需要洞察本质、目的、受众、策略和手段。如果具备真正的能力，就能够将我们所学的知识迁移到新的情境中。UbD 强调知识迁移，认为这是理解的核心目标之一，也是教学的关键。

&gt; The goal of Teaching for Understanding is to give students the tools to take what they know, and what they will eventually know, and make a mindful connection between the ideas.
&gt; Understanding by Design

更具体来说，UbD 认为理解的目标不是一个，而是多个。Wiggins 和 McTighe 详细阐述了理解的 6 个方面。学习者如果能够从以下方面证明他们理解，就说明他们真正懂了。

- 解释 Explain：通过归纳或推理，系统合理地解释现象、事实和数据；洞察事物间的联系并提供例证。
- 阐明 Interpret： 叙述有深度的故事；提供合适的转化；从历史角度或个人角度揭示观点和事件的含义；通过图片、趣闻、类比和模型等方式促成理解。
- 应用 Apply： 在各种不同的真实情境中，有效地使用和调整所学知识。
- 洞察 Have perspective：批判性地看待、聆听观点；有全局观。
- 同理 Empathize：能从他人认为古怪的、奇特的或难以置信的事物中发现价值；在先前直接经验的基础上敏锐感知。
- 自知 Have self-knowledge：有元认知意识；察觉诸如个人风格、偏见、心理投射和思维习惯等促成或阻碍理解的因素；意识到我们不理解的内容；反思学习和经验的意义。

![6facet-of-understanding](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/6facet-of-understanding.jpg)

如果用简单的话来归纳，大概就是：**能翻来覆去地讲，能因地制宜地用，有助于理解自己和他人**。

今后如果遇到真正想弄懂的知识，就可以提醒自己：我能讲给别人听，让别人也理解吗？我能在什么情境用上？如果没有用上，是情境不适合，是没有进入备选方案，还是我并没有真的懂？学习了这些，我更理解哪些人了？过去有哪些看法需要改变？对我自己来说，又会有什么变化？

过去有很多时候，我会隐约觉得似懂非懂。在这种懵懂中继续上路，一路上仍然会反复经过同一个地方。只有经过这些地方时，发现自己有了跟之前不一样的理解，才会真切感受到变化——那个地方看起来没有变化，但是已经面目全非。我必须一次又一次经过这些熟悉的地方，以同样的路径，但尝试不同的时间、脚步、视角，才会迎来我懂了的感觉。

切身去体验，或者咀嚼碎了吞进身体里。

真知不易。

路漫漫啊。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[创作是最好的理解]]></title>
            <link>https://tophci.com/posts/200429-create-for-better-understanding</link>
            <guid isPermaLink="true">https://tophci.com/posts/200429-create-for-better-understanding</guid>
            <category><![CDATA[创作]]></category>
            <category><![CDATA[阅读]]></category>
            <category><![CDATA[Design]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 28 Apr 2020 16:00:00 GMT</pubDate>
            <content:encoded>
最近在准备写一本跟设计相关的书。因为比较偏理论，查阅了不少信息和文献，也顺带更新了不少信息源和工具。这个过程不得不让我想起，十年前在刚入行时也经历了这样一个阶段。不同的是，当年行业的资料还很有限，大量的理论和前沿实践基本都靠从国外翻译。即便发现了一本权威的行业著作，也获取无门：找不到公开渠道的电子书（或正版或盗版），也没有各大电子出版平台，图书馆的英文资料很少且不外借，只能咬牙在亚马逊上寻找和购买，或者期盼有台版译著，不然只能坐等国内引进并翻译了。

今天呢？今天我们有次日达的京东、当当，有可以从各国代购的淘宝；亚马逊虽然退出，但 kindle 上的原版书籍越来越齐全。今天我们有微信读书、豆瓣阅读、Google books 和各大平台的电子书商店。今天我们有多抓鱼、孔夫子，长期缺货、绝版书也再不是问题。今天我们有 Sci-hub、Libgen、古腾堡计划，英文原版书籍甚至比中文书还容易找到。今天我们还有百度云盘、数不清的电子书分享网站，以及类似鸠摩这样给力的搜索引擎。今天我们有 B 站、Youtube，早已经不再满足于文字形式的信息和知识，视频已经是获取新知的首选了。

### 信息越丰富，理解越匮乏

今天我们拥有的一切，在十年前看起来简直有点魔幻。一切都唾手可得，这个曾经的梦想几乎已经实现了。可是另一个幻想好像同时破灭了：人因信息而更自由。

没错，信息流通速度提升了不止 10 倍，可是信息和知识之间的鸿沟、知识和理解之间的鸿沟、理解和行动之间的鸿沟，有没有变小呢？我相信它们都变小了，只不过，对比极大丰富的信息量本身，这些变化显得微不足道，甚至显得鸿沟反而在加大——**正是信息的丰富，让我们不得不承认理解的匮乏。**

信息就像是无限增长的数字 0，如果它前面没有 1，这些 0 再多又有什么意义呢？我们不可避免会花费大量时间去追逐 0，也就更难停下来，认真审视自己有没有获得那个 1——自己的理解能力到底有没有增长，如此丰富的信息到底有没有促成自身的改变？

### 是什么促成了理解？

#### 问题能促成理解

我们被谜题吸引，投入注意力到其中，期待看到它更多的面貌，期待那个谜底揭晓的 A-ha moment。如果没有对问题的好奇，也就不存在探寻之后的理解吧。当我们每天面对信息洪流的时候，几乎立刻就开始做出开始读的反应。看见一个有意思的标题，好像脑子就被置入了一个不属于自己的动机，然后就不需要再去觉察自己真正的动机：我到底为什么要去看呢？

因为大家都看了，我就有必要看吗？因为它说的有道理，我就有必要看吗？因为不希望错过重要的内容，到底什么是重要的呢？因为会对我有帮助，那具体是什么帮助呢？

好奇心是珍贵的，它确实指引我们发现很多重要的东西。可是好奇心总是在需要更多投入之后，就消失了。我们可以仅仅因为好奇心打开一篇文章，翻开一本书。可是开始阅读之后，我们怎么好像提不出问题，并没有因为一些内容产生更多的好奇心。更多时候，我们快速浏览，似乎最重要的一件事情就是判断这篇文章值不值得细读或分享，然后我们或者收藏、或者发圈、或者离开。当我们一天忙着打开几十篇文章，就真的没有时间去问一问，此刻自己心中升起了什么疑问，这个问题是否反复出现而没有得到解答，自己又是否愿意真的投入一些精力，去好好跟这个问题谈一谈。

理解的前提，是存在需要被理解的东西。提问题就是把这看不见摸不着的东西，好好地具象化的办法之一。

#### 加工能促成理解

提出了问题以后，问题能指引我们投入更多：找更多相关内容，阅读并整理它们的关系，把以前的知识和经验拿出来做对比，尝试把当前所见整合到过去似曾相似的结构中。这个过程就是加工的过程。

好比我们从市场买来食材准备做饭。摘菜、洗菜、去皮、剁块、切肉、加入酱料腌制、混合……每一道加工，都让食材更接近烹饪的状态，而我们对食材的了解也更直接更细微：是不是新鲜，摸起来怎样，闻起来怎样，大小是否合适，什么要跟什么搭配在一起……

阅读内容的时候，也需要这样的加工。理解就是在反复的思忖、把玩、联系、对比、拆分合并中，一点一点发生的。

#### 交流能促成理解

一个人的加工能促成理解，如果两个人或更多人参与进来，加工的广度和深度又可以升级。当然，前提是大家基本清楚在对什么东西进行交流。每个人的经验不同，处境不同，解读角度不同，这种集体的加工是深入理解的好方法。

#### 直接经历能促成理解

没有什么比实践和经历带给人更完整、更真实的理解。当所有的一切都发生在鲜活的现实中时，我们就有了无数个理解的切入点和待加工的素材。再丰富生动的语言也是抽象的，也没办法传达事件发生当时的所有一切，更没有办法传达只属于个人的直接体验。

#### 创作能促成理解

观看者的身份总是幸福的。保持距离，无需挣扎，不必投入和承诺，随时可以离开。我们看电影、看小说、看抖音视频，总是轻松自在的。可是当我们要去写一篇文章，完成一个采访，制作一段视频，创造一首歌曲，办一家企业，事情可就完全不同了。进入创作的状态，我们必须搞懂一切都是如何从无到有的。没有哪种身份，能像成为创作者那样让人感觉到自己的无知——要从这种无知出发，抵达创作的终点，我们只能尽力去理解，去回答心中一个又一个疑惑，发起一次又一次的尝试。

要想创作，一定会迎接很多问题，对素材做各种加工，跟其他人交流或求助，在创作中去经历一切。在创作中，一个人能更加看清自己的模样，他要面对现实，他要怀抱希望，他要在混乱中寻找出路。

### 最好的时代

这是创作者们最好的时代。

信息和工具已经取之不尽用之不竭。虽然认知带宽瓶颈始终存在，也看不到什么突破的可能，但是创作本身就提供了最好的途径，让我们有机会去发问、去理解、去尝试、去探索、去犯错、去交流、去完成。

创作才是最好的信息来源。

创作才是最好的学习方法。

创作才是最好的生命过程。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[灰烬之上，尽是重生——那些疫情中的片刻领悟]]></title>
            <link>https://tophci.com/posts/200221-covid-reflection</link>
            <guid isPermaLink="true">https://tophci.com/posts/200221-covid-reflection</guid>
            <category><![CDATA[Covid-19]]></category>
            <category><![CDATA[零反思]]></category>
            <category><![CDATA[新冠]]></category>
            <category><![CDATA[疫情]]></category>
            <category><![CDATA[心理]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 20 Feb 2020 16:00:00 GMT</pubDate>
            <content:encoded>
2020 年的春天，突如其来的疫情一夜之间改变了数十亿人的生活轨迹。

有的人陷入与疾病的苦战，有的人临危受命，有的人一夜长大，有的人趁火打劫，有的人期盼团聚，有的人痛失所爱，有的人收获了爱情。而更多的人，感受着恐慌焦虑，失去部分行动自由，揪心于事态的发展，默默做着不知道是否会有效的祈祷。

在这场劫难中，有很多人和事件会被历史记住，有更多的则会在记忆中逐渐消散。但是每一个人在其中体验到的所有情绪，都是鲜活而深刻的，它们是劫难中带着温度的、属于人的印记，会消散，但不会冷却。

我想在它们消散之前记录下来，作为一个结束，也作为一个开始。

## 上篇 当我们选择看见

在突然魔幻的现实中，似乎所有的人性都像画卷一样铺陈开来，被展现，被放大，被讨论，被记录。

在这样的混乱和应激之中，我们反而看见了比平时更清晰的画面：所有的一切都纠缠在一起，所有的一切都是完整如一的。并没有什么善、什么恶，只有善和恶；并没有什么懦弱、什么勇敢，只有懦弱和勇敢；并没有什么愤怒、什么悲伤，只有愤怒以及悲伤……如果你体验到了巨大的无力，那么你也会感受到内心深处涌动着的不安和力量。如果你感受到了强烈的爱，那一定也感受到了同样猛烈的恨。

一切都在显现，以它本来的面貌。而我们因为被痛苦赋予了力量，也开始选择去看见。

### 混乱与秩序，生命的责任

如果不是这一场天翻地覆，我们可能不会发现，在日复一日的井然有序中，我们已经失去了感受和应对混乱的能力。我们看不见城市和社会中无数系统、人和管道的默默运作，将一种能量转化为另一种能量、将物品拆解组装聚合分发、将无数信息转交给散落各地的人们——日常的背后，有太多太多不寻常的努力，将混乱转换成了秩序，支撑起我们每一天看似平凡的生活。

在纪录片《Epidemic 流行病》中，全球能够不受大规模传染病威胁的每一天的安宁，都是由无数人与时间赛跑、默默守护下的奇迹。这其中包括小镇社区医院的医生、监测世界疫情的专家、推动疫苗立法的官员、研究广谱流感疫苗的科学家、抗击埃博拉的世卫工作者、在疫区救死扶伤的医生……更不要说为了保证所有系统正常运转、满足生活衣食住行基本需求，而在自己工作岗位上尽职工作的千千万万普通人了。

这是人类伟大的协作，也是一种独特的「搭乘」机制。一旦某个领域有了惠及全人类的突破，那么全人类都将搭乘一趟更快的列车，继续我们进化的历程。

薛定谔在《生命是什么》中揭示了生命的一种本质。熵是混乱与死亡的趋向，是万事万物不可逆转的终极归宿。而生命所做的就是吸取负熵，维持在低熵水平。也就是说，**生命的本质是在局部产生秩序，对抗死寂**。在这场疫情中，混乱与死亡突然逼近，才让我们意识到，原来看似平淡无奇的每一天，都是多么的生机勃勃啊！日复一日的平常之中，人们凭借一种遥远的相似性、一种没有印证过的默契，在一起对抗无序、对抗死亡、对抗时间的凋零。这一场战役，更让我们看到了彼此的存在，站到了彼此身旁，向彼此做出承诺。只有这样，我们才能面对千百倍暴风般的混乱，才有了信念和勇气，一起去跟巨大的无序抗争，恢复生命的本质。

**生命的本能和责任，就是恢复生机，继续向死而生。**

**生命的脆弱和坚韧，因为彼此的陪伴和依靠，有了永恒的信仰。**

### 现实与幻想，希望的轮回

曾经安全、健康的现实，此刻成了幻想。曾经团聚、守护的现实，此刻成了幻想。曾经发展、创造的愿望，此刻成了更遥不可及的幻想。

当曾经的已知变成未知，一切坚固的事物都烟消云散了。Routine 被打断，生活不再是曾经的模样，要跟很多人事物告别。尤其剧烈的是，自己曾经相信的一些东西开始动摇：是选择继续坚守，是随机而变，还是推翻重建？

现实与幻想的置换，给了我们重新掂量一切的机会。什么重要，什么不重要，一下子清晰显现。这是价值观可能崩塌的时刻，也正是它重塑的时机。而要不要重塑，似乎不是自由意志可以决定的。比自我意识更大的存在，是复杂的现实带来的冲击，在各种情绪反应中，我们会如何感知、如何提炼、如何映照出自我、又如何予以回应。

当现实突然崩塌，每一个人都在经历丧失。

丧失带来悲痛感，它是对无可奈何的一种承认和接纳。

生死是未知的，痛苦是确定的。

幸福是未知的，安危是确定的。

结束是未知的，开始是确定的。

他人是未知的，自我是确定的。

愿望是未知的，行动是确定的。

结果是未知的，承诺是确定的。

未来是未知的，此刻是确定的。

所以，我们在巨大的对比中感受到了力量，不再有过多的顾虑，而是勇敢地建立联结、做出承诺、相互坦诚、彼此依恋。

在巨大的未知中，我们藉由彼此的力量，重新拥有了唯一的确定。

它就是希望。

### 人之为人，立体而普适

在这一幅历史画卷中，我们看到了太多的人心，包括自己。

- 我们往往意识不到当下言行真正的影响，也意识不到自己真正的责任所在；
- 面对巨大的恐惧时，我们会否认、会退缩、会不由自主；
- 在危险来临时，我们想控制、想主宰、期盼心想事成；
- 我们期望他人是完人，越是危机时刻，期望（幻想）越大；
- 对他人的感同身受，会形成感召，赋予我们非凡的勇气；
- 资源有限会放大所有人的局限；
- 我们以为自己能做到的，往往做不到；以为自己做不到的，往往能做到；
- 人无时无刻都在区分群体来简化世界，比如确诊的、武汉的、戴口罩的；
- 在信息洪流中，因为渴望已知，我们会饥不择食，然后制造更多的未知；
- 焦虑盘旋的时候，急切需要一个出口来缓解，行动往往是这个出口；
- 人有特权，但生命没有特权，能在人际网络中就是生命的特权；
- 群体共鸣来得特别猛烈，但也消散得很快；
- ……

还有太多太多，我好像只能用一句句特别没有血肉的短语来这样简单记录。

在这场揭示全人类命运的运动中，我们有机会以个体的视角，看到这个命运共同体内其他同伴的遭遇和应对。

每一个他人的经验，都有可能发生在我们身上，都可能是我们自己的经验。藉由他人的经历，我们有机会去观察和想象自己在相同情境之下，可能会是什么样。

- 在情境恶劣、资源匮乏的时候，我是否会作恶？我是否还能明辨是非？
- 在面临诸如生和死、自我和他人、公和私、安危和承诺、需要和信任等等的两难选择时，我会如何做？
- 如果情境危急时需要我的能力，我是否会挺身而出？什么是属于我的战场，什么又不是？
- 什么是责任？什么是权利？什么是权力？它们如何相互作用？
- 个人的极限到底在哪里？什么时候要再努力？什么时候应该承认自己确实无能为力？
- 到底有没有真相？应不应该要求他人按照自己的期望行事？
- ……

他人不是地狱，他人也许就是自己。

无论勇敢、懦弱、坦诚、善良、无知、狭隘、周密、宽容、鲁莽……都是人类这个命运共同体的一个面相，也就是我们每一个人可能的面相，只不过别人替我们完成了这个呈现。只有在这种全体参与的巨型历史事件中，人性才有机会得到 360° 立体呈现。

看到了人的各种可能性，也就看到了生而为人的局限和潜力。伟大与愚蠢同在，神性与阴暗并存。种种局限的两极，拓展了人性的深度，这是不幸的来源，也是我们最根本的幸运。

## 下篇 当我们选择领悟

在现实的灰烬中，曾经的幻想已经蒸发殆尽，微弱而新鲜的愿望正在萌发。

在疫情中经历的种种体验，到底想告诉我们什么，想让我们记住什么，希望什么东西从此不同？

我想每个人都会有不一样的领悟，因为每个人的体验都是独特的。而其中又会有彼此交融和共鸣的部分，我们也许能借助这些部分，相互告慰。

### 当下是无常最好的救赎

生命无常。

疫情之前，我们觉得生活会就这么继续下去。每天相见的人明天还会见到，工作和生意会继续，牙疼可以晚点再看，表白可以晚点再说，聚会约不上就下次，头发等下周再剪吧……

生活何尝放过谁。无常一定发生在平常中。直到它发生的那一刻，我们才意识到日常也只是一种假象。我们觉得无常很无情，是因为在无法预测的情境中，我们会失去最重要的东西，只换来长久的痛苦。如果没有恒常，那我们还应该依靠什么，期盼什么？

人无法躲避无常，但可以应对、甚至消解无常——不产生「常」，也就不存在无常；将每个时刻变成恒常，也就不惧怕任何周期的无常。

只有无常最能教人领悟「当下」的意义。承认下一个时刻一切皆有可能，我们就不会抱有这样那样的期望，反复在可能性之上构筑更多的可能性，最终换来的是现实坍缩之后一切的崩塌。

此刻发生了，便让它好好发生，观察它正在如何发生，我产生了何种情绪和体验，要如何投入与应对。去做当下、此刻、我可以做的事情，放开远处、彼时、他人应该如何的妄念。

我们接下来要见的每一个人、要做的每一件事、要去的每一个地方，甚至每一次梦境、心痛、呼吸，都可能无法再现。意识到时间是一条不可逆的单行道，会带给人巨大的悲伤，以及悲伤过后的释然。一切都不会再来，一切都会不一样，一切都可能终结。

不要争辩、不要逆转、不要挽回，只是救赎。

未来即无常，片刻才永恒。

### 人性的复杂是最好的礼物

人性的裂隙和光芒，都是人的希望。

复杂如人，反而理解不了自己的复杂。这是多么吊诡的事情啊。

不只是人复杂，人形成的群体、群体形成的关系、关系之上的制度、制度产生的结果……越来越复杂的信息和现实世界，让我们总是有冲动想要去简化人本身。我们会用打标签、群体化、物化、概念化、数字化等等方式来尝试降低维度，把人还原为简单可预测的个体。

太难了。人是社会和情境动物。人在关系中，关系是非线性的；人在情境中，情境是变化万千的；人在个人的意识孤岛里，意识是难以表达和交换的。

想要理解一个人，哪怕是理解自己，都需要放在流变的自我意识中、关系中、情境中，个体的丰富性才得以全面显现。也不是我们不想更「立体」地去看待一个人，而是每个人都如此立体，我们要怎样平衡认知资源有限和认知效果有限之间的矛盾？

幸运的是，每个人都承载着复杂性。我们甚至不需要刻意去寻找「最好」「特别」的那一个，就已经能在个人网络所及范围之内发现各种各样的人，也能跟身边因为各种机缘而发生联结的人有深刻的互动。

更何况，我们自己就是一个值得持续探索的个体。认识人性的复杂，往往由认识自身的复杂而开启。在疫情中的种种事件，都是自我探索的好素材。

愿你我都能看到自身的复杂，理解和接纳自己和他人的局限，也永远怀有对人的可能性的信心。

人会犯错，会作恶，会迷失。但人永远有更多的可能，这就是身而为人最好的礼物。

### 真正活过是最好的墓志铭

这一次疫情，大概前所未有地引发了大范围的死亡焦虑。除了感受到无常、混乱、恐惧，还有一个迟早会来问候我们的问题：「活着是为了什么？我愿意就这样死去吗？」

不知死，焉知生。死的焦虑能唤起对生的思考。

我在想，如果我不能完全坦然地面对死亡，而是希望有机会重演一些时光，那说明我还未尽力活出自己。如果我有所追悔，那一定包含因为妥协和顾虑而没有说真正想说的话、没有开始做一直想做的事、没有承担责任和没有发挥所长，而不是后悔哪些话语得罪了谁、后悔把事情搞砸了。最深切的追悔，大概会是那些可能性：如果完全按照自己的心意作选择，最终我会是怎样个性的人、把精力和才华投入到什么事情中、跟谁携手经历了深刻的体验……

真正活过，就不会惧怕死亡（可能会有留恋）。

疫情中，我修改了自己的墓志铭：

&gt; 这个人探索过世界，也成为了自己，ta 全然体验了这一趟旅程。

### 生命脆弱，风险常伴

突如其来的疫情，是风险的大考。一考试才发现，自己的风险意识和防范措施都还如纸一般薄弱。

风险无处不在，但是分布并不均匀。流行病的扩散，给我们上演了最生动的一课：风险有很大的不对称性，在风险不同阶段采取的不同措施，对结果影响的差异巨大。

人无法对抗概率，但是有办法影响概率。

我尝试给自己列一个风险应对清单：

- 风险防范第一原则：意识到风险无处不在，至少要为最坏可能做好预案
- 风险控制不是为了收益，是为了尽可能减少损失，为了不输得精光
- 评估风险类别（人身安全/健康/财产/法律/政策...），识别来源
- 学习利用保险杠杆、时间杠杆、空间杠杆等方法去分散、对冲风险
- 储备常识（急救/基础医学/保险/法律）
- 储备物资（药箱/防火/野外/现金/食品）
- 紧急预案（自己挂了/送医/逃生/破产）

无知有很多层面，最可怕的是对无知的无知，最惋惜的是明明可为却不作为。

承认脆弱，防范风险，然后尽力而为。

### 争个人的自由，便是为国家争自由

面对天灾，我们会悲天悯人，积极自救。面对人祸，我们还需要愤怒、争论、问责和全面自省。

这场劫难中许多血淋淋的现实告诉我们，人性皆有裂隙，而由人设计的制度同样有许多残缺。

如果没有发生意外，我们不太有意愿参与到公共事务当中，也没有意识到自己正在一次又一次让渡权利给一个假想的完美机制。

可现实是，公共事务不是由高阶的外星文明运营的，它是由跟我们一样有着七情六欲、不同知识和认识水平、不同背景和经历的人们组成的群体来运作的。如果我们期望公共事务得到理性和妥善的处理，那身为其中一份子，也需要去了解自己的权利和义务，需要去提升作为公民参与事务所需要具备的基本素质。

&gt; 争个人的自由，便是为国家争自由

所谓争个人的自由，有很多层面，这里只列一些个人参与公共事务可以去做的事情吧：

- 清楚「有关部门」到底是什么部门，与什么有关
- 了解科学研究是如何开展的，研究结果如何检验，如何公布，如何获取
- 形成自己的信息渠道评估标准，哪些可信，哪些存疑，哪些需要交叉验证
- 了解信息如何传播，了解媒体的属性和运作方式，了解个人在传播中的作用和影响
- 了解与个人息息相关的公共政策，比如社会保障、财税制度、户籍、公共卫生等
- 列一些跟自己有关的法律，以及为什么有关，读一读基本的法律条文
- 了解民众参与公共事务的方式，了解自己有哪些选举的权利并且参加
- 了解宏观系统的基本常识，例如金融、国际贸易、社会组织、政治组织等
- ……

我们关注的、咀嚼的、消化的，最终将变成我们的一部分。

希望我们不仅能铭记在这场劫难中奋不顾身做出各种牺牲的人们，更能意识到自己是组成系统的一份子。我们可以在事件当下，随着情绪而振臂高挥；也可以在潮水退去以后，把责任转化为行动，去一点点改变自己和自己所在的体系，以此来纪念前人的付出。

**如无意外，过去会成为未来。**

但我们依然可以努力。

## 最后

一切都已改变，一切终将如常。

还有很多其实来不及诉说，也不知道该如何表达。当下已经走到这里，我尽力领悟，尽力哀悼，也尽力前行。

最后，想用青峰的两句歌词来结尾。它们曾经在多年前的至暗时刻给了我力量，如今我又有了一些新的理解和期许。

&gt; 美好是因为克服美好的恐惧，
&gt;
&gt; 美好是因为无视美好的逝去。

祝福我们。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.012 - 人因工程相关术语解析]]></title>
            <link>https://tophci.com/posts/200208-design-diary-012</link>
            <guid isPermaLink="true">https://tophci.com/posts/200208-design-diary-012</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[人体]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[人体工程学]]></category>
            <category><![CDATA[建筑]]></category>
            <category><![CDATA[尺寸]]></category>
            <category><![CDATA[Dimensions]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 07 Feb 2020 16:00:00 GMT</pubDate>
            <content:encoded>
今天我们来辨析一组容易混淆的术语。

| 英文                     | 中文译名                     | 使用范围           |
| ------------------------ | ---------------------------- | ------------------ |
| Ergonomics               | 人类工效学、工效学，人机工学 | 欧洲、世界其他国家 |
| Human Factors            | 人因学、人体学               | 美国               |
| Human Factor Engineering | 人因工程学                   | 美国               |
| Human Engineering        | 人类工程学，人体工程学       | 某些学者           |
| Engineering Psychology   | 工程心理学                   | 主要是心理学家     |

国际人因学会（International Ergonomics Association，简称 IEA）将人因学（Ergonomics）定义为：

&gt; 人机工程学是研究人在某种工作环境中的[解剖学](https://www.wikiwand.com/zh-hans/解剖学)、[生理学](https://www.wikiwand.com/zh-hans/生理学)和[心理学](https://www.wikiwand.com/zh-hans/心理学)等方面的各种因素；研究人和机器及环境的相互作用；研究在工作中、家庭生活中和休假中怎样统一考虑工作效率、人的健康、安全和舒适等问题的学科。
&gt;
&gt; — International Ergonomics Association

简单的说，**人因工程学是一门研究人-机-环境三者之间相互关系，**深入理解人与系统中的各个组成元素之间如何产生相互关系的学科。

IEA 强调，人因工程关注的是规律（discipline）而不是技术（technique）。而 human factors 则直接强调人作为系统中心因素的重要性。人因工程的名称在世界各地虽然表述各异，研究的侧重点也不完全一样，但中心内容大体相同：

- 研究内容：人-机器-环境系统的相互关系。
- 研究方法：对人的能力和行为（生理的、心理的）进行深入研究，把成果用于设计和改善机器和环境。
- 研究目的：使机器和环境适应人的需要，这些需要包括：提高工作和生产效率；保障人的健康、安全和舒适。

![](https://upload.wikimedia.org/wikipedia/commons/thumb/a/ac/Kieler_Puppe.jpg/460px-Kieler_Puppe.jpg)

Human factors 在欧洲又称为 ergonomics，20 世纪 50 年代传入我国。而在同样使用汉字的日本，则称为「人间工学」。1979 年在北京召开了一次研讨会，确定将 human factors/ergonomics 翻译为「人类工效学」，主要考虑它是一门研究人的学科，又注重人机系统的效率。1989 年，中国人类工效学会成立。

曾任人类工效学会理事长的张侃认为「人类工效学」的翻译有几方面不妥之处：

- human factors 不只关注工效，而有更多更深的人文精神在里面
- 「人类工效学」容易让非专业人员从表面上看得懂，实际上并不能懂
- 它不是一个很凝练的中文术语，在和一些专业术语搭配使用时不方便

他建议翻译为「人因学」。并在 2007 年翻译「An Introduction to Human Factors Engineering」书名为「人因工程学导论」。

为了人因工程的理念在全世界范围内更广泛的推广，世界各国逐渐开始使用「Human Factors and Ergonomics」来代替原来繁复多样的名称。为了便于与国际接轨，我们广泛接受「人因工程学」作为此学科的中文定义名称，简称「人因学」。

![](http://inews.gtimg.com/newsapp_bt/0/2861401844/1000/0)

人因工程的研究领域包括：生理人类、生物力学、人机交互、工程心理及管理工效等。

人因学和心理学是一对姐妹学科，特别是在当代人机系统发展到监控系统的阶段，工程心理学更是成为人因学的核心部分。不同范围内人因学因素（如体力局限、显示加工、记忆失败等）所显示的人的操作绩效不同，也需要分析不同领域生产设备中的重要元素（例如交通系统中的人因学因素分析）。

至于人体工学、人机工程学、人类工程学、人机工学，也都是 human factor 和 ergonomics 的不同翻译。

重要学会：

- [International Ergonomics Association (Switzerland)](https://www.iea.cc/)
- [Chartered Institute of Ergonomics &amp; Human Factors (UK)](https://www.ergonomics.org.uk/)
- [Human Factors and Ergonomics Society (US)](https://www.hfes.org/)
- [The National Institute for Occupational Safety and Health (NIOSH) (US)](https://www.cdc.gov/niosh/about/default.html)
- [Board of Certification in Professional Ergonomics (BPCE) (US)](http://www.bcpe.org/)
- [中国人类工效学学会](http://www.cesbj.org/)
- [The Hong Kong Ergonomics Society](http://www.ergonomics.org.hk/)
- [人因与工效学研究所-清华大学工业工程系](http://www.ie.tsinghua.edu.cn/List/index/cid/54.html)

[SJR](https://www.scimagojr.com/) 排名前几位的期刊：

- [Human Factors](http://hfs.sagepub.com/)
- [Ergonomics](http://www.informaworld.com/smpp/title~content=t713701117~db=all)
- [Applied Ergonomics](http://www.elsevier.com/wps/find/journaldescription.cws_home/30389/description#description)
- IEEE Transactions on Human-Machine Systems

## Ref

- [Human factors and ergonomics - Wikiwand](https://www.wikiwand.com/en/Human_factors_and_ergonomics)
- 人因工程学导论
- 工程心理学与人的作业
- [Ergonomics workplace &amp; product design research, anthropometrics, training, ergonomic standards &amp; guidelines](https://www.humanics-es.com/recc-ergonomics.htm#humanfactorsergonomics)
- [Scimago Journal &amp; Country Rank](https://www.scimagojr.com/)
- [人因工程碰到人工智能，将会迸发出什么样的火花？](http://kuaibao.qq.com/s/20180209A0USQP00?refer=cp_1026)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.011 - 人体尺寸与设备、物件的高度]]></title>
            <link>https://tophci.com/posts/200117-design-diary-011</link>
            <guid isPermaLink="true">https://tophci.com/posts/200117-design-diary-011</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[人体]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[人体工程学]]></category>
            <category><![CDATA[建筑]]></category>
            <category><![CDATA[尺寸]]></category>
            <category><![CDATA[Dimensions]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 16 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
[上一篇日课](https://www.uegeek.com/200114-design-diary-010.html)我们了解了人体站立和坐姿的相关尺寸。今天要更进一步来学习，人在常见的活动中，与空间物件和设备例如架子、烹饪台等，产生互动时的尺寸。

日常设备和物件与使用者的身高密切相关，下面的图表是以身高为划分标准，利用浮动标值和概略比推导出物体必要的高度。

![V011以身高为基础的设备物件高度的浮动值](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V011%E4%BB%A5%E8%BA%AB%E9%AB%98%E4%B8%BA%E5%9F%BA%E7%A1%80%E7%9A%84%E8%AE%BE%E5%A4%87%E7%89%A9%E4%BB%B6%E9%AB%98%E5%BA%A6%E7%9A%84%E6%B5%AE%E5%8A%A8%E5%80%BC.jpg)

下面列表的序号，对应上图中尺寸高度序号和活动类别序号，右侧的数字表示与身高的比值：

1 **手能够触到的高度** 1.33

2 **能取放物品的架子高度**（上限） 1.17

3 倾斜的地面与天花板之间的距离（最小值，地板倾斜度 5°~15°） 1.15

4 楼梯与天花板之间的距离（最小值，倾斜度 25°~35°） 1.00

4 遮挡视线的隔墙的高（下限） 1.00

5 **眼高** H-12cm

6 抽屉的高（上限） 0.91

7 **易于使用的架子的高（上限）** 0.85

8 陡峭的楼梯的天花板高（最小值，倾斜度 50° 左右）

9 易于行使打开动作的高度（最大力） 0.6

10 人体的重心高 0.55

10 **站姿作业时的点高** 0.55

10 **坐高** 0.55

11 **烹饪台的高度** 0.53

12 背与椅子靠背接触点的高度 0.5

13 大转子骨的高度 0.48

14 **洗脸台的高度** 0.45

15 **办公用书桌的高度**（不含鞋物） 0.41

16 使用梯子时的空间（最小值，倾斜度 80°~90°） 0.4

16 **易于使用的架子的高度（下限）** 0.4

17 **手提物品的长度（最大值）** 0.37

18 书桌下方的空间（高的最小值） 0.34

18 小便器的高 0.34

19 **办公用椅子的高** 0.23

20 **轻度作业用椅子的高** 0.21

21 **小憩时用椅子的高** 0.19

22 差尺 0.18

23 **休息时用椅子的高** 0.165

24 **扶手的高** 0.155

25 **作业用椅子的椅面与靠背点的距离** 0.145

## 参考资料

- 建筑设计资料集成：人体、空间篇
- [人因工程学 - Wikiwand](https://www.wikiwand.com/zh-hans/%E4%BA%BA%E5%9B%A0%E5%B7%A5%E7%A8%8B%E5%AD%A6)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.010 - 人体站立和坐姿尺寸]]></title>
            <link>https://tophci.com/posts/200114-design-diary-010</link>
            <guid isPermaLink="true">https://tophci.com/posts/200114-design-diary-010</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[人体]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[人体工程学]]></category>
            <category><![CDATA[建筑]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 13 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
[上一篇日课](https://www.uegeek.com/200112-design-diary-009.html)我们划重点了几个重要的人体尺寸：眼高 1450-1580mm，肩宽 400-450mm，坐面高 350-410mm。今天继续来看人体站立和坐下时的一些具体尺寸。

除了标注全面、详细的人体尺寸数据，下面两张图还是优秀的信息图表设计典范，在有限的版面内承载的信息密度很高，值得细细品读。例如，如何显示不同年龄段、不同性别的数据？如何映射属性和数据关系？如何省略数据区间？

下图是人体站姿时的尺寸值：

![V010-人体立体尺寸](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V010-%E4%BA%BA%E4%BD%93%E7%AB%8B%E4%BD%93%E5%B0%BA%E5%AF%B8.jpg)

- 眼高与身高有密切关系。成年人的眼高一般为身高减去 110-120mm；
- 考虑站姿作业时置物台等高度，要以肘头高为标尺，但还需要考虑鞋子高度；
- 肘头高与重心高接近
- 上肢自然上举时指尖能达到的最大高度约为人体身高的 1.3 倍

下图是椅子坐姿的人体测量。

- 坐姿眼高在 1100-1200mm 之间
- 坐面高在 400mm 左右
- 坐姿肘高在 650-700mm 之间

![V010-椅子坐姿尺寸](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V010-%E6%A4%85%E5%AD%90%E5%9D%90%E5%A7%BF%E5%B0%BA%E5%AF%B8.jpg)

## 参考资料

- 建筑设计资料集成：人体、空间篇
- [人因工程学 - Wikiwand](https://www.wikiwand.com/zh-hans/%E4%BA%BA%E5%9B%A0%E5%B7%A5%E7%A8%8B%E5%AD%A6)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.009 - 一些重要的人体测定值]]></title>
            <link>https://tophci.com/posts/200112-design-diary-009</link>
            <guid isPermaLink="true">https://tophci.com/posts/200112-design-diary-009</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[人体]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[人体工程学]]></category>
            <category><![CDATA[建筑]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 11 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
做设计，尤其是空间和实体产品的设计，一定离不开人的尺度。从某种程度来说，设计就是一种将事物改造为适应人的尺度的活动。

日本人类生活工程学研究中心曾公布了详细的日本人人体测定数据，测量对象包括小学生和高龄者共约 34000 名男女，其中有 21 项与建筑方面紧密相关的尺寸。

![V009-人体测定部位](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V009-%E4%BA%BA%E4%BD%93%E6%B5%8B%E5%AE%9A%E9%83%A8%E4%BD%8D.png)

其中有几项尤其值得注意：

- 眼高：决定了站立时视线的高度。成年人大约在 1450-1580mm 之间，老人和儿童则要相应降低。在设计信息内容时，尤其是公共空间的指示、展览内容、标志等尤其需要注意
- 肩宽：决定了通道需要留出的宽度。成年人肩宽一般在 400-450mm 之间。所以人行通道应以至少按 500mm/人 预留，考虑到提拿物品、多人并行、推车、轮椅、搀扶等场景，应留有更加充裕的宽度
- 坐面高：为座椅设计提供参考。成年人坐面高一般在 350-410mm 之间，老人和儿童相应降低
- 举上肢时上指尖高：伸直手臂时可够到的高度。成年人一般为 1900-2100 mm 之间

![V009-人体测定值](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V009-%E4%BA%BA%E4%BD%93%E6%B5%8B%E5%AE%9A%E5%80%BC.png)

## 参考资料

- 建筑设计资料集成：人体、空间篇
- [人因工程学 - Wikiwand](https://www.wikiwand.com/zh-hans/%E4%BA%BA%E5%9B%A0%E5%B7%A5%E7%A8%8B%E5%AD%A6)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[适老化改造套内空间设计 - 卫生间篇]]></title>
            <link>https://tophci.com/posts/200111-aging-in-place-toilet</link>
            <guid isPermaLink="true">https://tophci.com/posts/200111-aging-in-place-toilet</guid>
            <category><![CDATA[适老化]]></category>
            <category><![CDATA[Aging in place]]></category>
            <category><![CDATA[养老]]></category>
            <category><![CDATA[老年住宅]]></category>
            <category><![CDATA[无障碍设计]]></category>
            <category><![CDATA[通用设计]]></category>
            <category><![CDATA[室内设计]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[Bathroom]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 10 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
随着老年人身体机能下降，使用厕所会变得频繁，而浴室同时也是一个容易摔倒或发生溺水事故的空间。卫生间虽然空间不大，但是设备较多，对通风、采光、防滑、保暖等要求也较高，在适老化设计中，是需要重点考虑的空间。

## 设计要点

| 布局规划 | 以老年人需求特点出发，强调安全舒适                                       |
| -------- | ------------------------------------------------------------------------ |
| 平面规划 | 距离老年人卧室不宜过远，确保轮椅进出方便，确保较大面积以备日后的护理需要 |
| 立面规划 | 尽量避免垂直高差，包括湿分离的区隔                                       |

设计原则

&gt; 空间大小适当，布局可灵活调整
&gt;
&gt; 划分干湿区域
&gt;
&gt; 重视安全防护
&gt;
&gt; 保证坐姿操作
&gt;
&gt; 注意通风和保暖

### 整体

卫生间布局俯瞰图：

![2-适老化-卫生间-俯瞰](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%AB%E7%94%9F%E9%97%B4-%E4%BF%AF%E7%9E%B0.jpg)

- 配置坐便器、洗浴器、洗面器三件卫生洁具，卫生间使用面积不应小于 3.0m²，并应满足轮椅使用
- 划分干湿区域，减少因湿滑摔倒的可能
- 卫生间尽量临近老年人卧室
- 地面应采用防滑、易清洁的材料，墙面应采用身体刮蹭之后也不易受伤的材料
- 门窗隔扇应开闭方便，并考虑安全性

### 洗手池

00 对盥洗区域做了适老化设计，下面是渲染结果：

![3-适老化-卫生间-盥洗](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%AB%E7%94%9F%E9%97%B4-%E7%9B%A5%E6%B4%97.jpg)

- 采用浅水池，洗手盆下部留空，净高不小于 650mm，净深不宜小于 300mm，前沿可设置扶手，便于轮椅坐姿洗漱
- 洗手池周边留出充足台面，减少从高处取放物品的必要
- 就近设置毛巾钩，避免手上的水滴到地上造成湿滑
- 洗手盆旁应设置防水插座，方便使用电吹风等小家电
- 为保证坐姿照镜子方便，镜子下沿不宜过高，距台面 150-200mm、距地面 1100-1200mm 为宜
- 设置镜柜，增加储物空间

### 洗浴区

00 对洗浴区做了适老化设计，下面是渲染结果：

![4-适老化-卫生间-淋浴区](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%AB%E7%94%9F%E9%97%B4-%E6%B7%8B%E6%B5%B4%E5%8C%BA.jpg)

- 墙面若设置 L 型扶手，横向扶手距地面 700mm，纵向扶手顶端距地面不小于 1400mm
- 淋浴喷头高度可调节，满足坐姿和站姿时的淋浴需求
- 设置浴帘而不是玻璃淋浴间，既能防止水流外溅，又不影响护理人员辅助操作
- 淋浴间应有淋浴凳
- 地漏位置宜设在淋浴区域里侧角落，使积水向里侧排放
- 应设加热器和排风扇，开关最好能在如厕或洗浴时均能控制调节，并避免水溅
- 建议在淋浴区外侧设置强度高、重量轻、易清理的截水篦子，防止积水外溢带来隐患

### 坐便器

![5-适老化-卫生间-坐便器](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%AB%E7%94%9F%E9%97%B4-%E5%9D%90%E4%BE%BF%E5%99%A8.jpg)

- 坐便器高度不应低于 400mm

- 如坐便器墙侧安装 L 型扶手，坐便器中心线距墙面 450mm，扶手垂直段距坐便器前沿 200-250mm，最高点距地面 1400mm 以上，水平段距地面 650-700mm
- 如坐便器临空侧设上翻式扶手，扶手距坐便器中心线水平距离 350-400mm，放下时上层扶手距地面 700mm
- 坐便器上方设置吊柜、置物架等储物空间，存放毛巾、卫生纸、洗涤剂等
- 坐便器后方设置电源插座，智能坐便器操作面板和插座设在常用手那一侧

### 其他

- 设置紧急呼叫器（最好防水），宜设置在坐便器侧前方墙面上，按钮中心距地面 500mm，拉绳下垂末端距地面 100mm
- 设置一定储藏空间，放置卫生纸等用品
- 主灯应有足够的亮度照亮全室
- 设置镜前灯，一般距地面 2000mm 左右，以消除面部阴影，但不宜过于明亮晃眼
- 坐便器上方可加灯照射，帮助检查排泄物

## 参考资料

- GB 50340-2016 老年人居住建筑设计规范

- 周燕珉, 程晓青, 林菊英, &amp; 林婧怡. (2011). 老年住宅

- 财团法人, &amp; 高龄者住宅财团|译者. (2011). 老年住宅设计手册
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.008 - 人体的骨骼和肌肉]]></title>
            <link>https://tophci.com/posts/200111-design-diary-008</link>
            <guid isPermaLink="true">https://tophci.com/posts/200111-design-diary-008</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[人体]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[人体工学]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 10 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BEtitle.jpg)

&lt;!--more--&gt;

做设计，尤其是空间和实体产品的设计，一定离不开人的尺度。从某种程度来说，设计就是一种将事物改造为适应人的尺度的活动。

## 骨骼

人体有长、短、扁平等各种各样大小、形状的骨头 200 多块。这些骨头相互连接形成骨骼。骨骼主要分为头骨、脊椎、肋骨、骨盆等核心骨与形成上下肢的附属骨两个部分。

![](https://upload.wikimedia.org/wikipedia/commons/thumb/f/fd/Human_skeleton_front_zh.svg/640px-Human_skeleton_front_zh.svg.png?1578739069734)

（读音：下颌 xiahe，肱骨 gonggu，桡骨 raogu，骶骨 digu，髌骨 bingu，胫骨 jinggu，腓骨 feigu，跗骨 fugu，跖骨 zhigu）

骨骼作为人体支撑的同时，也担负着作为肌肉附着点的作用。骨头的连接形式可以分为纤维连接（头盖骨等）、软骨连接（椎间盘等）、骨性结合（肩关节、骨关节等）等。皮肤通过纤维组织附着在骨骼上，包绕着骨骼的主要部位。

## 肌肉

人体内有不能按人的意志随意运动的肌肉，叫做不随意肌（平滑肌、心肌等），以及主要附着在骨头上，能够按意志运动的随意肌（横纹肌）。平时我们常说的肌肉一般指骨骼肌也就是随意肌。

![V008-ezgif-2-3da297d98fbe](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V008-ezgif-2-3da297d98fbe.jpg)

肌肉有各种各样的形状，一般呈纺锤形，形成中部粗大两端细小的形状的肌腱附着在骨头上。肌头分叉为两部分甚至三部分，叫做二头肌及三头肌。

肌肉收缩时会带动关节，收缩时利用肌腹而不是肌腱。肌肉收缩产生的最大力量，与构成肌肉的纤维总数成正比。同时，肌肉活动的状态可以用肌电计测出电位差来表示。

## 参考资料

- 建筑设计资料集成：人体、空间篇
- [人體骨架 - Wikiwand](https://www.wikiwand.com/zh/%E4%BA%BA%E9%AB%94%E9%AA%A8%E6%9E%B6)
- [肌肉 - Wikiwand](https://www.wikiwand.com/zh/%E8%82%8C%E8%82%89#/%E5%8F%83%E8%A6%8B)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.007 - 这个装修好在哪？]]></title>
            <link>https://tophci.com/posts/200110-design-diary-007</link>
            <guid isPermaLink="true">https://tophci.com/posts/200110-design-diary-007</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[室内设计]]></category>
            <category><![CDATA[空间设计]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[装修]]></category>
            <category><![CDATA[改造]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 09 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BEtitle.jpg)

&lt;!--more--&gt;

今天的日课 00 打算做个读图练习。更确切的题目应该叫做：装修改造效果看图说话。目的是用实际的设计案例来训练自己的观察、评估能力。因为大脑很善于对比，而且在真实情境中的学习更为有效。

那么，看图说话的时候重点看什么呢？

- 原来空间给人的感受，存在什么问题？
- 对空间做了哪些重要调整？
- 为什么改造后感受好了？
- 值得商榷的地方，还可以如何改进？

刚开始并不需要对案例精心挑选，先走量，以资料获取便利性为主。

案例来源：[Antes/después – Moderna transformación de un apartamento en Taiwan](https://www.delikatissen.com/2018/10/antes-despues-moderna-transformacion-de-un-apartamento-en-taiwan/)。这是一套三室两厅的户型，每个空间改造前后的效果图完整、清晰，很适合用来做案例分析。

## 格局分析

平面图：

![](https://i1.wp.com/www.delikatissen.com/wp-content/2018/09/12-12.jpg?w=800&amp;ssl=1)

分析：格局方正，各房间大小分配适中，空间划分合理。

难点：公共空间/走道较大，餐厅的布置

## 改造要点

### 客厅

玄关角度：

![](https://i1.wp.com/www.delikatissen.com/wp-content/2018/09/2-16.jpg?w=800&amp;ssl=1)

&gt; 原来空间给人的感受，存在什么问题?

优点：宽敞，自然采光良好，格局方正

不足：

- 窗户被分割显得局促，采光范围不够大；
- 角落梁柱不规则，使原本墙面显得不够开敞，而且形成犄角浪费空间；
- 天花显得较低有些压抑；
- 地板材料和踢脚线样式单调老旧；
- 电器老旧，照明不足

&gt; 对空间做了哪些重要调整？

- 合并窗台，扩大采光范围，更加开阔
- 窗台做飘窗设计，整合梁柱的犄角空间，同时兼具收纳功能
- 使用木地板，顺着玄关进门的方向铺设，起到视觉延伸、扩大空间的效果
- 去掉吊扇灯，使用射灯照亮横梁，视觉上提升天花高度
- 家居布局：采用典型的 电视 - L 型沙发 正对布局；电视柜贯通整个墙面，加强了地板视觉延伸的效果；圆形茶几缓和了狭长型格局的棱角感
- 材质风格：地板、家居以木质为主，辅以黑色铁架；织物以麻为主，整体偏向简约、舒适的现代风格
- 颜色运用：白色和木色为主色调，金属框架使用黑色，点缀明度较低的绿、黄色，营造自然的感觉
- 沙发旁边的拐角处增设了书桌，配合不规则墙面和搁板，形成活泼、实用的办公空间，并且与旁边的收纳柜体整合，功能更集中
- 衔接玄关和走道处的梁和凹陷墙体，做封闭处理，减少平面和里面的破碎感

&gt; 为什么改造后感受好了？

- 化零为整：合并利用了犄角空间，隐藏梁柱
- 空间扩大：加强横向视觉延伸，天花尽量简洁，提高垂直高差感
- 敞亮：窗台扩大，照明优化，提升了空间整体开阔感
- 风格和谐：木地板、家居和织物、饰品，搭配色调和材质较统一，营造出简单舒服的自然感觉
- 电器家居风格现代

&gt; 值得商榷的地方，还可以如何改进？

为隐藏天花的梁，玄关走道的天花高度下降，带来一定的压迫感，也许有更好的办法；

客厅三幅挂画稍显单调，改成整幅长条装饰也许更有趣

沙发角度：

![](https://i1.wp.com/www.delikatissen.com/wp-content/2018/09/3-17.jpg?w=800&amp;ssl=1)

窗户角度：

![](https://i1.wp.com/www.delikatissen.com/wp-content/2018/09/4-16.jpg?w=800&amp;ssl=1)

餐厅角度：

![](https://i0.wp.com/www.delikatissen.com/wp-content/2018/09/5-17.jpg?w=800&amp;ssl=1)

### 餐厅

![](https://i0.wp.com/www.delikatissen.com/wp-content/2018/09/6-17.jpg?w=800&amp;ssl=1)

&gt; 原来空间给人的感受，存在什么问题?

- 空间相当奇怪，在多条动线交叉处；
- 走道过于空旷且临门，空间难以利用；
- 采光不足

&gt; 对空间做了哪些重要调整？

- 去掉复杂的灯饰，提高照明亮度，减少天花的压迫感；
- 换了木地板；
- 选择偏方形的餐桌，不阻挡走道动线；

&gt; 为什么改造后感受好了？

- 就亮……亮了很多；
- 木地板颜色较深，天花白色，显得更开阔一些
- 餐桌、吊灯、照片努力营造出餐厅的氛围

&gt; 值得商榷的地方，还可以如何改进？

- 餐厅整体感还是不足，有临时的感觉，可以尝试局部更换地面和墙面材质，达到软分区的效果
- 餐桌上三盏吊灯形状高度过于接近，且离地高度过高
- 餐桌旁边可增加一些置物、收纳空间
- 厨房一侧墙面总觉得缺了点什么

### 厨房

![](https://i0.wp.com/www.delikatissen.com/wp-content/2018/09/8-17.jpg?w=800&amp;ssl=1)

&gt; 原来空间给人的感受，存在什么问题?

- 墙面和地板陈旧不耐脏；
- 一字型动线，橱柜显得有点笨重；
- 蓝色墙面与绿色柜面不太和谐；
- 光线不够

&gt; 对空间做了哪些重要调整？

- 做了吊顶，橱柜感觉延伸到顶，减少割裂感；
- 统一地板和地柜材质；
- 补充局部照明；
- 更换风格更统一的耐污墙面

&gt; 为什么改造后感受好了？

- 亮……亮了很多；
- 地面和地柜颜色较深，天花和吊柜颜色浅，视觉往上延伸，提高垂直感

&gt; 值得商榷的地方，还可以如何改进？

- 应该是预算不足，门和墙砖都没有更换；
- 地面耐污性应加强；
- 左侧的开敞柜体可改为架空，用收纳器具替代搁板，更加美观、灵活

### 卧室

![](https://i2.wp.com/www.delikatissen.com/wp-content/2018/09/9-16.jpg?w=631&amp;ssl=1)

&gt; 原来空间给人的感受，存在什么问题?

采光不错，格局较方正；梁柱突出

&gt; 对空间做了哪些重要调整？

- 利用柱体区隔出台面，整合功能空间；
- 用吊柜隐藏梁柱，视觉平整、功能增加；
- 结合吊柜和床头，切割出背景和台面，既实用又添加了活泼的感觉

&gt; 为什么改造后感受好了？

- 木地板更符合卧室温馨、居家的感觉
- 配色统一：蓝色墙面和点缀也符合卧室所需要的安宁氛围

&gt; 值得商榷的地方，还可以如何改进？

- 缺少衣柜？
- 使用的台面较少，不便于日常使用；
- 临窗区域可以换颜色，既区分功能，又增加层次感

### 卫生间

主卧卫生间

![](https://i0.wp.com/www.delikatissen.com/wp-content/2018/09/10-16.jpg?w=800&amp;ssl=1)

公共卫生间：

![](https://i2.wp.com/www.delikatissen.com/wp-content/2018/09/11-14.jpg?w=800&amp;ssl=1)

&gt; 原来空间给人的感受，存在什么问题?

- 空间狭小，门很碍事；
- 泛黄、老旧，单调、局促；
- 没有做干湿分离

&gt; 对空间做了哪些重要调整？

- 更换木门为玻璃门；
- 更换浅色墙砖、地砖，提高整体明亮、清洁的感觉；
- 用玻璃做简易干湿分离，增加小空间的通透感；
- 更换浴柜、洗手盆和其他用具，增加收纳功能；
- 公共卫生间改为淋浴，增加浴柜和镜柜

&gt; 为什么改造后感受好了？

- 翻新，用现代的、品质更好的设备和材料；
- 统一色调，只有少量的金色、黄色、黑色、绿色点缀；
- 使用有设计感的器具（镜子、毛巾架）提升品质；
- 增加吊灯、绿植、摆设，营造生活情趣

&gt; 值得商榷的地方，还可以如何改进？

- 镜子高度可能过高
- 马桶旁边可增设置物架
</content:encoded>
        </item>
        <item>
            <title><![CDATA[适老化改造套内空间设计 - 卧室篇]]></title>
            <link>https://tophci.com/posts/200108-aging-in-place-bedroom</link>
            <guid isPermaLink="true">https://tophci.com/posts/200108-aging-in-place-bedroom</guid>
            <category><![CDATA[适老化]]></category>
            <category><![CDATA[Aging in place]]></category>
            <category><![CDATA[养老]]></category>
            <category><![CDATA[老年住宅]]></category>
            <category><![CDATA[无障碍设计]]></category>
            <category><![CDATA[通用设计]]></category>
            <category><![CDATA[室内设计]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[Bedroom]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 07 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
卧室是老年人生活和休息的主要场所，对于需要护理的老人来说，停留时间更长，也伴随多种特殊需求。空间设计首先要考虑安全性和舒适度，例如采光、通风、隔音等。另外，还需要考虑睡眠中可能发生健康状况的急剧变化，做好应对准备。

00 对卧室做了简单的适老化设计：

![1-适老化-卧室-床视角-1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%A7%E5%AE%A4-%E5%BA%8A%E8%A7%86%E8%A7%92-1.jpg)

## 常见活动分析

老年人卧室应基本满足以下日常活动：

- 睡眠：最好有阳光照射，避开凉风，床边有通行、整理和置物空间
- 收纳、整理：储藏衣物、被褥和其他用品，方便拿取，要留出操作空间
- 阅读或其他休闲活动：靠近采光窗，空间完整、集中，有充足的置物台面
- 通行：预留轮椅通行空间，并留出使用家具的操作空间
- 接受护理（失能失智老人）

## 设计要点

布局规划

- 考虑采光、通风、隔音等问题
- 预留轮椅通道，通往户外动线布局不宜过长
- 为日后护理预留较宽敞的空间

设计要点

&gt; 安全第一
&gt;
&gt; 合理功能布局
&gt;
&gt; 注重空间舒适感
&gt;
&gt; 考虑家具布置细节

### 安全第一

- 卧室进门处不宜有狭窄拐角，以免急救时担架出入不便
- 床头应设紧急呼叫器，保证老人躺在床上伸手可及
- 门窗隔扇应开闭方便，并考虑安全性
- 预留扶手位置，以邻接主要动线的墙面为宜，扶手高度一般距地面 700~900mm
- 尽可能设置火灾报警器等设备

### 合理功能布局

![2-适老化-卧室-坐视角-1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%A7%E5%AE%A4-%E5%9D%90%E8%A7%86%E8%A7%92-1.jpg)

- 老人卧室面宽一般为 3600mm 以上，进深应比一般卧室略大（单人大于 3600mm，双人大于 4200mm），为轮椅转圈留出足够空间
- 床与对面家具之间的距离大于 800mm，以便轮椅通过
- 老人宜分床或分房休息，避免相互干扰
- 门后墙面留有一定空间设置挂钩，方便挂衣帽等物品
- 衣柜不应阻挡光线和进门视线，前方应设有足够的取衣置物空间，通常不小于 600mm
- 在不费力就能拿取的位置，一般距地面 400~1500mm，设置充裕的收纳空间

### 注重空间舒适感

![](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%A7%E5%AE%A4-%E5%BA%8A%E5%92%8C%E7%94%B5%E8%A7%86.jpg)

- 注重通风和采光的要求，特别是在老人长期卧床时
- 合理选择朝向，尽量引入阳光，并且可以调节进光量
- 有条件可设置阳光角、落地凸窗，便于在卧室中晒太阳

- 主灯开关设在卧室门开启侧的墙面上，位置应明显
- 卧室主灯宜设双控开关，其中一处靠近床头，方便在床上开闭
- 卧室整体照明照度应较高（40 lx），保证老人晚间活动安全，宜选用吸顶灯安全灯泡
- 空调不宜直接吹向床头及座位
- 尽可能考虑隔音性能，远离电梯井、空调室外机等设备

### 考虑家具布置细节

- 卧室中电视屏幕高度，应保证老人在卧姿时观看电视也较为舒适

  ![5-适老化-卧室-床和电视](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-%E9%80%82%E8%80%81%E5%8C%96-%E5%8D%A7%E5%AE%A4-%E5%BA%8A%E5%92%8C%E7%94%B5%E8%A7%86.jpg)

- 卧室内有衣帽挂钩，方便放置衣物
- 床头柜宜略高一些（600mm 左右，方便撑扶），可设置明格或抽屉，便于识别、翻找物品
- 床边的书桌、床头柜最好有较大台面，放置水杯、眼镜、药品、台灯等物品
- 插座位于床头柜、桌面之上
- 床头和书桌应设台灯，作为写字阅读的辅助光源（1000 lx）
- 有护理需求时，床最好三边临空放置
- 衣柜挂衣杆高度应小于 1400mm，深度小于 600mm

## 参考资料

- GB 50340-2016 老年人居住建筑设计规范

- 周燕珉, 程晓青, 林菊英, &amp; 林婧怡. (2011). 老年住宅

- 财团法人, &amp; 高龄者住宅财团|译者. (2011). 老年住宅设计手册
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.006 - 设计的经济基础和文化贡献]]></title>
            <link>https://tophci.com/posts/200107-design-diary-006</link>
            <guid isPermaLink="true">https://tophci.com/posts/200107-design-diary-006</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[设计史]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[艺术]]></category>
            <category><![CDATA[文化]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 06 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BEtitle.jpg)

&lt;!--more--&gt;

今天继续读《现代设计史》。在[设计日课 Vol.002 - 设计发展的驱动力](https://www.uegeek.com/200102-design-diary-002.html)中，我们回顾了现代设计发端于 18 世纪的手工艺。设计从艺术和制作中独立出来，得益于需求扩大、多样性增加、专业技术的进步等因素。但其中最重要的，还是整个社会生产力的进步，消费从皇家逐步扩散至民众，也开启了艺术平民化的时代，这是设计对社会文化做出的重要贡献之一。

今天读到现代设计史的第三卷，`艺术、手工艺和机器——工业化：希望与恐惧（1866-1914）`，是从十九世纪后半叶到一战之前的这一段历史时期设计的发展。

随着生产力发展，分工带来专门化，市场体系要求价格更便宜、生产效率更快。对工厂里越来越严重的劳动分工和机械化不人道的一面，英国工艺美术运动致力于发起革新，探索手工艺，以此逃离城市化、工业化的现代世界产生的疏离感。

&gt; 对于最近关于分工的伟大文明创新，我们已经研究了很多，称赞了太多，实际上，被分开的并不是劳动，而是人。人被分割成小小的碎片，挣扎于琐碎的生活；每个人残留的点滴智慧，甚至不足以创造一个大头针，或者一个铁钉，却在制造针尖或者钉帽的过程中耗尽生命。

这是工艺美术运动理论先导者之一约翰·罗斯金的观点。听起来跟 2020 年的今天多少有点相似。人好像总是在生产力革新之后追赶和适应，逐渐找到办法驯化技术，通过各种形式的思潮、革新来让人性回归。

随着工业化的进程，设计从最初的手工艺品、印刷、建筑等扩展的越来越多领域。例如在 19 世界下半叶，美国和欧洲的许多建筑师和纯艺术家逐渐参与到室内设计和装饰中。许多年轻的设计师开始关注可制造性问题，倡导工艺品行业的进步，提升公众品味。

在 19 世纪 80 年代的美国，逐渐采用合理化机械大生产方式，并在全国范围内销售产品，再加上印刷广告和邮购目录，刺激了工业产品和室内陈设品的需求。百货公司的成功始于 19 世纪 60 年代，同样刺激了设计品的生产和销售，越来越以庞大的中产阶级消费者为导向。

历史告诉我们，类似的规律会一次又一次上演。无论是 200 年前的家具设计还是今天的数字产品设计，都有坚实的经济基础。也就是说，如果没有广泛的阶层的消费需求，也就没有相应设计领域的出现和发展。设计再理想化，最初也是应需而生的。如果说艺术提供了设计发展的躯壳和灵魂，那么需求和市场则提供了阳光、空气和水。

设计随着消费品渗透到普通民众的日常生活中，启发和引导着他们的艺术审美和生活品味。生产成为艺术平民化的希望，设计者在其中发挥的作用不可替代。

&gt; 日本人把那些能制造出精美的茶壶、可爱的橱柜、诱人的织物和精致的雕刻饰件的手工艺人，视为比单纯的买主和卖家高一等的人物……一方把他最宝贵的精力用于赚钱之际，另一方却用他的心灵、智慧、感情和技艺，使物品变得高贵起来。——《日本的传统艺术和手工艺》，1882

一战之前的设计革新运动，都相信装饰艺术是审美体验的重要媒介，也是有意义的劳动的产物。工艺美术运动专注于过程，努力减少工匠和他们的产品之间的疏离。唯美主义运动的艺术家认同主观经验，并努力通过装饰艺术作品将其表现出来，他们常通过室内装饰，将对生活的审美态度落到实处。

另一方面是艺术与工业关系的加强，使独立的艺术活动超越了纯艺术领域，提高了公众品味，把产品与生活品质提高、城市环境改善和自我实现的希望连在一起。设计师便是活跃其中的桥梁和翻译者。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.005 - 老板要求每天花式出图100张，怎么办？]]></title>
            <link>https://tophci.com/posts/200106-design-diary-005</link>
            <guid isPermaLink="true">https://tophci.com/posts/200106-design-diary-005</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[职场]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[沟通]]></category>
            <category><![CDATA[需求]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 05 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
今天设计师们被一段聊天记录炸出来了。

![V005-100张图聊天记录](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V005-100%E5%BC%A0%E5%9B%BE%E8%81%8A%E5%A4%A9%E8%AE%B0%E5%BD%95.jpg)

虽然案例极端（也有故意制造话题的可能？）但是本质上是经典的设计需求甲乙方对话。

事情没有发生在自己身上，大家可以表达愤怒，顺便吐槽年关和日渐浓郁的丧气。可是如果自己就是「系真」，怎么办呢？

从整个对话来看，缺少上下文，我们也无法判断双方所指的项目和背景。但是，这段对话跟人际关系，甚至是亲密关系中产生矛盾的模式没有太大区别。事情看似是因为权力较大的一方（老板/甲方）提出无理要求，拿钱办事的一方（设计师/乙方）推脱和反抗，导致双方关系破裂。

## 矛盾的起点和循环

一个看似让人哭笑不得的需求，其实真正的矛盾来自于一个循环：

**第一步，A 提出被情绪包装过的需求**

&gt; 今天出 100 张各种款式的小年图 明天的早年图 50 张 做出来发来群里我们选

A 由于某些事件触发了不满情绪，在提出需求时，没有明确表达自己真正想要什么。

**第二步，B 按照字面理解需求，提出被情绪包装过的方案（抗议）**

&gt; 一天出一百张？我 24 小时不睡觉都做不出那么多

B 没有理解对方真正的诉求，开始对表面上不合理的需求感到恐惧

**第三步，A 驳回方案（抗议），升级需求的合法性，并提出新的要求**

&gt; 接下来每天都是 …… 你们看到了吗？看到了要回复 安排工作都不回复的？

A 认为自己的着急竟然被怠慢了，必需进一步施压

**第四步，B 继续抗议，进一步提出了关系破裂的方案（威胁）**

&gt; 每天上班时间 7 小时，一天一百张，三分钟出一张图？
&gt;
&gt; 王总，您觉得我能力不行，您可以按照合同和劳动法通知我办理离职

下面的对话继续着 “A 升级需求为命令，B 抗议不合理” 的循环。

## 倾听需求

这个死循环的症结在哪里？自然是 A 跟 B 共同开启的循环了。

作为设计师的我们，需要在每一次被虐之后，意识到自己也要承担沟通中 50% 的责任，慢慢修炼真正理解对方真实而没有言说出来的需求的能力。

比如，王总的焦虑已经溢出屏幕了，可能是因为小年图承载了重要的转化指标，可能是之前的图被大老板骂了，甚至可能是大老板要求她每天出 50 张，于是一个激动就 double 成了 100 张……

这时候设计师听到 100 张，如果只按字面意思去理解和执行，当然就崩溃了。可怜的王总等待的无非是：

- 对设计结果有很高的期待
- 要求很多的设计方案
- 让大家一起挑选和决策

## 化解需求

王总抛了第一轮的烟雾弹，下面轮到设计师了。你是选择双倍烟雾弹，还是空气清新剂？

我们一个一个诉求来看：

**对设计结果有很高的期待**——为什么？项目背景有什么变化吗？有指标呢？具体的期待是什么？压力和限制又有哪些？设计师可以根据自己掌握的背景信息进一步提问：

&gt; 王总我收到您的需求了。感觉您挺着急的，不知道是不是项目有了什么变化？有没有我需要进一步了解的信息呢？

**要求很多的设计方案**——为什么？是觉得之前对设计参与得不够，还是不满意之前的方案太雷同，还是觉得多出方案能明显提高质量？设计师可以尝试继续询问：

&gt; 王总，您是希望多出方案，这样做出满意的设计可能性更大对吗？我其实也想在前期多听听您的意见。如果用三个关键词来概括小年图的风格，您觉得会是哪些？或者图片参考也行，我根据这些多出一些不同的方案。

**让大家一起挑选和决策**——为什么？群里都有哪些人？决策过程是怎样的？有更高效的决策方式吗？设计师可以怎样引导？

&gt; 王总，我明天早上会拿出一批方案，先找熟悉项目的 xx 一起挑出比较满意的，然后跟您当面讨论，收敛一下方向我再着力修改最佳方案，这样会更加高效，下午我们应该就能确定最终设计了。

当然，过程中王总可能还会有其他的问题，这取决于双方的关系和如何解读对方的言行。

也不完全排除老板就是看你不顺眼（不过看到对话中提离职时，老板没有接话，就知道这不是老板真正的目的了），那就更不妨先做实验，先出 10 张图，但是是跟过去的过程或效果不太一样的图，看看老板什么反应。如果老板连 10 张图看都不看，继续揪着还差 90 张没给，那就拜拜好了。

另一方面，身为需求方，如果不想对方动不动找借口和提离职，或者每天上班要先看 100 张设计稿看到中午也定不下来到底哪一张好然后回到第一版，也需要尽可能在一开始清楚表达自己的要求，例如

&gt; 年底的活跃指标就指望小年图和早年图了，大家要尽力冲刺啊！我提一下具体的要求，大家看看怎么一起配合，有没有更好的做法：
&gt;
&gt; 1.小年图更加符合年轻人审美，考虑加入一些流行元素；2.文案要优化，学习 xx 公司最近做的 xx；3.做三个不同方向的尝试，你们可以合计合计，尽量在概念和风格上区别大一些。
&gt;
&gt; 明早要给到三个方向不同的设计，每个方向要不止一个版本。今天早上先把大的概念方向和文案要点确定下来，我们下午花 15 分钟对一下。
&gt;
&gt; 大家有什么需要进一步了解的吗？

这样的沟通真的好累。不过想想可以不用每天早上都看 100 张差不多的图，还是值得的吧！

😇

沟通不易，生存要紧，理解万岁。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[适老化改造套内空间设计 - 客厅/起居室篇]]></title>
            <link>https://tophci.com/posts/200105-aging-in-place-livingroom</link>
            <guid isPermaLink="true">https://tophci.com/posts/200105-aging-in-place-livingroom</guid>
            <category><![CDATA[适老化]]></category>
            <category><![CDATA[Aging in place]]></category>
            <category><![CDATA[养老]]></category>
            <category><![CDATA[老年住宅]]></category>
            <category><![CDATA[无障碍设计]]></category>
            <category><![CDATA[通用设计]]></category>
            <category><![CDATA[室内设计]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[客厅]]></category>
            <category><![CDATA[Living room]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 04 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
起居室是老年人日常活动的主要场所，也是一般住宅中的核心空间。这个空间需要承载包括聊天、会客、看电视、休闲娱乐等多种功能，是老年人日常生活中停留时间最长的地方之一。在设计时，应该充分考虑老年人的身心特点和需求，促进与家人和外界环境之间的交流。

00 对客厅做了适老化设计，下面是建模和渲染结果：

![1-适老化-客厅-收纳](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-%E9%80%82%E8%80%81%E5%8C%96-%E5%AE%A2%E5%8E%85-%E6%94%B6%E7%BA%B3.jpg)

## 设计要点

| 布局规划 | 安全、舒适，方便日常活动                                     |
| -------- | ------------------------------------------------------------ |
| 平面规划 | 距离老年人房间、卫生间不宜过远，确保一个能停放轮椅的宽裕空间 |
| 立面规划 | 尽量避免垂直高差                                             |

![](http://img.viz.mobi/%E9%80%82%E8%80%81%E5%8C%96-%E5%AE%A2%E5%8E%85-%E5%B8%83%E5%B1%80.jpg)

设计要点

&gt; **设计合适的空间尺度**
&gt;
&gt; **保证安全**
&gt;
&gt; **方便日常活动**
&gt;
&gt; **根据需要选择和布置家具**

### 1.设计合适的空间尺度

![](http://img.viz.mobi/%E9%80%82%E8%80%81%E5%8C%96-%E5%AE%A2%E5%8E%85-%E5%B0%BA%E5%AF%B8.jpg)

- 起居室过小会阻碍行动，过大则会妨碍沟通
- 一般老年住宅中的起居室开间为 3300~4500mm，进深不宜小于 3600mm
- 开间与进深比例以 1:1~1:1.2 为宜

### 2.保证安全

- 起居室与阳台地面交接处不宜留有高差
- 地面材质应防滑、耐磨、易清洁
- 门窗面积要大，保证良好的采光与通风
- 起居室位于中部，尽量减少主要动线穿越，以免频繁打扰和形成危险

![](https://pic3.zhimg.com/80/v2-669365e66aa9e658ffa2761b3c3e07ba_hd.jpg)

![](https://pic4.zhimg.com/80/v2-088ce6a3c21025ad3e97123f0f80b06b_hd.jpg)

### 3.方便日常活动

- 可设置老人或轮椅专座，位置在方便进出的地方，能获得阳光处更佳
- 家具间的距离应大于 800mm，保证轮椅通过
- 空调送风方向不应直接对着沙发区域
- 提供一定的收纳空间，不费力就能拿取
- 老年人视力下降时，起居室照明亮度宜 100 lx 以上，餐厅 150 lx，饭桌 700 lx
- 根据需要增设局部照明，方便看报、打电话、进行娱乐活动等

### 4.根据需要选择和布置家具

![](http://img.viz.mobi/%E9%80%82%E8%80%81%E5%8C%96-%E5%AE%A2%E5%8E%85-%E7%BA%BF%E7%A8%BF.jpg)

- 沙发两侧应有结实的扶手，便于坐下起身时撑扶
- 茶几应略高于沙发，方便不起身就能取放物品
- 沙发和茶几旁设有插座，方便使用台灯、充电器、电话等
- 茶几与沙发之间距离应大于 300mm，便于通行
- 茶几等家具尽量轻巧、可组合，方便移动和布置
- 电视柜宜正对沙发，电视与沙发距离为 2000~3000mm，注意避免眩光看不清电视屏幕
- 电视等家电插座宜略高于电视柜台面，方便插座

![](https://pic1.zhimg.com/80/v2-9d6452a1943fa3c6a8e3cd4b491cd7d4_hd.jpg)

## 参考资料

- GB 50340-2016 老年人居住建筑设计规范
- 周燕珉, 程晓青, 林菊英, &amp; 林婧怡. (2011). 老年住宅
- 财团法人, &amp; 高龄者住宅财团|译者. (2011). 老年住宅设计手册
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.004 - 好设计的关系框架和时空框架]]></title>
            <link>https://tophci.com/posts/200105-design-diary-004</link>
            <guid isPermaLink="true">https://tophci.com/posts/200105-design-diary-004</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[设计原则]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[Dieter Rams]]></category>
            <category><![CDATA[Guideline]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 04 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
继续[上一期设计日课 ](https://www.uegeek.com/200103-design-diary-003.html)的话题。

上一期文章发出来以后，收到了 Oliver Ding 老师发来的讨论。

丁老师用多语言融合的方法来构建符号化表达，提出了一个很有意思的图示：

![V004-OliverDing三口成品](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V004-OliverDing%E4%B8%89%E5%8F%A3%E6%88%90%E5%93%81.jpg)

第一人称、第二人称、第三人称的视角代表着客观取向、主观取向与交互取向。

基于这个框架，丁老师从「设计三味」出发，回应我的问题「这是好设计吗？」，提出有三种视角的「好」的思考脉络：

- 客观视角：规范、影响、评价
- 主观视角：体验、感受、情绪
- 互动生态视角：可供性

这个思考脉络给我很大启发，特别感谢丁老师。

## 设计评价的「关系」框架

上一期的讨论把问题拆开来，不免显得复杂：

- 这个设计的对象是谁？这些人可以再分成不同类别吗？我了解都包括哪些人吗？
- 这个设计最初目的是什么？是否达成了呢？设计者会如何衡量？
- 这个设计在空间上会影响到哪些人？如何影响？影响会如何变化？
- 这个设计在时间上会影响到哪些人？如何影响？影响会如何变化？
- 不同人会如何评价它，为什么？这些评价应该如何对待？
- 除了「好」跟「不好」，我们更需要回答「哪里好」和「有多好」，以及，「在什么前提」下是好的

丁老师的框架给出了收敛的评价维度。

评判设计优劣最常见的几种方式，包括个人偏好、设计规范、功能属性等，可以归入到「我视角」、「你视角」、「他视角」中，提出相应的评价要点：

![V004好设计的关系框架](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V004%E5%A5%BD%E8%AE%BE%E8%AE%A1%E7%9A%84%E5%85%B3%E7%B3%BB%E6%A1%86%E6%9E%B6.jpg)

有了这个关系框架，我们就容易从完全主观的「喜欢」、「丑」、「美」、「好」更进一步，拓展到他人的视角、群体的视角，看到一个设计的影响。

## 设计评价的「时空」框架

类似的，从设计对人的影响时间尺度来看，我们也可以划分出一条比较清晰的线索：

| 层次     | 时间跨度      | 维度                   |
| -------- | ------------- | ---------------------- |
| 认知级别 | &lt;1 秒         | 形态、感知、情绪、体验 |
| 行为级别 | 1 秒~天/月/年 | 行为、目标、功能       |
| 文化级别 | 持久          | 观念、文化、影响力     |

既然有时间尺度，当然还可以以空间为尺度：

| 层次         | 空间范围         | 维度             |
| ------------ | ---------------- | ---------------- |
| 设计客体本身 | 设计本身         | 点线面等构成元素 |
| 受众         | 设计的利益相关者 | 对个体产生的影响 |
| 广域         | 群体、民族       | 对群体产生的影响 |

把时空结合到一起，形成一个更完整的评价维度：

![V004好设计的时空框架](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/V004%E5%A5%BD%E8%AE%BE%E8%AE%A1%E7%9A%84%E6%97%B6%E7%A9%BA%E6%A1%86%E6%9E%B6.jpg)

时空框架告诉我们，人是希望不朽的，设计也是 😂

这样看来，建筑设计师、游戏设计师们可能分别在时间、空间维度（而不是反过来）能收获更多的好评和成就感，而信息相关的设计可能将沿着这条轨道演进：字体设计 → 平面/装帧设计 → 可视化/交互设计 → 影视和游戏设计 → 虚拟现实设计 → 脑机接口设计……😳

本质上，设计也是一种模因。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[适老化改造套内空间设计 - 门厅篇]]></title>
            <link>https://tophci.com/posts/200104-aging-in-place-doorway</link>
            <guid isPermaLink="true">https://tophci.com/posts/200104-aging-in-place-doorway</guid>
            <category><![CDATA[适老化]]></category>
            <category><![CDATA[Aging in place]]></category>
            <category><![CDATA[养老]]></category>
            <category><![CDATA[老年住宅]]></category>
            <category><![CDATA[无障碍设计]]></category>
            <category><![CDATA[通用设计]]></category>
            <category><![CDATA[室内设计]]></category>
            <category><![CDATA[Design]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 03 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
门厅作为连接家和外界的空间，虽然面积不大，但是使用频繁。老年人随着年龄增大，身体机能逐渐下降，为保证方便外出，顺畅、安全，在门厅设计时有不少细节应该考虑周到。

00 对门厅做了适老化设计，下面是建模和渲染结果：

![适老化-门厅_适老化-门厅效果图x0.5](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85_%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85%E6%95%88%E6%9E%9C%E5%9B%BEx0.5.jpg)

## 常见活动分析

老年人进门的一般活动流程包括：

&gt; 1.拿出钥匙开门 → 2.开灯 → 3.放下手中物品 → 4.脱挂外衣
&gt;
&gt; → 5.坐下 → 6.探身取鞋，换鞋，放鞋 → 7.站起

![2-适老化-门厅-动线](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85-%E5%8A%A8%E7%BA%BF.jpg)

- 换鞋：需要鞋柜，座位
- 穿衣：需要挂钩
- 开门，关门：把手易识别、易抓握，有照明
- 开灯，关灯：开关位置方便，操作容易
- 放拐杖、雨伞、包等物品：有置物空间
- 轮椅进出：预留尺寸，保持进出通畅

## 设计要点

| 布局规划 | 方便进出                                         |
| -------- | ------------------------------------------------ |
| 平面规划 | 避免动线过长，特别是距离老年人经常使用的空间太远 |
| 立面规划 | 尽量避免户内外垂直高差                           |

设计要点

&gt; **出入通畅、安全**
&gt;
&gt; **保证视线和光照**
&gt;
&gt; **方便穿衣换鞋**
&gt;
&gt; **功能齐全**

### 1. 出入通畅、安全

![4-适老化-门厅-门宽](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4-%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85-%E9%97%A8%E5%AE%BD.jpg)

- 户门不应设置门槛，室内外垂直高差不应大于 15mm
- 户门洞口宽度不小于 1000mm，高度不小于 2000mm
- 户门应采用平开门，采用横杆式把手
- 户门拉手侧应保证有 400mm 以上空间，方便轮椅接近门口
- 避免通道狭长、曲折，应留出急救时担架出入所需的空间
- 地面应采用防滑、耐污材料，易于清理
- 鞋柜单扇柜门宽度不宜大于 350mm，打开后不应影响门厅内人的动作
- 除了基本进出，还要考虑接待来客的必要空间和护理人员的活动空间

### 2. 保证视线和光照

- 门厅宜开门见山，减少屏障和光线遮挡
- 门厅内应设有照明，如有自然采光更佳
- 灯具开关应设在进门方便操作的位置，距地面 1200mm
- 户门应该有高低两个观察孔，低位观察孔便于轮椅老人使用
- 方便老人坐在起居沙发上了解门厅的进出状况

### 3. 方便穿衣换鞋

![5-适老化-门厅-家具](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85-%E5%AE%B6%E5%85%B7.jpg)

- 有充裕的空间换鞋换衣
- 门厅中的鞋柜、鞋凳应靠近布置，便于取放鞋子
- 鞋柜宜在 850mm 高度处设有台面，既可以放置小物品，又可作为扶手便于撑扶
- 鞋柜下部留出 300mm 左右空档，安排部分开敞的放鞋空间，便于老人换鞋
- 配置结实、稳定、坐面稍宽大的鞋凳，长度宜大于 450mm，方便换鞋和放置随身物品
- 鞋凳旁宜设置竖向扶手，上端距地面 1400mm 左右，帮助老人站立起身

### 4. 功能齐全

![6-适老化-门厅-预留功能](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/6-%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85-%E9%A2%84%E7%95%99%E5%8A%9F%E8%83%BD.jpg)

- 门厅内可设置伞立，防止雨水滴湿地面
- 预留提示板位置，提醒出门前需要做的事情
- 可预留一处电源插座，供吸尘器等设备使用
- 如空间允许，门厅内宜预留轮椅暂存空间
- 使用轮椅的家中，墙壁上可设 350mm 高的防撞板
- 门厅可设穿衣镜，为防止轮椅碰撞，穿衣镜下沿应高于地面 350mm 以上

适老化门厅俯瞰图：

![7-适老化-门厅_适老化-门厅效果图-俯瞰](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/7-%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85_%E9%80%82%E8%80%81%E5%8C%96-%E9%97%A8%E5%8E%85%E6%95%88%E6%9E%9C%E5%9B%BE-%E4%BF%AF%E7%9E%B0.jpg)

家人年纪大了，居家环境如果及时做出相应的调整和改造，能为他们提供更好的生活、保健环境。

## 参考资料

- GB 50340-2016 老年人居住建筑设计规范

- 周燕珉, 程晓青, 林菊英, &amp; 林婧怡. (2011). 老年住宅

- 财团法人, &amp; 高龄者住宅财团|译者. (2011). 老年住宅设计手册
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.003 - 这是好设计吗？]]></title>
            <link>https://tophci.com/posts/200103-design-diary-003</link>
            <guid isPermaLink="true">https://tophci.com/posts/200103-design-diary-003</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[设计原则]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[Dieter Rams]]></category>
            <category><![CDATA[Guideline]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Thu, 02 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BEvol003.jpg)

&lt;!--more--&gt;

在设计师漫长的自我成长道路上，有一个十分要紧的问题：

&gt; 这是一个好设计吗？

这个问题关乎设计师的价值取向、审美品位，也是自我训练过程中需要反复回答的问题。

对比起艺术家，设计师面对这个问题，压力相对较小。设计当然也有很主观的部分，但它也是一种服务、一门手艺、一项工程，有理性的部分，甚至需要明确的可衡量标准。

## 设计好不好谁说了算？

大部分的设计都是看得见甚至摸得着的（交互设计和服务设计不太可见），任何人都可以张口就评价设计好或不好。同一个设计，可能有一部分的使用者觉得无感，另一些使用者会破口大骂，而设计同行交口称赞，工程师嗤之以鼻——所以，这到底这是不是一个好设计？

一个设计有多个利益相关者，是不是应该给使用者赋予最高权重？毕竟设计是为他们而做的。让我们先来做几个设想：

- 有一款游戏，制作精良，让人秒上瘾欲罢不能，玩家都说好，完全停不下来，玩得倾家荡产。这个是不是好设计？
- 有一幢建筑，花费了数百年才建成，劳民伤财，但是却成为后人的「世界 x 大奇迹」。这个是不是好设计？如果只花一半时间、只死一半的人呢，是好设计吗？如果后来还是默默无闻呢，是好设计吗？
- 有一种社会福利制度，在 A 国多年都运作良好，已经成为民众共识，几乎没有人再去讨论它。而在 B 国则引发了社会动乱。这个是不是好设计？

你大概已经感受到了，评价一个设计「好不好」，是一件特别没有成本，但是也困难重重的事情。

我并不是反对脱口而出去评价一个设计，而是想把这个过程继续往下延伸：

- 这个设计的对象是谁？这些人可以再分成不同类别吗？我了解都包括哪些人吗？
- 这个设计最初目的是什么？是否达成了呢？设计者会如何衡量？
- 这个设计在空间上会影响到哪些人？如何影响？影响会如何变化？
- 这个设计在时间上会影响到哪些人？如何影响？影响会如何变化？
- 不同人会如何评价它，为什么？这些评价应该如何对待？
- 除了「好」跟「不好」，我们更需要回答「哪里好」和「有多好」，以及，「在什么前提」下是好的

## 好设计有通用准则吗？

提出了这么多问题，那设计还有共通的准则吗？设计师到底应该坚持些什么？

当然有，你一定也见过不少。比如 Dieter Rams 的设计十诫：

&gt; Good design:
&gt;
&gt; 1.Is innovative
&gt;
&gt; 2.Makes a product useful
&gt;
&gt; 3.Is aesthetic
&gt;
&gt; 4.Makes a product understandable
&gt;
&gt; 5.Is unobtrusive
&gt;
&gt; 6.Is honest
&gt;
&gt; 7.Is long-lasting
&gt;
&gt; 8.Is thorough down to the last detail
&gt;
&gt; 9.Is environmentally friendly
&gt;
&gt; 10.Involves as little design as possible

这十条准则凝练、优雅，始终贯穿在 Dieter Rams 的设计中，也是无数设计师圣经般的指引。

可是，如果真的用这十条来评价一些经典设计，它们的得分可能会惨不忍睹。比如，Philippe Starck 的榨汁器

[![](https://images-na.ssl-images-amazon.com/images/I/31ecwDspilL.jpg)](https://www.google.com/url?sa=i&amp;source=images&amp;cd=&amp;cad=rja&amp;uact=8&amp;ved=2ahUKEwid2PKumefmAhXIv54KHeY4DbUQjRx6BAgBEAQ&amp;url=https%3A%2F%2Fwww.amazon.co.uk%2FPhilippe-Starck-Juicy-Citrus-Squeezer%2Fdp%2FB01MZ4OHA4&amp;psig=AOvVaw0R4e7fmvD3WxbjhLu6oV-q&amp;ust=1578132821361734)

它真的 understandable 符合直觉易理解吗？真的 unobtrusive 不引人注目吗？真的 environmentally friendly 而不会扎伤人吗？它能在杂乱的厨房台面不被小孩子碰倒，或者轻松被收到已经塞满的抽屉里吗？

这都还是 Dieter Rams 的工业设计同行的作品。如果跳出工业设计、产品设计范围，设计十诫需要作出调整吗？至少是排序的调整？比如，工业设计和服装设计的评价，有共通之处吗？建筑设计和舞台设计，都涉及环境空间的营造，它们有共同准则吗？字体设计和景观设计呢？

我们当然要学习经典的设计准则，但也一定要去思考准则背后的领域、思想和适用范围。

## 设计品位的自我训练

一口气提了不少问题，感觉都把自己困住了。

回到写这篇文章的初衷，作为设计师，判断设计好不好，是一种近乎直觉的训练方法。

我们已经看到，设计评价其实比想象得要复杂，那可以怎么做，来提高设计的品味和能力呢？

### 1. 借助成熟的通用框架

经典的设计原则永远是最好的起点。比如 UX/UI 设计，肯定需要把 Jakob Nielsen 版本的十诫烂熟于心：

- Keep users informed of system status with constant feedback. 随时向用户反馈系统状态
- Set information in a logical, natural order. 按照逻辑的、自然的顺序设置信息
- Ensure users can easily undo/redo actions. 确保用户可以轻松地撤销 / 重做操作
- Maintain consistent standards so users know what to do next without having to learn new toolsets. 保持一致的标准，让用户知道下一步该做什么，而不必学习新的工具集
- Prevent errors if possible; wherever you can’t do this, _warn_ users before they commit to actions.如果可能，请防止错误; 如果您不能这样做，请在用户提交操作之前警告他们
- Don’t make users remember information – keep options, etc. _visible_. 不要让用户记住信息-保留选项等可见
- Make systems flexible so novices and experts can _choose_ to do more or less on them. 使系统灵活，使新手和专家可以选择做或多或少他们
- Design with aesthetics and minimalism in mind – don’t clutter with unnecessary items. 设计时考虑到美学和极简主义——不要把不必要的东西弄得乱七八糟
- Provide plain-language error messages to pinpoint problems and likely solutions. 提供简明的语言错误信息，以查明问题和可能的解决方案
- Offer easy-to-search troubleshooting resources, if needed. 如果需要，提供易于搜索的故障排除资源

除了自己领域的设计准则，设计师最好还能多了解其他设计领域的黄金定律，比如互联网之父 Tim Berners Lee 提出的互联网设计原则 [Principles of Design](https://principles.design/examples/principles-of-design)。然后再跟自己所践行的准则相比较，这样更能引发自己对准则背后本质的思考。

除了领域性的设计准则，还有一些更为通用的评价框架。比如 Don Norman 基于认知心理学提出的理解设计的三个层次：本能，行为，反思。

![](https://public-media.interaction-design.org/images/ux-daily/55f2b953dac3a9fb6e009b288e0b67e2d9be62899f630.gif)

在没有认知心理学的一些背景知识时，会容易把这个框架用得特别狭窄，变成类似注意力漏洞模型之类的。这三个层次其实很适合作为评价设计的三个层次：

- 直觉体验：这个设计给人的直觉感受是什么？这对视觉设计、建筑景观设计等特别强调造型的各种设计门类都很重要
- 对行为的影响：这个设计如何与使用者发生关系？是否达成了设计之初的目的？这对空间设计、产品设计、交互设计、服务设计等特别强调互动关系的设计门类会更重要
- 对观念、文化的长期影响：这个设计对不同群体，产生了包括理念和文化上怎样的持久的影响？

这是一个包含不同时间尺度、兼容多种空间尺度和人类行为认知层次的框架，有助于我们从更多维度和层次来思考设计。

### 2. 用大量经典作品训练直觉

这个方法简单直接得多：收集领域中公认的好作品、经典作品，大量看反复看，建立对「好设计」的直觉。这对新手来说非常必要，也更简单易行。

在走量训练直觉的过程中，刚好可以对照经典的设计准则，看看经典作品是如何体现设计的「好」，以及准则是否需要随着时代和情境而变化。

这里面还可以多关注非常受争议的设计，因为可以获得大量的评述，帮助我们从不同的意见中理解大家都是怎么看待设计和创新的。

### 3. 形成自己的设计价值观

随着设计阅历和能力不断提升，设计师需要慢慢形成自己的设计准则，并且尝试描述出来，而不仅仅是一种直觉和习惯。就像 Dieter Rams 的设计准则，我相信这些准则首先是他写给自己的。

准则和实践作品相互印证和影响，持续演化。从看设计，到做设计，再到讲设计，然后是用设计无声影响他人，这其中离不开日积月累形成的内核，也就是一个设计师到底如何定义设计，认为什么是好设计，如何做出好设计。

终究，「这是好设计吗」的问题，需要大量的时间、敏锐的眼光、丰富的头脑来解答。

与你共勉。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.002 - 设计发展的驱动力]]></title>
            <link>https://tophci.com/posts/200102-design-diary-002</link>
            <guid isPermaLink="true">https://tophci.com/posts/200102-design-diary-002</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[设计史]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[艺术]]></category>
            <category><![CDATA[日课]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 01 Jan 2020 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BEvol002.jpg)

&lt;!--more--&gt;

昨天读了 [David Raizman 的《现代设计史》的前言](https://www.uegeek.com/200101-design-diary-001.html)。今天是对前两卷的记录和思考。

&gt; 第一卷 需求、供给与设计（1700-1800）
&gt;
&gt; 第二卷 扩张和品位（1801-1865）

![](https://img12.360buyimg.com/n1/jfs/t5923/113/1140788378/42612/da515bff/592f804dN444dbc8e.jpg)

俗话说，读史明智。读完这两卷讨论现代设计发端的历史，才发现过去在做设计工作时遇到的很多问题、争议和反思，其实历史上都发生过类似的进程。当时的困顿迷茫，如果能回到历史中寻找脉络，也许思路就能打开，能从更广阔的视角去看待设计活动和设计的从业者，而不再只是纠结于表面的审美争端。

设计从艺术和制作中分离出来，一定跟当时的社会和经济背景有关。生产和消费涉及复杂的因素，包括新技术、营销、传播、商业竞争等，它们共同成为研究现代设计产生的基础。

现代设计史，如何界定现代？这本书以 18 世纪为起点。

18 世纪初，皇家集中了社会上主要的财富和资源。奢侈的手工艺制品从视觉上强化了与艺术相关的社会声望和政治权力，君主通常会直接投资奢侈品的大规模生产。因皇家需求而兴起的产业，开始出现专业分工。不论是纺织品、瓷器、家具、印刷艺术，专业化生产的效率逐渐提高，产品质量却没有滑坡。这有赖于艺术家和手工艺人长期保持健康的合作关系。

同时，政府也承担着赞助和教育的职责，扶持符合官方审美趣味的作品，设计甚至是拿破仑用于体现治国方略的工具。

![](http://img.viz.mobi/V002-%E8%B7%AF%E6%98%93%E5%8D%81%E5%9B%9B%E8%A7%86%E5%AF%9F%E5%93%A5%E7%99%BD%E6%9E%97%E7%BB%87%E9%80%A0%E5%8E%82.jpg)

查尔斯·勒布朗 《路易十四参观哥布林皇家织造厂》，1663-1675

在整个 18 世纪，生产方式和消费模式并行改革。随着社会新阶层的出现，人们对装饰艺术的兴趣日益增长，将之视为精致生活的衍生品、社会身份的标识。地位上升的中产阶级买主，开始体验和享受商品带来的舒适与便利。专业技术和新的尝试，促使生产实践和审美品位同时达到了更高水平。设计传达了来自修养的感受力，增加了各种产品的价值。在这个过程中，设计师逐渐摆脱制作的过程，更多地考虑销售，或者同生产商协议生产他们的设计。

时髦的设计和产品的多样化，同时满足了消费者的心理需求和社会需求，并刺激了商人、生产者和艺术家的商业尝试。日益膨胀的市场反映了更多样化的品味，而不再由皇家倡导的风尚所主导，设计的专业化和变化似乎也反映了民主化的社会进程。

在大批量的生产中，如何保证产品的质量和一致性是关键问题之一。**需求快速增长，生长过程不断变得复杂，让设计有了专业化的必要**，包括如何保证设计向产品的转化，在行业的迫切需求和实践中逐渐变得成熟而且重要起来。

18 世纪后半叶，财富增长和流动加快，消费需求弹性增长，已经突破了地理和社会阶层的界限。生产者和商人推动生产技术和劳动力组织形式发生变化，从而确认了在经济发展过程中设计和销售所起的作用。19 世纪早期，生产加速扩张，商品和家具市场不断扩大，产品风格开始多样化，以适应不同的需求和品味。人们试图为越来越多样化的消费大众提供一个共通的原则。

在一些行业，设计还肩负着社会性的价值。比如 19 世纪早期的印刷业，开始分化出插画师、漫画家、设计师等职业，为日益发展的广告业、新闻业及其他印刷媒介设计出丰富多样的字体、图像，以努力攫取消费者的兴趣和注意力，或向公众舆论施加影响。

![](http://img.viz.mobi/V002-London%20Street%20Scene%20with%20Poster.gif)

约翰·帕里 《伦敦街景》，1835

另一方面，在民主化进程中，设计继续扮演着重要角色。艺术作为一种知识形式，曾经为富人所独占。直到 19 世纪 60 年代，设计改革大都局限于奢侈品市场，局限于迎合这个市场的生产商。而之后，设计随着阶层发展而能够被许多人所共享。设计支持了知识的传播、技术发展、劳动效率技能的提升，从而让更广泛的民众享受到改善后的人类环境。

在生产和设计的扩张中，设计改革者们认为有必要为设计确定一个普遍标准，在大众文化中贯彻执行，这种标准最为合乎越来越多的消费者的经济、社会和道德利益。可是这也往往受到变化的市场需求的冲击，引申出了更有辩证色彩的问题：到底是良好品味更重要，还是满足消费者自己所理解的需求这种民主自由更重要。

![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BE%E5%A4%B4%E5%83%8F.png)

读完历史，不由得感叹互联网行业的设计走过的发展历程，也有不少呼应历史的地方。

资本早期的投入、规模效应产生的影响力和新的商业模式，让行业的分工快速形成，专业化水平不断提高，设计响应新的技术、新的传播渠道、新的消费人群，也开始了快速的迭代。经历了早期的快速发展后，市场和品位日益多元化，为了适应更多样灵活的需求变化，建设设计规范和设计系统变得越来越重要。

设计在这个过程中，也扮演了引导和迎合不同受众需求和审美趣味的角色。设计师既需要真正从人的需求出发，也需要放下自己的一些优越感，去思考专业坚持的审美和形式，如何跟实际的需求和表达去结合。更复杂的是，在自由贸易和自由经济中，消费者购买动机有很多，美与实用的和谐也只是其中之一。

历史告诉我们，在社会变革和社会流动性逐渐加剧的环境中，设计有让待售卖的「信息」和「产品」更吸引人的能力。在不断膨胀的以消费者为主导的经济环境中，设计会扮演不可或缺的角色。所以在流量竞争日趋激烈的今天，设计很多时候都是攫取消费者的兴趣和注意力，或向公众舆论施加影响的直接工具。

不论在 18 世纪现代设计发端的时期，还是进入 2020 年的今天，在任何飞速变革的时代，对于标准的探寻，以及之后在工商业扩张的过程中，对传统价值和权威的侵蚀，都是一种自然趋势。对规则和共性的渴望，对变化和需求的适应，是设计在商业扩张中持续抗衡的两股张力。

历史可能不会告诉我们如何做好手头的设计。但是如何看到更大的图景，在日常工作中感受时代变化的脉搏，应该是每个设计师在设计之外的功课吧。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计日课 Vol.001 - 回到历史寻找设计]]></title>
            <link>https://tophci.com/posts/200101-design-diary-001</link>
            <guid isPermaLink="true">https://tophci.com/posts/200101-design-diary-001</guid>
            <category><![CDATA[设计]]></category>
            <category><![CDATA[设计史]]></category>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[艺术]]></category>
            <category><![CDATA[日课]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 31 Dec 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/%E8%AE%BE%E8%AE%A1%E6%97%A5%E8%AF%BEVol001.jpg)

&lt;!--more--&gt;

新年第一天，开启一个新的栏目——设计日课。

开新坑的初衷是敦促自己持续学习和思考设计，不局限于数字产品的设计，而是把触角伸向各个设计领域：建筑设计、室内设计、环境设计、交互设计、平面设计、工业设计、无障碍设计、导视设计……

设计与体验相关，这是已经被说烂的观点。我想，设计首先与人类生活相关。我们在生活的丰富性中，生出这样那样的需求，等待被满足、被优化，这是设计作为一种职业得以存在的价值前提。

保持对设计的热情和好奇，需要我们首先拥有一颗热爱生活的心和一双永不厌倦的眼睛。也希望这个栏目为自己注入更多观察、体验生活的热情，做一个认真生活的人，也为改善他人的生活质量作出一些微小的贡献。

## 思考设计

新年第一天，重新翻开 David Raizman 的《现代设计史》，想用这种带有仪式感的方式，重启设计师的探寻旅途。

![](https://img12.360buyimg.com/n1/jfs/t5923/113/1140788378/42612/da515bff/592f804dN444dbc8e.jpg)

这本书的前言题目是：思考设计。

作者写作这本著作，是站在世纪之初的时代背景下，去梳理整个现代设计的历史。这是一个产品与技术不断进步的时代，只要涉及附带有审美价值和吸引力的日用品，一定离不开设计。时代周刊 2000 年其中一期的专题故事是「设计的再生」，封面有一行惹眼的文字：Function is out. Form is in. 功能过时了，形式在流行。这也是很多人，不仅是从业者对这个行当的感受。

![](http://img.timeinc.net/time/magazine/archive/covers/2000/1101000320_400.jpg)

但是 David Raizman 接下来的叙述让人感到一丝宽慰：

&gt; 关于设计的社会和文化意义，具有吸引力的形式仅仅是其中一个原因，而且很可能不是最重要的一个。

相比引人注目的形式，设计的经济、社会和政治功能总是掩藏在流变的、追逐流行风尚的表面之下。

几乎绝大多数人是通过日常用品接触到设计的。随着技术和产品的迭代变化，设计也具有了新的意义和功能。但是，设计作为一种活动，本质并没有发生多大变化。

曾获诺贝尔奖和图灵奖的跨领域大师赫伯特·西蒙也曾给设计下过定义：

&gt; 设计就是制定行动方案，使现有的状态朝着更好的方向发展。

这么看来，我们每一个人不仅通过使用物品接触设计，而且我们自己就是设计师——在特定的领域中制定行动方案，推动事物的发展优化，尤其当这种优化所针对的对象是社会中的他人。可见，设计的实践和环境有多么宽泛，这个术语包括形形色色的活动，如绘制装饰草图和字体，发明新的生产工艺，创造软件界面。

## 设计和艺术，设计和工程

设计脱胎于艺术，直到今天仍然很难将两者明确区分开来，这也是所有从事设计的人一开始就会遇到的思考题。

设计也脱胎于制造，这种趋势出现于 18 世纪，设计师为生产者提供模型或图样，而艺术家通常只埋首创作自己的作品。到了 19 世纪，这种区分更为普遍。而区分设计师与工匠的，则看是否直接在材料上工作。进入消费社会后，设计师作为提供产品和服务的生产性群体，更关注满足客户的需求而非自己的，更关注系列产品的生产说明而非独一无二的艺术品。这让设计更加趋向于一种能够解决问题的活动，其结果是可度量的，这使得设计看起来更严肃、更具实际意义，而非一个简单的审美问题。

但是设计和艺术的联结并没有减弱，因为它们都是以**理性**和**创造性**为基础的活动，而非工程性质的技术性和材料性。因此，设计从制作中独立出来，被视为一种受人尊敬的专业活动。

这让人很快联想到设计师总是难以面对自己「美工」的工作现实和身份现实。当设计活动的理性不足、创造性不足的时候，设计师容易进入到「被异化 - 失去创造力 - 异化加剧」的恶性循环中。

## 将设计作为生活态度

生活不会停止，社会进程只会继续加速，设计师没有理由停滞不前。

David Raizman 在前言中总结道：

&gt; 设计揭示了一种与想象、塑造以及对未来的选择有关的知识形态。

无论当下环境如何，设计始终跟未来的理想状态相关，这是这个职业的幸福感之源，也是决定了设计在跨越过去、现在、未来的路途中充满混沌、阻碍和可能性的原因。

好好生活，在设计中体现对生活、对他人的回馈吧！
</content:encoded>
        </item>
        <item>
            <title><![CDATA[作品合集，零反思合集]]></title>
            <link>https://tophci.com/posts/191231-2019-collection</link>
            <guid isPermaLink="true">https://tophci.com/posts/191231-2019-collection</guid>
            <category><![CDATA[2019]]></category>
            <category><![CDATA[作品]]></category>
            <category><![CDATA[零反思]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 30 Dec 2019 16:00:00 GMT</pubDate>
            <content:encoded>
今年是停滞和重建的一年。

对心理、健康、财务、职业开始了全面的清理。教课，读书，看纪录片，做设计。

用一些合集来纪念这安静的一年。

## 一些作品

三维和互动作品集

[DemoReel 2019 by kidult00](https://v.qq.com/x/page/y3016qexdch.html)

阿尔茨海默症科普动画

[脑中的橡皮擦——阿尔茨海默病的预防和干预\_哔哩哔哩 (゜-゜)つロ 干杯~-bilibili](https://www.bilibili.com/video/av70538776)

## 零反思合集

No.63

学会珍惜是求而不得的救赎

No.62

存在（Being）是孩子的游戏，占有（Having）是成人的游戏。所以孩子可以「主宰」世界，而成人不能。

No.61

美是能令神经元集体沉迷的一次谐振

No.60

商业：先（部分地）利他，从而利己

艺术：先超度自己，从而超度他人

技术：放大器，加速器，作弊器

商业是欲求的世界。深刻理解对方的需求并设为起点，暂缓自己的欲望并设为终点，才能找到财富的捷径。艺术是模因的世界。只有自己先完全臣服，才能成为布道者，轻易激发他人的镜像神经元，制造共鸣。

No.59

工具（或外部资源）越丰富越强大，人自身的匮乏就越显得尴尬

No.58

时代巨轮

- 房地产和金融繁荣的 10 年，是需求、资金、市场储备期；
- 接着是互联网和商品市场繁荣的 10 年，使产业升级和城市化进程加速；
- 增速放缓后，迎来教育和娱乐繁荣的 10 年，环境社会板结的压力并争夺所剩无几的注意力；
- 然后是医疗科技和服务繁荣的 10 年，老龄化社会在泡沫破灭后发现科技解决不了太多问题；
- 宗教和精神需求，使得经受苦难的一代幡然醒悟，我们终于在大概 2042 年迎来文艺复兴和认知革命……

No.57

读书大概率对学习没帮助，读书大概率是安全的消遣方式（省钱无副作用只是消耗生命），是扩展体验习得人性的高性价比方式。

No.56

商品越多，供需匹配就越有价值；工具越多，效率就越重要；内容越多，传世作品就越难得；知识越多，洞察就越珍贵；机会越多，信任就越稀缺。永远追求更「少」的那部分。

No.55

越是突破了时空限制（或者，人的限制）的变革，越是伟大。回看几次工业革命，分别用机械、能源、信息来突破时空限制。下次该 hack 上古时期进化而来的大脑，（用作弊来）彻底改变时空观念了吧。

No.54

「回归均值」才是原力吧…

然后是均衡，死一般的均衡。
秩序和生命才是神迹。
神迹都有赏味期限。

No.53

没有无来由的快，没有 360° 的舒服，更没有现实和幻想的零损耗转换器。速度与加速度有关，舒服背后有接纳和平衡，而自由来自于放弃自由的幻想。

No.52

学习的关键是「习」，习到认知资源追加投入趋于零为之。天才主要是「习」得早，而不是「学」得好。可惜习太难了，还是听过道理就当作学会了要轻松得多。

No.51

我们面对的很多困局，都来自只用一种模式去应对很不一样的情境。

No.50

当你尝试去模拟世界时，你会不可避免地重新爱上它

No.49

没有你想象的好，也没有你想象的差。一定跟你的想象有所出入。请拥抱它们，珍惜它们——能时时意识到这一点，就能获得巨大的释然

No.48

[#交互设计#](https://s.weibo.com/weibo?q=%23交互设计%23) 的核心任务，从十年前的「节省认知资源」到现在的「抢夺注意力」，难免力不从心。「抢夺注意力」不是人机交互的命题，这基本要由人际互动去实现，或者是交给包裹了欲望和焦虑的算法去实现。

No.47

有好胃口，记得要保护好牙齿。如果能力爬升缓慢，野心最好不要跟通货一样总是膨胀。

No.46

丹尼特说，当下自我是多重自我 叙事重心的呈现。那么写作成为一种疏导、强化叙事重心的方法，实现 identity disclosure，就太自然了。

No.45

设计为感官导游，也可以为思维和情绪导游。导向自我、导向未知、导向无人之境，也可以导向深渊和地狱。

No.44

Attention span
Cognitive load

对个人来说，如果这两个指标能被若干 App 极大影响，说明我们已经掉进了深井里，还以为自己观到了天。

No.43

Feeling good 才是人的绝对刚需，physically &amp; mentally

You are good, or you are just feeling good?

No.42

宜居作为城市品牌

北京：抱负宜居、信息宜居

上海：感官宜居、思想宜居

广州：胃口宜居、智慧宜居

深圳：创新宜居、气候宜居

杭州：环境宜居

成都：人性宜居

No.41

如果说复制数量是自然选择的 KPI，那么需求强度以及谜题的魅力值（有多神秘、有多美）应该是知识和技术被选择的 KPI。

No.40

如果可以，依附趋势而不是体制；依附大体制（通用体制）而不是小体制（局部体制）

No.39

自信并不来自达成结果。

对于从不缺少它的人来说，自信来自于拥有它本身的 reward。对于艰难才习得这一技能的人来说，则来自于那些曾经陪伴自己一步一步走过的至暗时刻。

No.38

创业要创造的是价值转换的整个 pipeline

80% 的创业在价值定义阶段就半死不活了；剩下的 80% 死在价值转换载体；能建成高效、优雅、自生长 pipeline 的团队，才能回答创业的初始命题：以前所未有、前所未优的方式，生产和传递价值，从而获得超额收益。

No.37

对道理做出即时的反应是最容易的。而：

- 辨别道理和观点的不同，有点难；
- 思考道理适用的情境，比较难；
- 设计一个实验验证道理，非常难；
- 处理万千道理之间的关系化解矛盾，特别难；
- 处理道理跟自己的关系，要如何对待，太难；
- 重建道理的形成和传播过程，几乎不可能……

「道理我都懂」—— 我懂个 P 啊！

No.36

以暴制暴？

我们已经进入一个时代，需要创建自己的「游戏」来抵御别人的「游戏」对自己的剥削，比如消费游戏、社交游戏、裂变游戏、流量游戏、毛衣战游戏……所谓自己的「游戏」，也就是可以反复进入心流的那件事了吧。又或者是立地成佛，不玩也不制造任何「游戏」。

No.35

感动的本源

每当你看到、感受到、想象出人作为一个物种的极限和无可奈何，就是泪如雨下的时候

No.34

每一个行当走在最前面的人，是很早就以此为使命的人，不论善恶

No.33

爱靠信仰，关系靠合作。

No.32

追求无止境的东西最终会陷入痛苦，比如财富、爱、知识，甚至成长。但是生命的原力就是突破限制啊。有止境的东西很罕见，现在可能算是一种。前人的解法是，在有止境的当下去不设限的「活」，去兽性，去神性，回归人性。

No.31

驾驭财富，是玩一个「不输」的游戏，而不是一个「赢得」游戏。我一直都搞错了。

No.30

财富本来不是就零和游戏，拥有财富最多的人们会意识到，自己已经赢得了获得财富的游戏，开始投身到财富（意义）再分配的游戏中；知识更加不是*零*和游戏，知识再创造直接发生在知识获取的过程中。这是多么激动人心的游戏。

No.29

哪些东西具有指数一般的力量？时间，科技（数学/代码/网络），元认知，爱。

No.28

设计真正的使命在于，驯化并整合艺术、科技、商业的力量，为人类族群谋福利。这对设计师来说几乎不可能，对只做设计的设计师来说，更加不现实。最伟大的设计很少出自设计师之手，接受这个现实，好好学习和成长吧。

No.27

注意力税

好多特别棒的东西都是免费的，比如清新的空气、斥资巨大的科研成果、投资大师的箴言……但是它们都没有推广预算和营销经费，突破不了微信推文、微博热搜、综艺、课程广告、加了 v 的销售代理们的层层包围，进入不了我们的注意力范围。

No.26

提醒自己要对三样东西永远心存敬畏：人性、随机性、反常识

No.25

身处巨大奇迹之中，却视而不见，没有想过提炼出其中的能量、规律、工具为己所用和服务他人。这开始变得不可忍受。——这也许是逐渐理解可供性以后的重要转变

No.24

自由大概跟幻想成反比，做人还是贝叶斯一点好

No.23

生命中有很多 mess。能够跟各种 mess 和谐相处，以及能够分辨哪些 mess 是 path to death、哪些 mess 孕育着 beauty &amp; life，可能是生命中的头等智慧吧。

No.22

高手有经验，专家有专长。高手能达成结果，专家能讲清原理。高手内化原则，专家破解规律。 [#既要做高手也要做专家#](https://s.weibo.com/weibo?q=%23既要做高手也要做专家%23)

No.21

领导者最重要的一件事情，可能就是尽量从源头减少组织熵（混乱）的产生，例如用什么样的价值观吸引什么样的人用什么样的机制做哪些事。这样才能让组织保持生命力（有序性），在充满不确定性的世界中发展。成功的组织，能以最小有序结构包容最大无序性（比如生态系统）。

但现实很残酷，这个人往往是组织趋于混乱的主要来源。

No.20

遇到真正喜欢的人，你会相信性别不值一提；
遇到不愿放弃的事，你会明白年龄都是假象。

No.19

亲密关系三大理性瓶颈：

- 缺乏深入理解和准确表达对方、尤其是自己的需求的习惯；
- 急于「求同」而想控制和改变对方，错过了「存异」带来的成长机会；
- 创意不足，化解不了其实可以皆大欢喜的矛盾，导致合作变竞争

No.18

科技：什么更强更本源；人文：什么更好更重要

No.17

脑子里本没有回路，来回踩得多了，也就形成了路……如果隔久一点再回来踩，在多条路之间换着踩，像真的走在路上那样踩，旁边还有个告诉你踩得对不对的人/记分牌，疗效更好~ ----读《认知天性》

No.16

人的成长过程中，有一个持续的任务，就是拆除/修整各种观念中的「违章建筑」。这些四面漏风大而不倒的东西，大都是在未经评估、未经许可的情况下，不知道被谁（各种模因）偷偷搭建的。

No.15

(互联网)设计师擅长给自己扣大帽子。最难的事情往往跟 ta 没关系，比如商业模式设计、制度设计、系统设计等等。

用户体验设计师，大部分只是屏幕视觉和(部分)操作设计师；交互设计师，大部分只是前台用户使用流程+细节前端逻辑梳理员；UI 设计师，大部分只是屏幕视觉元素调优/设计师；服务设计师，大部分只是服务系统触点梳理人+体验布道者……

不需要为太多事情负责，自我感觉就会比较良好。等到不受重视时，又经常挟用户以令诸侯，忽视工程难题，忽视系统的优雅，忽视运营目标，忘记了美并不是生产力，而只是吸引力，也忘记了吸引力只是价值传递的其中一步而已。

No.14

目标管理大概比时间/精力管理重要 100 倍吧。

「瘾」的识别、承认和引导，大概比目标管理重要 100 倍吧。

No.13

越来越觉得老师其实是 knowledge curator or buyer

No.12

一个新的工作/伙伴/环境（本身），与历史状态无关，具有马尔科夫性质。少把过去的设置代入当下，因为那很有可能是幻想。概率不会因为已经连开 10 次「大」，就赏你 1 次必然的「小」。当然，也有持续起作用的因子，比如自己的判断和处事方式。

No.11

快捷方式只负责快捷，不负责目的和目的地检验

No.10

N 年以后，突然明白 Star Trek TOS 的主旨了：人是高级智能，因为可以理解不符合逻辑的矛盾，制造并兼容这些矛盾。所以，爱要么是训练高级智能的方式，要么是智能发展的结果——看似不符合逻辑，实质却是碳基质最高效的超频算法。

No.9

事情总是这样，难的部分比我们想象要简单，简单的部分比我们想象的要难。

No.8

前瞻能力 ≈ 比别人更早追问本质并知行合一的能力

并不复杂，但很困难

No.7

[#交互设计#](https://s.weibo.com/weibo?q=%23交互设计%23) 常常把行为流，拆分成一个个（带上下文的）行为序列和节点，然后才去各个优化。面对自己的思考过程，如果也能这样拆，很快就能找出很多未经审视、不靠谱的推断。最后发现，问题大都是因为定义太粗糙、太二元、太武断、无情境

No.6

从不心怀侥幸，认清自以为是的预期，就会越来越有安全感。

No.5

大家总是认为自己输入不够，其实真相是输出少得可怜或根本没有……来自别人的东西真的太多了，哪怕稍微做一点加工、加入一些（可能）属于自己的东西，这点成本都懒得付出，只好安慰自己再多看看吧……

No.4

当下行动 &gt; 蓝图 &gt; 故事

前提是有相对稳定的自我叙事，和指向性好而不是分辨率高的蓝图

No.3

不能拿出来讨论的，往往都会变得危险而再也不能拿出来讨论了

No.2

绝大部分事情可能没有本质区别，只有程度差异

No.1

被动的娱乐，关键词：feed

主动的娱乐，关键词：play

读书大都是披着主动外衣的被动娱乐，游戏完全可以是披着被动外衣的主动娱乐。

---

体验比思考重要

祝你我在新的一年有新的体验~
</content:encoded>
        </item>
        <item>
            <title><![CDATA[科普应援！三分钟了解阿尔茨海默病及幕后创作记录]]></title>
            <link>https://tophci.com/posts/191009-3min-alzheimer</link>
            <guid isPermaLink="true">https://tophci.com/posts/191009-3min-alzheimer</guid>
            <category><![CDATA[Animation]]></category>
            <category><![CDATA[Alzheimer's]]></category>
            <category><![CDATA[阿尔茨海默病]]></category>
            <category><![CDATA[科学3分钟]]></category>
            <category><![CDATA[科普]]></category>
            <category><![CDATA[动画]]></category>
            <category><![CDATA[原创]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 08 Oct 2019 16:00:00 GMT</pubDate>
            <content:encoded>
又一年国庆长假过去了，00 今年依然没有参加朋友圈摄影大赛，而是跟朋友一起做了个科普动画短片，参加 B 站主办的 [科学 3 分钟 - 全国科普微视频大赛](https://www.bilibili.com/blackboard/3minscience.html?spm_id_from=333.788.b_7265636f5f6c697374.1)。

&lt;img src=&quot;https://i0.hdslb.com/bfs/archive/9fc9d0def194c80a34baacc8cf3a17812e8d5f30.jpg&quot; style=&quot;zoom:30%;&quot; /&gt;

这是我的科普动画处女作，片长 3:59。短片介绍了阿尔茨海默病（老年痴呆症）的常识和预防措施，希望让大家了解并开始重视这个离我们越来越近的疾病。视频地址：

[脑中的橡皮擦——阿尔茨海默病的预防和干预\_哔哩哔哩 (゜-゜)つロ 干杯~-bilibili](https://www.bilibili.com/video/av70538776/)

![AlzheimerCover-title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/AlzheimerCover-title.jpg)

### 如何投票支持

点击下方图片跳转投票页面，登录 B 站帐号，点击「+1 票」按钮，即可投票。比赛投稿截止前（10.25）每天都可以投一票。

[![](http://img.viz.mobi/vote-banner-a.jpg)](https://www.bilibili.com/blackboard/activity-8qCJ8URwr.html?share_source=weixin&amp;share_medium=iphone&amp;bbid=7151C7DE-CD7B-42F5-809B-16AEFC491FAC190977infoc&amp;ts=1570530343015&amp;from=singlemessage&amp;isappinstalled=0#a_id=16130798&amp;s_id=11961)

也可以在电脑浏览器打开链接 https://www.bilibili.com/video/av70538776/ ，点击视频下方的「点击投票」按钮。**对视频点赞、投币、收藏也可以帮助作品获得更好名次**！

![](http://img.viz.mobi/%E7%BD%91%E9%A1%B5%E6%8A%95%E7%A5%A8%E5%85%A5%E5%8F%A31.jpeg)

如果你想转发视频给更多朋友，可以转发本文，或者直接发送视频链接 https://b23.tv/av70538776。

感谢支持~

## 创作记录

得知比赛信息，是在投稿开放一周以后。9.21 恰好又是世界阿尔茨海默病日，于是决定创作这个主题相关的科普短片。

&lt;img src=&quot;https://www.alzhn.ca/wp-content/uploads/2016/11/WAD-LOGO_LARGE-350x500.jpg&quot; style=&quot;zoom:50%;&quot; /&gt;

关注阿尔茨海默病已经好几个月，之前写过一篇书评 [在生命战场，请远离伪科普——医药科普类书籍避坑方法](https://www.uegeek.com/190523-alzheimers-book-not-recommended.html)。并且在 [Github 上面分享了自己整理的阿尔茨海默病优质信息源、纪录片和出版物](https://github.com/kidult00/fighting_alzheimer)，Github 链接可以点击以下图片访问：

[![](http://img.viz.mobi/github-banner.jpg)](https://github.com/kidult00/fighting_alzheimer)

在构思科普视频之前，把之前看过的纪录片和关键信息整理了一遍，以[国家卫生健康委老龄健康司的宣传材料](http://www.chinacdc.cn/yyrdgz/201909/t20190921_205709.html)为基础，完成了短片的文案。还尝试学习剧本写作的方式，把文案一点点拆成了人物角色和场景、镜头。

![Alzheimer_lines](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/Alzheimer_lines.jpg)

接下来是动画创作阶段。此处省略掺杂了复杂情绪的过程描述约 2 万字……简单说就是借助 FCPX 和 Motion 的 Brightly 人物场景插件，完成了复杂动画的设计和转场。

接着，进入到关键的配音阶段。十分庆幸自己非常明智地请到了好朋友 MF 来创作声音部分。曾经为千万用户级 APP 主创声音的 MF 同学，带着我到专业的录音室，跳过各种录音时容易踩的坑，非常高效地完成了声音录制。特别感谢她让这个短片同时具有了温度和专业气质，也提供了不少修改建议和支持，让我能提前完成整个作品。

音乐部分，并没有专门创作背景音乐，而是花了不少时间寻找合适的 Royalty free music。最后采用了 Artificial.Music 的一首作品，感谢 ta 的创作：

```
tears that collapse like aurora raindrops of sunlight by Artificial.Music

[https://soundcloud.com/artificial-music](https://www.youtube.com/redirect?redir_token=-FeiKg200GcqUWpHDJ-V5zFlvJx8MTU3MDUxOTkyM0AxNTcwNDMzNTIz&amp;q=https%3A%2F%2Fsoundcloud.com%2Fartificial-music&amp;v=ChPk0BekVKY&amp;event=video_description)

Creative Commons — Attribution-ShareAlike 3.0 Unported— CC BY-SA 3.0

Free Download / Stream: [http://bit.ly/2nYoPCn](https://www.youtube.com/redirect?redir_token=-FeiKg200GcqUWpHDJ-V5zFlvJx8MTU3MDUxOTkyM0AxNTcwNDMzNTIz&amp;q=http%3A%2F%2Fbit.ly%2F2nYoPCn&amp;v=ChPk0BekVKY&amp;event=video_description)

Music promoted by Audio Library [https://youtu.be/ChPk0BekVKY](https://www.youtube.com/watch?v=ChPk0BekVKY)
```

![](http://img.viz.mobi/creationJourney.png)

一次完整的创作历程，也是一段充满各种体验和回忆的旅途。

这次的国庆创作之旅，是我众多旅途中独特而珍贵的一段。它让我体验到，不论身在何处，有些经历可以由自己去创造。而旅途中不期而遇的人事物，也会因为用心地创造而变得鲜明生动。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[Blender 的相机参数解析]]></title>
            <link>https://tophci.com/posts/190908-blender-camera-setting</link>
            <guid isPermaLink="true">https://tophci.com/posts/190908-blender-camera-setting</guid>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Camera]]></category>
            <category><![CDATA[Render]]></category>
            <category><![CDATA[三维]]></category>
            <category><![CDATA[教程]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sat, 07 Sep 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_dof-bokeh.jpg)

相机在三维软件中必不可少，它定义了渲染图像中的可见部分。

在 Blender 中，相机镜头相关的选项和参数有很多，它们共同决定了三维物体在二维图像中的呈现效果。

![](http://img.viz.mobi/BlenderCameraPara.png)

在刚开始接触镜头和渲染时，你可能会对这么多参数感到头秃。今天我们一起来整理一下。

## Lens

![2-BlenderCameraPara-lens](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-BlenderCameraPara-lens.jpg)

### Type 投影方式

透视（Perspective）和正交（Orthographic）是两种不同的镜头类型。

透视跟我们在现实世界中查看事物的方式类似。远处的物体看起来比眼前的物体小，平行线会在视线远处收敛到一个点。

![render_cameras_traintracks-perspective-BI.jpg](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_traintracks-perspective-BI.jpg)

跟透视对应的是正交镜头，即无论距离如何，始终显示实际尺寸。这意味着平行线看起来一直平行，不会像透视那样在远处相交。

![](https://docs.blender.org/manual/en/2.80/_images/render_cameras_traintracks-orthographic-BI.jpg)

如果选择了正交镜头，Orthographic Scale 参数可以控制投影在图像上物体的外观尺寸。

### Focal Length 焦距

焦距控制变焦程度（the amount of zoom），会影响场景在镜头中的可见范围。**焦距越大，视场 FOV / Field of View 越小（more zoom），而焦距较短时，视场范围更大（less zoom）**。

有点绕，看看下面这张图就明白了：

![5-field-of-view](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/5-field-of-view.jpg)

在 Blender 中，对同一场景设置不同的焦距，效果如下：

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_traintracks-perspective-BI.jpg)

35mm 焦距

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_traintracks-perspective-telephoto-BI.jpg)

210mm 焦距

### 偏移

调整消失点，即平行线会聚的位置。需要注意的是，偏移容易跟镜头旋转混淆。

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_traintracks-perspective-lens-shift-BI.jpg)

水平镜头偏移 0.330，水平线保持不变

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_traintracks-perspective-rotate-BI.jpg)

旋转镜头而不是使用偏移量，水平线有轻微偏斜

### Clip start and end

![2-BlenderCameraPara-lens](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-BlenderCameraPara-lens.jpg)

物体直接可见的范围。此范围之外的物体仍会间接影响图像，因为 clip 范围之外的光照反射依然存在。

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_perspective.svg)

透视镜头下的 clip

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_orthographic.svg)

正交镜头下的 clip

## Depth of field 景深

![11-BlenderCameraPara-dof](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/11-BlenderCameraPara-dof.jpg)

相机通过镜头传输光线，镜头将光束弯曲并聚焦到传感器上。光束聚集的区域称为焦点，可以使用数值或摄像机与物体之间的距离来设置。

![](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_dof-bokeh.jpg)

焦点物体：选择某个物体将自动确定焦点

焦距（Focal Distance）：由数值指定。如果在后面的「视图显示」参数中勾选了 Limits，在视图区域中的焦距处会显示黄色十字。

&gt; 提示：在 Blender 中，将鼠标悬停在“ 距离”属性上，然后按 E 开启“ 深度选择器”。单击 3D 视图中的一个点，就会采样从该点到相机的距离。

### 光圈

![11-BlenderCameraPara-dof](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/11-BlenderCameraPara-dof.jpg)

**F-Stop**

光圈影响景深。

从原理上讲，当镜头入光孔径越大，景深就越小，伴随背景模糊的效果。在拍摄人物、室内静物时常用大光圈。

不过，在参数设置上，最常用 F-stop 来调节光圈大小。在使用真实的相机时也是如此，AV 模式就是光圈优先模式，可以随意调节 F-stop 的大小，其他参数如 Speed 和 ISO 则由相机自动调节。

![](https://www.thelondonphotoshoot.com/wp-content/uploads/exposure-guide.jpg)

为了方便记忆，我们只需记得 **F-stop 越大，景深也越大**，画面中模糊的部分也会越少。

![](https://i.pinimg.com/originals/d0/76/64/d07664e2735dbba536bd4ba6bd8da064.jpg)

**Blades**：在现实摄影中并没有这个参数，这是三维软件特有的。用于调整渲染中用来模糊物体形状的多边形数量。

**Rotation** 旋转：沿着面轴旋转多边形 blade。

**Ratio** 比率：模拟变形散景效果（anamorphic bokeh effect）。1.0 表示没有失真，小于 1.0 水平失真，大于 1.0 垂直失真。

## 相机

![15-BlenderCameraPara-camera](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/15-BlenderCameraPara-camera.jpg)

Size 传感器尺寸：此参数是控制焦距的另一种方法，将 Blender 中的相机与物理相机和镜头组合相匹配非常有用，例如用于 [运动跟踪](https://docs.blender.org/manual/zh-hans/2.80/movie_clip/index.html)。

### 安全区域

安全区域提供参考线，确保可以在屏幕上看到内容的主体。

不同的屏幕有不同数量的 [overscan](https://docs.blender.org/manual/zh-hans/2.80/glossary/index.html#term-overscan)。边缘的部分图像可能会显示不全。后来，在电视中常常会设置两个区域：action safe and title safe，以确保内容显示完全。

现代 LCD /等离子屏幕其实没有 overscan 的问题，但安全区域仍被保留下来。在 Blender 中，可以在相机和序列视图中设置安全区域。

[![render_cameras_safe-areas-main-BI.png](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_safe-areas-main-BI.png)](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_safe-areas-main-BI.png)

红线：Action safe；绿线：Title safe

另外，还可以指定安全区域的外边距（中心和渲染区域的百分比）。

- Title Safe Margins X / Y：也称为图像安全。将所有重要信息（图形或文本）放在此区域内，以确保大多数观看者都能看到。

- Action Safe Margins X / Y：确保镜头中任何重要动作或角色都在此区域内。

- 中心切割安全区域：中心切割是第二组安全区域，用于确保在不同宽高比的屏幕上正确显示内容。Blender 默认在宽屏比率 16:9 之内显示 4:3 区域

![render_cameras_safe-areas-cuts-BI.png](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_safe-areas-cuts-BI.png)

青线：Action center safe；蓝线：Title center safe

## 视图显示

[![render_cameras_display-view-BI.png](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_display-view-BI.png)](https://docs.blender.org/manual/zh-hans/2.80/_images/render_cameras_display-view-BI.png)

相机视图中安全区域，传感器和名称

视图显示主要提供辅助的参考线和镜头信息。

- 尺寸：3D 视图中摄像机可视化的大小。此设置对相机的渲染输出没有影响。还可以使用标准比例 S 变换键缩放相机可视化。

- Limits 范围：显示 Start and End Clipping 值。

- Mist 薄雾：显示为摄像机视线上的两个连接的白点。雾的其他选项在 _世界环境_ 面板中的 [烟雾部分](https://docs.blender.org/manual/zh-hans/2.80/render/cycles/world_settings.html#render-cycles-integrator-world-mist) 设置。

- Sensor 传感器：在摄像机视图中显示虚线框。

- Name 名称：在摄像机视图中打开和关闭名称显示。

Passepartout 边框：此选项会使摄像机视野外的区域变暗。

Composition Guides 参考线：覆盖到相机显示屏上，可以在构图时提供帮助。

---

[Blender Principle BSDF shader 使用教程](http://mp.weixin.qq.com/s?__biz=MzI3NzM3NzIzNQ==&amp;mid=100000966&amp;idx=1&amp;sn=ce2a8104ce7bbe6a1a7a6033de033070&amp;chksm=6b667d7a5c11f46c5e9a7430cc3a2525be7e9c198e809a6cb7114adff2532276607f4d92228b#rd)

[一文看懂材质/纹理 Material, Texture, Shading, Shader 的区别](http://mp.weixin.qq.com/s?__biz=MzI3NzM3NzIzNQ==&amp;mid=100000954&amp;idx=1&amp;sn=8bcc64963454cca9d0df19a0e5340dea&amp;chksm=6b667d065c11f410f466a18a769a89ea94d77a9ef32399793190672951e8acd1f574738e9bb6#rd)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[设计沉浸式的展览体验]]></title>
            <link>https://tophci.com/posts/190807-design-immersive-exhibition-experience</link>
            <guid isPermaLink="true">https://tophci.com/posts/190807-design-immersive-exhibition-experience</guid>
            <category><![CDATA[Design]]></category>
            <category><![CDATA[Exhibition]]></category>
            <category><![CDATA[Immersive]]></category>
            <category><![CDATA[Experience]]></category>
            <category><![CDATA[Guideline]]></category>
            <category><![CDATA[展览]]></category>
            <category><![CDATA[沉浸式]]></category>
            <category><![CDATA[体验]]></category>
            <category><![CDATA[设计]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 06 Aug 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/ImmerExp-framework.png)

&lt;!--more--&gt;

在知名研究机构 Gartner 的[2019 全球十大科技创新趋势](https://www.gartner.com/smarterwithgartner/gartner-top-10-strategic-technology-trends-for-2019/)报告中，沉浸式体验（Immersive Experience）是其中的一大趋势。

![](https://blogs.gartner.com/smarterwithgartner/files/2018/09/PR_499538_Top_10_Technology_Trends_for_2019_Infographic.png)

&gt; 沉浸式体验是指通过技术手段完成模糊物理世界与数字或模拟世界之间的界限，从而营造出沉浸感的体验过程。

Gartner 预测，到 2022 年，70％ 的企业将尝试使用沉浸式技术进行消费和企业使用，25％ 将用于生产。

## 沉浸是一种什么感觉？

从 iMax 电影到迪士尼乐园，从虚拟现实游戏到数字艺术展览，时下的消费体验已经越来越趋于「沉浸」。

沉浸的状态对每个人应该都不陌生。这是一种空间边界变得模糊、时间感消失、个体限制似乎被消解的神奇体验。有人会将它与「心流」的状态联系起来。心流状态一般产生于全身心投入，以完成某个明确目标的过程，目标带来的挑战与个体的能力相匹配，而且伴随及时的行为反馈，能让人拥有沉浸的愉悦感和意义感。

![](https://upload.wikimedia.org/wikipedia/commons/thumb/f/f6/Challenge_vs_skill.svg/300px-Challenge_vs_skill.svg.png)

沉浸感的实现必然围绕「人的感受」。具体来说，可以拆解为几个方面：

- 多感官、较高强度的综合体验 —— 仅依靠视觉很难进入沉浸状态
- 展览内容和氛围的代入感 —— 沉浸与日常生活的体验有所区别
- 高参与度 —— 主动参与甚至操控环境与对象，是沉浸的重要特征

沉浸式体验是综合性的设计难题，设计师可以多从精于此道的行业偷师，包括舞台设计、主题乐园、嘉年华、音乐节、赌场、游戏、电影等等。

![](https://www.americantheatre.org/wp-content/uploads/2014/08/sept14_Les-Mis_Dallas2.jpg)

_&quot;Les Miserables&quot; at Dallas Theater Center. (Photo by Karen Almond)_

福布斯作者 Seth Porges 向一些作家、游戏设计师、沉浸式剧场生产者，以及其他前沿体验设计者问了这样一个问题：你认为什么才是创造一个沉浸式体验或世界的秘密？[有 6 个秘密值得参考](http://tech.163.com/16/0704/08/BR4A8RR100097U7U.html)：

- 通过细节来扩大你的世界并使之有生机
- 明确你对观众的期望值
- 给观众一种身份感
- 将劣势转化为优势
- 让观众来做决定
- 创造一个人们能展现自我的空间

## 展览体验

传统的博物馆和美术展览体验，多是静态和被动的，观展者按照既定的路线参观，展品陈列在橱窗中，仿佛接受朝拜的对象，无形中与观众直接形成了距离感。在这种展览中，很难获得沉浸式、身心愉悦以及富有教益的难忘体验。

我们走进博物馆，期望获得非同寻常的经历，获得那种好奇被激发，进而寻思谜题，感觉世界被打开的惊喜和微小的重生感。这跟走进电影院，经历一个充满笑和泪的故事、在制作精良的游戏中定义自我身份、到异国他乡感受迥异的文化，并没有本质的不同。

好的展览体验令人难忘，它在物质、智力和情感层面都让人感到满足。

![](https://6mirai.tokyo-midtown.com/blog/images/20170303_blog_01.jpg)

Belaën（2003） 将展览分为三种类型：

- Reconstitution：重构并真实还原某个外部世界
- Creation：创造某个并不真实存在的内源性世界
- Interpretation：解释性地表达某些非常规尺度或现象

每一种类型都可以提供引人入胜的体验。这对策展人和设计师们提出了新的课题和挑战。

## 设计沉浸式展览体验

体验始终关乎于人。

而展览体验要始于一个基本问题：

&gt; 这个展览是关于什么的？

向谁讲述什么故事，让他们理解和感受到什么，是体验的根基。

### 基本模式

参观展览是一次综合性的活动，观众行走、驻足、观看、阅读、沉思、触摸、操作装置、记录……用什么方式组织内容并引导展览的进行，将为展览体验定下框架。

类比数字内容产品设计中的一个重要概念「信息架构」，受众与内容之间的抽象的互动模式可以是：

- 人不动，内容移动。这是基于屏幕的内容展示模式，例如电影、游戏。
  ![](https://www.wired.com/wp-content/uploads/2015/04/1mtWG5W_Jsg8JrjqWS3XA4w-1.png)
  [_Matt Sundstrom_](http://www.mattsundstrom.com/)
- 人移动，内容不动。这是典型的「检阅」模式，展览多采用这种模式。
- 人移动，内容也随之变化。
  ![](https://www.wired.com/wp-content/uploads/2015/04/1-GMbKwQN2A9OUvqw9TLRIA-1.png)

（也许还有其他的模式？检阅式的走马观花真的很无聊啊……）

展览的体验是全方位和富有层次的。更合理且有潜力的方式，应该是人移动，内容也随之变化，比如在一定区域内的内容，允许观众选择和互动。

MLL Design Lab 从物理、智力、情感三个层面给出了 [Top 10 Tips to Great Museum Exhibit Design](https://marialorenalehman.com/post/top-10-tips-to-great-museum-exhibit-design)：

![](https://global-uploads.webflow.com/580e5333bd9da8b9577709ec/584296364bab51ec5b188d19_10-Tips-Diagram.jpg)

下面 00 从设计要素出发，重新整理一个沉浸式展览设计的框架，并初步讨论设计要素和关键问题。

![](http://img.viz.mobi/ImmerExp-framework.png)

### I. Stage 场所/场景

展览是一次对未知的体验。

进入展览的阶段，就像是一封邀请函，收信人根据邀请函决定要不要赴约。Achiam（2010） 将展览看做是一次跨越文化边界的体验，观众从日常生活进入到一个虚构的情境，也是进入到一种独特的文化当中。能否从熟悉的真实世界，平滑过渡到展览所营造的小世界，对沉浸的程度有很大影响。

不论展览是什么主题，一般都跟日常生活的场所有明显区别。如何让观众能暂时忘却现实生活，进入一个陌生的情境，甚至能够意识到自己将在展览中进行某种程度的「role play」？

#### **空间**

回想一下，当我们进入电影院、游乐场、赌场的时候，空间的光照和布局能够一下子让我们跟现实世界分离，忘记刚才从哪里来，以及前一分钟还挂念着的种种琐事。所以，在进入展馆时（甚至在这之前），就需要将空间逐渐调整到展览叙事的「频道」，按照那个世界的设定去营造氛围。比如，天文主题展览可能会模拟太空和宇宙，在一个黑暗、神秘的空间内展开；而动漫展览可能需要一个敞亮、富有活力而且梦幻般的空间。观众可能会注意到空间中出现了一些「非现实」但跟主题相关的元素。这时候，叙事已经开启。

![](https://www.amos.be/wp-content/uploads/cropped-og-image.jpg)

#### **身份**

除了空间布景，对观众做一些身份特征调整，也能帮助他们更快融入到环境和叙事中。比如，一些沉浸式戏剧会让观众带上面具，这种富有象征意义的设置，既可以激发好奇和参与感，又能推进互动。又比如，可以将观众分成几组并给予一些标识，让观众在一开始就对人物关系有所理解和期待，然后在展览中设计一些互动。

![](http://farm7.staticflickr.com/6029/5915629467_b5b1b0f466_z.jpg)

#### **谜题**

谜题永远是激励人们进行探索的法宝。提出一个好问题，让观众带着问题进入展览。这个问题一般就是展览主题的一个有趣的表述。这么简单有效的方法，竟然很少见到有展览真正在用（或者是用了但是没用好），真是不可思议。

![](http://img.viz.mobi/canInterExpBeDesigned.jpg)

#### **小结**

在设计时展览空间时可以重点考虑：

- 与外部世界的隔离，氛围营造
- 模糊原来的身份和特征
- 用问题/目标激发探索欲

### II. Narrative 叙事

想象力是人的独特能力。而最容易激起共鸣和想象的，就是故事。

看看电影行业，无论技术怎么发展，最经久不衰的，一定都是故事讲得最动人的影片。

#### **内容组织**

要将展览内容串成故事绝非易事，尤其如果固守以展品为中心的策展思路的话。在策划之初，不妨重新思考一下，展览内容还有哪些可能的组织形式？是用时间线来组织吗？还是可以考虑划分主题？或者用几组呼应的概念来贯穿？是不是用逐渐深入的一组问题会更有层次感？

![](https://s3-ap-northeast-1.amazonaws.com/everydayobject/wp-content/uploads/2017/12/mvrdv-design-society-shenzhen-designboom-2_Easy-Resize.com_.jpg)

#### **故事要素**

故事的要素，包括人物、时间、地点、情节、冲突、关系变化等等。

在展览内容的叙事中，可以首先考虑希望观众扮演什么样的角色，这个角色的身份、视角和行为特点是怎样的，这些特征是否能够清楚传达给观众。有了对角色的预期（比如，模拟一个宇航员的角色），观众对内容就能有更多的理解和互动的愿望。

![](http://img.viz.mobi/13-DSC_0023.jpg)

角色之后，是情节的展开。展览中所谓的故事情节，没办法像文字和影像媒体那样生动具象。如何让情节向前发展呢？一个办法是截取片段，比如宇航员的故事中，可以有儿时梦想、申请、训练、执行任务等几个「关卡化」了情节（甚至可以安排递进关系）。在情节中穿插一些任务，把不同关卡联系到一起。任务设计需要考虑减少认知和理解成本，提供及时、丰富的反馈，这样有助于情节的推进，更重要的是，这些任务往往就是「沉浸感」的重要来源。

#### **小结**

展览叙事的设计，需要注意：

- 用有趣、有故事性的方式组织展览内容
- 从角色身份特征出发，设计有代入感的讲述（呈现）方式
- 安排具有一定主题和关卡特点的情节和任务
- 精简叙事对象，减少信息冗余，提供明确的指引和反馈

### III. Sensation &amp; Interaction 感觉和互动

有了前面叙事的铺垫，观众逐渐进入到角色和情节当中。如果我们能激发观众对内容的感受，鼓励与内容进行一些互动，沉浸的体验就能更进一层。

**展示**

展览内容如何被展示，决定了它如何被感知。所有的内容都需要合适的「舞台」。

传统展览绝大部分的展示方式，都是静态的安放，观众观看并离开。这跟在菜市场浏览摊档、在微博里刷时间线，还挺相似的……

沉浸的前戏是吸引。让内容带有舞台中央主角般的光环，吸引目光的停留，号召注意力的投入，才有沉浸的可能。在设计内容展示时，可以参考具有「舞台感」的设计，毫不含糊地将视觉重点引导到主要信息上面，强化引导的层次，以便让探索渐进式地展开。

![](https://cdn.japantimes.2xx.jp/wp-content/uploads/2016/10/p20-yamada-design-e-20161030.jpg)

展览中一定会有不少让观众觉得陌生的内容，特别是科普性质的展览。为了减少认识和理解负担，设计师可以寻找目标人群所熟悉的东西，用类比和可视化的方式，在现实生活和新知之间架设起桥梁。

沉浸式的体验，不仅要求内容展示要足够明确和吸引，还需要进一步研究多感官的综合体验是如何发生的。视觉、听觉、触觉、嗅觉等，**如何激发了想象，又是如何唤起种种情绪的**。展览一定都有内容的主题，不妨试着再加入一条情绪的主线，看看它能带来哪些可能性。

**互动**

引人入胜的展示只是开始。它就像一封邀请函，调动起观众的好奇心，邀请他们探索更多。而承载这些探索最好的方式，是赋予观众主动权，去推进情节发生，去试验不同的可能性，并且在其中收获新的知识和体验。

日新月异的技术为我们提供了丰富而强大的工具。各种传感器可以收集环境和人的信息，屏幕、投影仪、声控设备、机械装置等等为交互结果和展示提供了数不尽的可能，而强大的控制中枢几乎可以通过编程实现各种各样的脑洞。互动不再是博物馆和展览中的奢侈体验，它已日渐成为主导的展览形式，将内容融入在互动过程中，实现沉浸的体验。

![](https://s.kathimerini.gr/resources/2018-10/running_7-thumb-large.jpg)

在故事线中安排互动，这些互动最好能围绕最初的谜题，然后把钥匙交到观众的手中，让他们去解锁，去庆贺小小的 A-ha moment。

现在有不少网红展览，特别注重拍照效果，让大家在过程中拍照传播。但是，这种展览往往没法达到沉浸的状态。当人们沉浸地探索有趣的事物，怎么会想到掏出手机来自拍呢？并不是说传播不重要，但是当下的探索和满足，应该比美美的自拍更值得追求。刹那的体验才是永恒。

#### 小结

感觉和互动是沉浸的关键环节，可以重点考虑：

- 为内容提供「舞台般」聚焦的展示，拉开信息层级的对比
- 运用类比和可视化，降低认知和理解负担
- 提供多种感官体验并激发想象和情绪（尝试设计情绪曲线）
- 围绕主题和问题设计互动方式，将内容融入互动中
- 用新的技术手段收集、处理、展示多维度的信息

### IV. Resonance &amp; Reflection 共鸣和反思

这道是加分题。

沉浸式体验已经非常不易，能不能更进一步升华？

回顾我们所经历的深刻体验，为什么它们能历久弥新？我想，这些体验有一些共同的特点。一是在当下能激发强烈的共鸣，顿悟也好，敬畏感也好，超越极限的感动也好，都是在某些情感维度上产生共鸣，从而跟主题内容、跟作者建立了深层次的联结；第二个特点是基于这个经历，让我有了一些反思和洞察，它们引导我获得一次小小的认知更新甚至重生，让我对生活的某些面向，产生前所未有的理解和态度。也就是说，它让我成为了更好的我。

![](http://www.graphicthoughtfacility.com/media/uploads/images/WAI-Me3-1-WEB_6.jpg)

一次令人难忘的展览体验，既能让人在当下沉浸，获得深层次的情感共鸣，又能持续影响日常生活，引发自我的小小进化。我想，这就是策展人和设计师的终极目标了。

&gt; 感谢阅读。如有展览、科普活动的合作，请联系 uegeek_at_gmail.com

## Ref

- Belaën, F. 2003. L’analyse de l’apparition d’un nouveau genre culturel dans les musées des sciences: les expositions d’immersion. Paper presented at the international cultural heritage informatics meeting, September 8􏰃12, in Paris, France.

- Achiam, M. (2010). Designing immersion exhibits as border-crossing environments. _Museum Management and Curatorship_, _25_, 323–336. https://doi.org/10.1080/09647775.2010.498990

- [Gartner Top 10 Strategic Technology Trends for 2019 - Smarter With Gartner](https://www.gartner.com/smarterwithgartner/gartner-top-10-strategic-technology-trends-for-2019/)

- [Flow (psychology) - Wikiwand](&lt;https://www.wikiwand.com/en/Flow_(psychology)&gt;)

- [Museum Standards and Best Practices](http://ww2.aam-us.org/resources/ethics-standards-and-best-practices/standards)

- [Top 10 Tips to Great Museum Exhibit Design](https://marialorenalehman.com/post/top-10-tips-to-great-museum-exhibit-design)

- [How to Design for Virtual Reality | WIRED](https://www.wired.com/2015/04/how-to-design-for-virtual-reality/#.3wyypns43.com/immersive-design-76499204d5f6#.3wyypns43)

- [设计沉浸式体验的 6 个秘密](http://tech.163.com/16/0704/08/BR4A8RR100097U7U.html)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[Blender Principled BSDF shader 使用教程]]></title>
            <link>https://tophci.com/posts/190612-principled-bsdf</link>
            <guid isPermaLink="true">https://tophci.com/posts/190612-principled-bsdf</guid>
            <category><![CDATA[OpenGL]]></category>
            <category><![CDATA[Material]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Shader]]></category>
            <category><![CDATA[Principled BSDF]]></category>
            <category><![CDATA[Texture]]></category>
            <category><![CDATA[Blender]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 11 Jun 2019 16:00:00 GMT</pubDate>
            <content:encoded>
Principle BSDF 是 Blender 默认的材质 shader 节点。

如果你刚接触 Blender ，或者对材质还不太了解，那么见到 Principled BSDF 的选项一定有点懵：

![](https://docs.blender.org/manual/zh-hans/2.79/_images/render_cycles_nodes_types_shaders_principled_node.png)

这么多参数到底都是啥？要怎样调出想要的玻璃或泥土材质？

今天我们就来仔细了解一下这个「万能」材质 shader。(如果你对 Material、shader、texture 还感到茫然，建议先看一下 [一文看懂材质/纹理 Material, Texture, Shading, Shader 的区别](https://www.uegeek.com/190608-material-texture-shaders.html))

## 什么是 Principled BSDF？

&gt; Principled BSDF 将多个层组合成一个易于使用的节点。 它基于迪士尼原理模型，也称为“PBR”着色器，使其与其他软件兼容，如皮克斯的 Renderman® 和虚幻引擎 ®。 从 SubstancePainter® 等软件绘制或烘焙的图像纹理可以直接链接到此着色器中的相应参数。

这是 Blender 官方文档中对 Principled BSDF 的说明。

可以说，这是一款综合型的材质生成着色器(shader)，跟时下普遍使用的 PBR ([Physically based rendering](https://en.wikipedia.org/wiki/Physically_based_rendering)) 是原理类似的技术。

那么，BSDF 又是什么？跟 BSDF 相似的还有一个 BRDF ：

&gt; BRDF - Bidirectional reflectance distribution function
&gt;
&gt; BSDF - Bidirectional scattering distribution function

它们是 「双向 反射/散射」分布函数的缩写。

想要正确模拟真实世界中的光照，需要理解光遇到物体表面时发生的[反射和散射](http://photorealizer.blogspot.com/2012/05/diffuse-and-specular-reflection.html)。

![](http://2.bp.blogspot.com/-6DFfNjFAq3Q/T4p0bf3wEoI/AAAAAAAAAa8/d7jB6gXN6aI/s320/Diffuse_reflection.gif)

&gt; Non metals will exhibit both reflection and refraction.

![3-BSDF-img1](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3-BSDF-img1.png)

&gt; Metallic materials only have reflection. All refracted light is absorbed.

![4-BSDF-img2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4-BSDF-img2.png)

BSDF 就是帮助我们实现更逼真的光散射效果的函数。

在 Blender 的旧版本中，默认的材质节点是 emission。为什么后来改成了这个看似很复杂的 Principled BSDF 呢？Blender guru 在[这个视频](https://www.youtube.com/watch?v=4H5W6C_Mbck&amp;t=1669s) 中分析了 Principle BSDF 的优势，包括：

- 默认处理 fresnel：渲染引擎自动处理物体边缘反光强于中心的光照效果
- 更合理的粗糙度：粗糙度增加，fresnel 相应减弱
- 金属和绝缘体的区分：金属反光有颜色，绝缘体没有
- 其他一些技术细节

## Principled BSDF 的参数

大致了解了 Principled BSDF 之后，我们再来熟悉一下它哪些看似眼花缭乱的参数。

作为材质 shader 的头牌，它的能耐一定不容小觑。下面这张官方文档中的图，十分直观地展现了 Principled BSDF 的能力：

![](https://docs.blender.org/manual/en/latest/_images/render_cycles_nodes_types_shaders_principled_example-1a.jpg)

图片左侧就是 BSDF 的主要参数，右侧展示了设置为 0~1 不同数值时材质的效果。

看似非常 overwhelming，对吧？别晕，我们仔细来观察一下，哪些行的最左侧和最右侧差别最大？

其实只有这几行：metallic，specular，roughness，transmission。

这个观察结果非常重要，它提示我们，BSDF 中最重要也是最常用的参数，其实只有几个：

- Base color
- Metallic：大多数情况只取 0 或 1，绝缘体为 0，金属为 1，不需要取中间状态
- Roughness
- Normal(bump mapping)

![](https://docs.blender.org/manual/en/2.80/_images/render_shader-nodes_shader_principled_example-1a.jpg)

为什么没有把 Specular（反光）列在里面？因为反光程度跟材质的关系很大。如果是金属，反光会较强，而非金属的反射较弱。所以一般不调 Specular，而是设置 Roughness 是 0 (金属) 还是 1 (非金属)。

更多的参数说明，可以参考[官方文档](https://docs.blender.org/manual/en/2.79/render/cycles/nodes/types/shaders/principled.html)。

## 如何使用 Principled BSDF？

接下来以 Suzanne 为例，看看如何使用 Principled BSDF 调节材质。

首先，寻找并下载自己喜欢的材质包(图片分辨率最好 2k 以上)，将材质包中不同的图片连接到节点的对应参数。一般来说，图片（从文件名可以判断）对应的参数如下：

- Base color 基础色 —— 连接到 BSDF 中的 basecolor
- Metallic 金属 —— 数据源为 Non-color data，连接到 BSDF 中的 metallic
- Roughness 粗糙度—— 数据源为 Non-color data，连接到 BSDF 中的 roughness
- Normal 法线 —— 数据源为 Non-color data，新建 Vector - normal map 节点，新建 Vector-bump node 节点，连接到 normal，再连接到 BSDF 中的 normal
- Height/displacement 等高线 —— 数据源为 Non-color data，连接到 BSDF 中的 metallic
- Ambient occlusion 环境光遮蔽—— Blender 已经自动处理了，不过在游戏引擎里需要用到

Node editor 的连线如下：

![9-SuzanneBSDF](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/9-SuzanneBSDF.jpg)

在图片节点上游，还有两个用于修改贴图位置的节点

- Vector-mapping 节点，连接 vector 到导入的素材
- Input-texture coordinates 节点，连接 uv 出口到 Mapping 的 Vector 入口

## Ref

[Principled BSDF — Blender Manual](https://docs.blender.org/manual/en/2.79/render/cycles/nodes/types/shaders/principled.html)

[Physics and Math of Shading](https://blog.selfshadow.com/publications/s2015-shading-course/hoffman/s2015_pbs_physics_math_slides.pdf)

[Bidirectional scattering distribution function - Wikiwand](https://www.wikiwand.com/en/Bidirectional_scattering_distribution_function)

[BSDF and BSSRDF - Udacity](https://classroom.udacity.com/courses/cs291/lessons/124106597/concepts/1765858280923)

[BSDF and BSSRDF - Interactive 3D Graphics - YouTube](https://www.youtube.com/watch?v=QxBhZjG5CaI)

[Blender 2.8 How to use PBR textures with principled bsdf Cycles/Eevee - YouTube](https://www.youtube.com/watch?v=a5KOdVft93E)

[How to Use Blender&apos;s New &quot;Ultimate&quot; Shader: The Principled BSDF - YouTube](https://www.youtube.com/watch?v=4H5W6C_Mbck)

[cycles - Add a transparent image on top of a material - Blender Stack Exchange](https://blender.stackexchange.com/questions/46424/add-a-transparent-image-on-top-of-a-material/46447#46447)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[一文看懂材质/纹理 Material, Texture, Shading, Shader 的区别]]></title>
            <link>https://tophci.com/posts/190608-material-texture-shaders</link>
            <guid isPermaLink="true">https://tophci.com/posts/190608-material-texture-shaders</guid>
            <category><![CDATA[OpenGL]]></category>
            <category><![CDATA[Material]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Shader]]></category>
            <category><![CDATA[Texture]]></category>
            <category><![CDATA[材质]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Fri, 07 Jun 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](https://i.pinimg.com/150x150/c7/dc/3f/c7dc3f37515f0b4d200d85392c523fc4.jpg)

在计算机图形学和三维设计中，有几个容易混淆的概念。今天我们来一举拿下。

## 概念整理

| 英文                                                           | 中文                                                                                                                   | 本质         | 释义                                                               |
| -------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------- | ------------ | ------------------------------------------------------------------ |
| [Material](https://www.wikiwand.com/en/Materials_system)       | 材质                                                                                                                   | 数据集       | 表现物体对光的交互，供渲染器读取的数据集，包括贴图纹理、光照算法等 |
| [Texture mapping](https://www.wikiwand.com/en/Texture_mapping) | [纹理贴图](&lt;[https://www.wikiwand.com/zh/%E6%9D%90%E8%B4%A8%E8%B4%B4%E5%9B%BE](https://www.wikiwand.com/zh/材质贴图)&gt;) | 图像映射规则 | 把存储在内存里的位图，通过 UV 坐标映射到渲染物体的表面             |
| Shading                                                        | 底纹、阴影                                                                                                             | 光影效果     | 根据表面法线、光照、视角等计算得出的光照结果                       |
| [Shader](https://www.wikiwand.com/en/Shader)                   | [着色器](&lt;[https://www.wikiwand.com/zh/%E7%9D%80%E8%89%B2%E5%99%A8](https://www.wikiwand.com/zh/着色器)&gt;)              | 程序         | 编写显卡渲染画面的算法来即时演算生成贴图的程序                     |
| [GLSL](https://www.wikiwand.com/zh/GLSL)                       |                                                                                                                        | 程序语言     | OpenGL 着色语言                                                    |

可以这么总结：

&gt; Material 是表现 Shading 的数据集。其他几个概念都是生成这一数据集的资源或者工具。

![MaterialConcepts](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/MaterialConcepts.png)

这么多概念，无非是为了完成一个共同目标：**用计算机表现真实可信的 Shading**。

Shading 是真实世界中的光影效果，它是由物体表面材质、灯光、观察者的视角等多种因素共同决定的。要实现计算机的模拟生成，是一个非常复杂的过程。不过它的原理大概可以简化为一个函数：

&gt; Intensity = Material (Light, Eye)

也就是说，光影的强度，是由 a.照在材质上的光 b.视线 共同决定的。

## 如何制造 Shading 效果？

万物看起来不尽相同，它们有各自的材质和纹理。

纹理（Texture）是什么？

&gt; Texture is pattern or image applied to a surface to change its color, shininess or just about any other part of its appearance. —— [Texture introduction - Udacity](https://classroom.udacity.com/courses/cs291/lessons/124106595/concepts/1703725970923#)

纹理就是一段有规律、可重复的图像。利用纹理，我们可以非常取巧地让三维物体看起来更真实。

### 方法一：贴上皮肤

贴图可以说是最简单的材质方法：

- 选定物体表面的某些区域
- 更改这个区域的一些属性(如颜色、反光度、透明度等)

那么 UV Mapping 又是什么？跟 Texture Mapping 有什么区别呢？

可以这么理解，Texture Mapping 是目标，把材质用一种规则映射到物体表面。而 UV Mapping 就是映射的规则。在这个规则中，给三维体每一个顶点增加两个值 U 和 V，它们记录了三维表面和二维表面的坐标对应关系：

![](http://img.viz.mobi/textureUV.jpg)

via [Texture UVs](https://classroom.udacity.com/courses/cs291/lessons/124106595/concepts/1703725990923)

有了映射关系，我们就可以分门别类地把影响光照的不同参数，都通过图片映射到三维几何体上。这些参数包括：

- Diffuse Map 漫反射：模拟一个发光物对物体的方向性影响(Directional Impact)。它是光照模型中最显著的组成部分

  ![](https://downloads.intercomcdn.com/i/o/52646545/49dbc08cd3840bc2d7654bdf/file-YYtlQsfLg4.jpg)

- Specular/Reflection Map 镜面：模拟有光泽物体上面出现的亮点，它的颜色更接近光而不是物体的颜色

  ![](https://downloads.intercomcdn.com/i/o/52646559/173c8c8c729e2912d8d8ff20/file-qPzs8jkFjw.jpg)

- Normal/Bump Map 法线：决定物体形状的垂直于它的法线向量，提供有关物体表面深度的细节。每一种颜色代表了不同的轴向，看起来类似这样：

  ![](https://downloads.intercomcdn.com/i/o/52646553/fe98859890182904757a311a/file-UzyMUgLevF.jpg)

- Displacement Map 位移：使用高度图将经过纹理化的表面的实际几何点位置，沿着表面法线根据保存在纹理中的数值进行移位。相比法线，位移贴图更多用于大规模的地形材质，包括悬崖、岩石等

  ![](https://downloads.intercomcdn.com/i/o/52646556/ccdbd16e6f1ead8d59ac7273/file-L7LoPDZQxz.jpg)

- Ambient Map 环境

- Gloss/Roughness Map 光泽

### 方法二：长出皮肤

贴上皮肤的方法虽好，但是局限也很明显。如果没有合适的图像，或者要创建真实世界中罕见的材质，皮肤就不好找了。这个时候需要让程序帮忙「生长」出新的皮肤。

我们把这种程序叫做 Shaders。

如果你还记得，Shading 是始终如一的终极目标，那么应该就能明白为什么实现这个目标的程序叫做 Shaders 了。

![](https://unity3d.com/sites/default/files/learn/shaderintro01.png)

它实际上是一个程序片段、一系列的指令，可以将三维 Mesh(网格)以指定方式与颜色、贴图等组合，完成复杂的计算输出（渲染器可读取的点和颜色的对应关系），会对屏幕上的每个像素同时下达命令。也就是说，代码必须根据像素在屏幕上的不同位置执行不同的操作。就像活字印刷，你的程序就像一个 function（函数），输入位置信息，输出颜色信息，当它编译完之后会以相当快的速度运行。

为什么 Shaders 运行特别快？因为它们常常运行在专门为并行处理（parallel processing）而设计的 GPU 上面。

最后一个问题，用什么来写 shaders 程序呢？答案是 OpenGL 着色器语言 (GLSL) 。GLSL 是用类 C 语言写成的，它为图形计算量身定制，包含一些针对向量和矩阵操作的有用特性。

---

好了，今天涉及到的概念实在太多了。希望对大家进入三维世界玩耍有所帮助。

## Ref

- [光照基础 - LearnOpenGL-CN](https://learnopengl-cn.readthedocs.io/zh/latest/02%20Lighting/02%20Basic%20Lighting/)
- [交互式 3D 图形 - Udacity](https://classroom.udacity.com/courses/cs291/)
- [贴图、纹理、材质的区别是什么？ - 知乎](https://www.zhihu.com/question/25745472)
- [【Shader 科普】贴图、纹理、材质的区别-腾讯游戏学院](https://gameinstitute.qq.com/community/detail/115074)
- [What are the different texture maps for? | Poliigon Help Center](https://help.poliigon.com/general-information/what-are-the-different-texture-maps-for)
- [法线贴图 - LearnOpenGL-CN](https://learnopengl-cn.readthedocs.io/zh/latest/05%20Advanced%20Lighting/04%20Normal%20Mapping/)
- [位移贴图 - Wikiwand](https://www.wikiwand.com/zh/%E4%BD%8D%E7%A7%BB%E8%B4%B4%E5%9B%BE)
- [A Gentle Introduction to Shaders - Unity](https://unity3d.com/es/learn/tutorials/topics/graphics/gentle-introduction-shaders)
- [GLSL - Wikiwand](https://www.wikiwand.com/zh/GLSL)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义08 - 几何体组合和布尔操作]]></title>
            <link>https://tophci.com/posts/190425-3d08-boolean-modifier</link>
            <guid isPermaLink="true">https://tophci.com/posts/190425-3d08-boolean-modifier</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Modeling]]></category>
            <category><![CDATA[Geometry]]></category>
            <category><![CDATA[Mirror]]></category>
            <category><![CDATA[Boolean]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 24 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

[三维制图讲义 01 - 欢迎来到三维世界](https://www.uegeek.com/190306-3d01-welcome-to-the-3d-world.html)

[三维制图讲义 02 - 三维制作流程](https://www.uegeek.com/190314-3d02-workflow.html)

[三维制图讲义 03 - 三维软件和 Blender 介绍](https://www.uegeek.com/190320-3d03-blender-intro.html)

[三维制图讲义 04 - 基础几何体](https://www.uegeek.com/190327-3d04-basic-geometry.html)

[三维制图讲义 05 - 几何体编辑：拉伸和环切](https://www.uegeek.com/190403-3d05-basic-geometry-edit.html)

[三维制图讲义 06 - 基础几何体练习](https://www.uegeek.com/190411-3d06-geometry-practice.html)

[三维制图讲义 07 - 基础几何体练习 2](https://www.uegeek.com/190418-3d07-basic-geometry.html)

(本系列为 00 在星海音乐学院的课程讲义)

在三维设计里的布尔操作，简单理解就是用两个或以上几何体的并集、差集、交集来建立新的几何体。

## 几何体组合

想象一下，如果有两个几何体 A 和 B，它们有一部分是重叠的。

当我们把 AB 合并到一起时，或者从 A 中减去 B，有或者取 AB 完全重叠的部分，就会产生下图的三种不同结果：

![booleanFig2](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/booleanFig2.gif)

- 并集：合并的操作，类似加法
- 差集：削减的操作，类似减法
- 交集：取共性的操作

再来做两个练习，想象一下如何由两种基本的几何体，做多步的组合，得出一个比较复杂的几何体：

![04fig62](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/04fig62.jpg)

![](http://img.viz.mobi/Making-a-complex-3D-model-form-basic-shapes-3.png)

## Blender 里的布尔操作

布尔操作是 Blender 里的常客，尤其在制作一些机械元件、零部件时。

在做布尔操作之前，需要先明确哪个是母体、哪个是运算体。这两个奇怪的名字是我自己起的，它们的意思是：

- 母体：用做基准的几何体，比如，我们要在一个立方体打一个贯通 z 轴的圆柱形的空洞，那么立方体就是被打洞的母体
- 运算体：用来做运算的几何体，还是上面的例子，用来做减法

![2019-04-25 11.45.43](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2019-04-25%2011.45.43.gif)

具体的操作步骤如上图所示：

- 选中母体
- 右侧 modifier 菜单中选择 Boolean
- 选择操作类型(并集/差集/交集)
- 用吸管选择运算体
- 可以继续调整母体和运算体的关系，**确认布尔运算需要点击 Apply 按钮**

这周的练习，请复习上周的 Mirror 修改器，结合刚才学习的 Boolean 修改器，完成下面这个几何体：

![blender_boolean](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/blender_boolean.jpg)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义08-Arduino声音应用2]]></title>
            <link>https://tophci.com/posts/190423-df08-arduino-sound-2</link>
            <guid isPermaLink="true">https://tophci.com/posts/190423-df08-arduino-sound-2</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[Fab]]></category>
            <category><![CDATA[Sound]]></category>
            <category><![CDATA[声音]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 22 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
[数字制造讲义 01-成为数字世界的建造者](https://www.uegeek.com/190305-df01-digital-fabrication.html)

[数字制造讲义 02-Arduino 入门](https://www.uegeek.com/190313-df02-arduino-intro.html)

[数字制造讲义 03-电路基础](https://www.uegeek.com/190319-df03-electronics-basic.html)

[数字制造讲义 04-负责输入和输出的智能元件](https://www.uegeek.com/190326-df04-input-and-output.html)

[数字制造讲义 05-软硬件数据通信](https://www.uegeek.com/190402-df05-communication.html)

[数字制造讲义 06-MIDI 和 OSC 数据传输练习](https://www.uegeek.com/190409-df06-midi-osc-practice.html)

[数字制造讲义 07-Arduino 声音应用](https://www.uegeek.com/190417-df07-arduino-sound.html)

(本系列为 00 在星海音乐学院的课程讲义)

## 回顾

还记得[上一周](https://www.uegeek.com/190417-df07-arduino-sound.html) 完成的三个练习吗：

- 让蜂鸣器发声
- 蜂鸣器发出交替的报警声
- 用按键触发声音

![2-w7-buttonBuzzer](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-w7-buttonBuzzer.jpg)

这一周我们继续来完善，做出一个简单的旋律控制器。

## 挑战 4：用电位计控制音高

既然蜂鸣器可以发出不同的音高，那我们可不可以用旋钮控制音高，做一个 mini 的极简控制器呢？

在之前[第四周的课程中](https://www.uegeek.com/190326-df04-input-and-output.html)，我们已经建立起比较完整的输入输出元件的概念。在项目练习时就可以慢慢养成习惯：在动手之前，先构想出输入部分是什么、输出部分是什么、从输入到输出要完成什么样的转换。

![](https://www.popcorn.org/portals/0/Images/what%20makes%20popcorn%20pop.jpg?ver=2015-09-18-093058-067)

这里，输入部分是电位计（的位置），输出部分是蜂鸣器(的音高)，中间的连接就是电位计的数值转换为蜂鸣器的音高。

接线部分，使用的元件包括：蜂鸣器，电位计。

![220px-Potentiometer](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/220px-Potentiometer.jpg)

当我们还是编程新手，每次要开始自己写代码时，容易两眼一抹黑，不知道该从哪里下手。

其实，每次写代码时，并不是直接打开 Arduino IDE 就开始噼里啪啦敲代码了。在这之前，我们需要现在脑子里构思这个代码**要做什么，怎么做到**。

大家会想一下，怎么把大象放进冰箱里呢？

![](http://cdc.tencent.com/wp-content/uploads/2011/03/banner12.jpg)

不要笑，这就是所谓的「算法」：做一件事情的步骤。

所以在还没有清晰思路的时候，我们可以先把程序要完成的大致步骤写下来：

- 需要用一个模拟端口读取电位计的数值
- 需要用一个数字（输出）端口给蜂鸣器发出指令
- 找一个办法让蜂鸣器发出不同音高
- 将电位计数值控制音高

接着，我们再想办法把每一个步骤都转化成对应的变量、语法、库。所以学会搜索和查看官方文档就很重要的了。

代码如下：

```c
// connect a potentiometer to pin A0

int buzzerPin=8;
int potPin=A0;

void setup() {
  pinMode(buzzerPin, OUTPUT);
}

void loop() {
  int freq = analogread(A0);
  freq = map (freq,0,1023,20,20000); //map the value read from the potentiometer into the audible range
  tone (buzzerPin,freq);
}
```

上面的代码中，最核心的一行，是把从电位计读取的模拟信号数值（范围是 0\~1023），映射到人耳可感知的声音的频率范围(20~20000)：`freq = map (freq,0,1023,20,20000);` 其中 map() 函数的作用就是数值映射。

## 挑战 5：播放连续音高

这个挑战一定会更吸引你：用蜂鸣器播放一段旋律。

这个挑战的难度主要在代码上，从这里开始，我们会开始接触并深入理解函数、循环、头文件、库等概念。

比较复杂的代码不可能一下子就能写出来。所以我们要经历一个重要的练习：看懂别人的代码。

我们在官方网站上找到教程 [Arduino - ToneMelody](https://www.arduino.cc/en/Tutorial/ToneMelody?from=Tutorial.Tone)。仔细研读它给出的代码，尤其是代码的注释：

```c
/*
  Melody

  Plays a melody

  circuit:
  - 8 ohm speaker on digital pin 8

  created 21 Jan 2010
  modified 30 Aug 2011
  by Tom Igoe

  This example code is in the public domain.

  http://www.arduino.cc/en/Tutorial/Tone
*/

#include &quot;pitches.h&quot;

// notes in the melody:
int melody[] = {
  NOTE_C4, NOTE_G3, NOTE_G3, NOTE_A3, NOTE_G3, 0, NOTE_B3, NOTE_C4
};

// note durations: 4 = quarter note, 8 = eighth note, etc.:
int noteDurations[] = {
  4, 8, 8, 4, 4, 4, 4, 4
};

void setup() {
  // iterate over the notes of the melody:
  for (int thisNote = 0; thisNote &lt; 8; thisNote++) {

    // to calculate the note duration, take one second divided by the note type.
    //e.g. quarter note = 1000 / 4, eighth note = 1000/8, etc.
    int noteDuration = 1000 / noteDurations[thisNote];
    tone(8, melody[thisNote], noteDuration);

    // to distinguish the notes, set a minimum time between them.
    // the note&apos;s duration + 30% seems to work well:
    int pauseBetweenNotes = noteDuration * 1.30;
    delay(pauseBetweenNotes);
    // stop the tone playing:
    noTone(8);
  }
}

void loop() {
  // no need to repeat the melody.
}
```

把注释部分全部替换成自己的理解，这个代码看起来就不再那么复杂和难懂了。但是这个过程一定要自己完成。

当在代码里看到不熟悉的函数，例如 `delay()` , `noTone()` ，就可以到官方文档中搜索并阅读，一般文档都会给出例子，这些例子就是最好的学习材料。

最后，留给大家的作业，是用两个压电片触发两段不同的旋律，大家动手试试吧！

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=p08632k4vzj&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Arduino Melody\_腾讯视频](https://v.qq.com/x/page/p08632k4vzj.html)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义07 - 基础几何体练习2]]></title>
            <link>https://tophci.com/posts/190418-3d07-basic-geometry</link>
            <guid isPermaLink="true">https://tophci.com/posts/190418-3d07-basic-geometry</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Modeling]]></category>
            <category><![CDATA[Geometry]]></category>
            <category><![CDATA[Mirror]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 17 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

[三维制图讲义 01 - 欢迎来到三维世界](https://www.uegeek.com/190306-3d01-welcome-to-the-3d-world.html)

[三维制图讲义 02 - 三维制作流程](https://www.uegeek.com/190314-3d02-workflow.html)

[三维制图讲义 03 - 三维软件和 Blender 介绍](https://www.uegeek.com/190320-3d03-blender-intro.html)

[三维制图讲义 04 - 基础几何体](https://www.uegeek.com/190327-3d04-basic-geometry.html)

[三维制图讲义 05 - 几何体编辑：拉伸和环切](https://www.uegeek.com/190403-3d05-basic-geometry-edit.html)

[三维制图讲义 06 - 基础几何体练习](https://www.uegeek.com/190411-3d06-geometry-practice.html)

[上一节课](https://www.uegeek.com/190411-3d06-geometry-practice.html)我们通过实际例子讲解了内插面和 Subdivision Surfaces 的应用。

![](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2019-04-11%2010.31.46.gif)

这周我们继续通过实际的例子来练习已经学过的知识，并且学习新的技巧。

## 练习一

这个练习我们做一个底部是球状的瓶子。

![1-w6-shape4](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/1-w6-shape4.jpg)

首先是观察造型。这个瓶子跟上周练习的牛奶瓶有近似的部分，也有不同的地方。它的底部是一个球体，颈部弯曲比较平滑，瓶口也是跟牛奶瓶类似的形状。

所以思路是用一个球体，拉伸部分的曲面作为颈部，然后将顶部拉伸变形为瓶口的形状。

### 选中部分曲面拉伸并用环切调整

选中部分曲面，可以用圈选操作来实现。也就是在面编辑模式下，按 c (circle 的意思)，然后按下鼠标开始移动，在圆圈之内的面就会被选中。

![2-bledner-circle-select](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/2-bledner-circle-select.gif)

选中要拉伸的部分(按 shift 选择可以取消选中)，按 e 拉伸。

然后需要将顶部的曲面整平：选中状态下按 s，然后按 z，按数字键 0。意思是沿 z 轴缩放，全部调整为 0(在同一个水平面)。

![](http://img.viz.mobi/2019-04-10%2000.12.46.gif)

接下来的部分，可以复习[上一周制作瓶子的技巧](https://www.uegeek.com/190411-3d06-geometry-practice.html)，也就是用环切、内插面、subdivision surfaces 等功能调整瓶子的形状了。

你也来试试吧！

## 练习二

![4-w6-shape5](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/4-w6-shape5.jpg)

这个练习我们会学到一个常用的修改器：镜射 / Mirror。

从字面上理解，就是生成对称的部分。

![](https://blenderartists.org/uploads/default/original/4X/5/e/e/5eeff56a1927f6ad94d6fff32fe7cb9229092444.gif)

因为大部分的物体都会有对称的部分，所以这个功能很实用，可以帮助我们节省（一半的）时间。

需要留意的是，Mirror modifier 可以对 x/y/z 轴分别做镜像，也可以选择几何体为镜像中心。

观察我们要做的几何体，它应该是以 z 轴为基准的上下镜像，所以我们在镜射的选项中要勾选 z 轴。

我们以中间为参考线，拉伸立方体形成中部的长方体，然后做两道环切，选中中间两个面拉伸两次，然后选择两个需要桥接的面，接合。

![](http://img.viz.mobi/2019-04-17%2021.31.04.gif)

这里要注意勾选上 Mirror modifier 的 Clipping 选项，它会帮助我们把镜像接缝处合并而不会留下重合的部分。

接下来的部分就简单了，对顶面拉伸然后缩放出一个较大的平面，然后向上拉伸，就得到了最终的形状。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义07-Arduino声音应用]]></title>
            <link>https://tophci.com/posts/190417-df07-arduino-sound</link>
            <guid isPermaLink="true">https://tophci.com/posts/190417-df07-arduino-sound</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[Fab]]></category>
            <category><![CDATA[Sound]]></category>
            <category><![CDATA[声音]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 16 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

&lt;!--more--&gt;

[数字制造讲义 01-成为数字世界的建造者](https://www.uegeek.com/190305-df01-digital-fabrication.html)

[数字制造讲义 02-Arduino 入门](https://www.uegeek.com/190313-df02-arduino-intro.html)

[数字制造讲义 03-电路基础](https://www.uegeek.com/190319-df03-electronics-basic.html)

[数字制造讲义 04-负责输入和输出的智能元件](https://www.uegeek.com/190326-df04-input-and-output.html)

[数字制造讲义 05-软硬件数据通信](https://www.uegeek.com/190402-df05-communication.html)

[数字制造讲义 06-MIDI 和 OSC 数据传输练习](https://www.uegeek.com/190409-df06-midi-osc-practice.html)

(本系列为 00 在星海音乐学院的课程讲义)

## 回顾

上一节课，我们练习如何在不同软硬件设备（手机、Max、Arduino、Ableton Live）中传输 MIDI 和 OSC 数据。这些都是用软件发出声音。

![](http://img.viz.mobi/Serial2Max.png)

这周我们继续通过实际的例子，学习如何用硬件发出声音。

## 挑战 1：让蜂鸣器发声

蜂鸣器是啥？

简单来说，它是一种一体化结构的电子讯响器，广泛应用于计算机、打印机、复印机、报警器、电子玩具、汽车电子设备、电话机、定时器等电子产品中，作发声器件。

蜂鸣器又可以分为有源蜂鸣器和无源蜂鸣器两种。

![](http://img.viz.mobi/buzzer1.jpg)

它们的区别是什么？要如何区分呢？

- 有源蜂鸣器内部集成有**震荡源**，只要提供直流电源就可以发声。无源蜂鸣器没有集成震荡源，需要接在音频输出电路中才可以发声。
- 无源蜂鸣器通的电路板通常是裸露的（如上图右），有源蜂鸣器的电路通常被黑胶覆盖
- 更精确的判断方法，用万用表电阻档 Rxl 档测试：用黑表笔接蜂鸣器 “+”引脚，红表笔在另一引脚上来回碰触，如果触发出咔、咔声的且电阻只有 8Ω（或 16Ω）的是无源蜂鸣器;如果能发出持续声音的，且电阻在几百欧以上的，是有源蜂鸣器。

下面我们用到的是无源蜂鸣器。

在电路中连接蜂鸣器不需要增加额外的电阻，所以接线十分简单。在 Arduino 程序中，使用 `tone` 函数来指定蜂鸣器的频率和持续时间：

```c
int buzzerPin = 9;

void setup() {
  pinMode(buzzerPin, OUTPUT);
}

void loop() {
  tone(buzzerPin, 440, 500);
  delay(1000);
}
```

## 挑战 2：蜂鸣器发出交替的报警声

完成挑战 1，我们已经基本理解蜂鸣器和 `tone()` 函数如何工作了。

在修改代码之前，建议在官方文档中查看 `tone()` 和 `noTone()` 的详细说明。

Syntax

&gt; tone(pin, frequency)
&gt; tone(pin, frequency, duration)

Parameters

&gt; pin: the pin on which to generate the tone
&gt; frequency: the frequency of the tone in hertz - unsigned int
&gt; duration: the duration of the tone in milliseconds (optional) - unsigned long

这个挑战只需要在代码上做一些调整，就可以实现双音高交替的报警器效果。

```c
int buzzerPin = 9;

void setup() {
  pinMode(buzzerPin, OUTPUT);
}

void loop() {
  tone(buzzerPin, 440, 500);
  delay(1000);
  tone(buzzerPin, 880, 500);
  delay(1000);
}
```

tone() 的第二个参数是音高的频率，我们把第一个音高设为 440，第二个音高设为 880，它们各持续 500 毫秒，中间有 1 秒的间隔。这样就形成了双音高的警报声。

## 挑战 3：用按键触发声音

现在我们有了可以发出不同音高的蜂鸣器。接着我们做一个按钮控制发声的小应用。

接线中使用的元件包括：蜂鸣器，按钮，220Ω 和 10kΩ 电阻。

![](http://img.viz.mobi/w7-buttonBuzzer.jpg)

代码如下：

```c
int button_pin = A0;
int buzzer_pin = 8;

void setup() {
  Serial.begin(9600);
  pinMode(button_pin, INPUT);
  pinMode(buzzer_pin, OUTPUT);
}

void loop() {
  int buttonState = digitalRead(button_pin);
  Serial.println(buttonState);
  if (buttonState == HIGH) {
    tone(8, 440, 200);
  }
  delay(50);
}
```

在上面的练习中，建议大家一定要动手画电路图、从 0 开始写代码，并且对代码加上必要的注释。这些训练能帮助我们更快熟悉和应用所学的知识。越早练习，才可以越早简化一些步骤。

在练习中一定会越到这样那样的错误，比如元件正负极一不小心就接反了，比如 Arduino 上传程序时总是出错，甚至有时候不正确的接线烧坏了元件。

错误是学习中最宝贵的机会，它提醒我们「此处有知识薄弱点」或者「步骤可完善的地方」。详细记录步骤，本身就是发现和解决问题很好的方法。把错误们储蓄起来，时不时拿出来复习，就能减少错误发生，提高熟练程度和准确度。

所以，多动手，早犯错，乐于在错误中寻找成长的路径，是可以伴随我们一路的好方法。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义06 - 基础几何体练习]]></title>
            <link>https://tophci.com/posts/190411-3d06-geometry-practice</link>
            <guid isPermaLink="true">https://tophci.com/posts/190411-3d06-geometry-practice</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Modeling]]></category>
            <category><![CDATA[Geometry]]></category>
            <category><![CDATA[Subdivision]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 10 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

[三维制图讲义 01 - 欢迎来到三维世界](https://www.uegeek.com/190306-3d01-welcome-to-the-3d-world.html)

[三维制图讲义 02 - 三维制作流程](https://www.uegeek.com/190314-3d02-workflow.html)

[三维制图讲义 03 - 三维软件和 Blender 介绍](https://www.uegeek.com/190320-3d03-blender-intro.html)

[三维制图讲义 04 - 基础几何体](https://www.uegeek.com/190327-3d04-basic-geometry.html)

[三维制图讲义 05 - 几何体编辑：拉伸和环切](https://www.uegeek.com/190403-3d05-basic-geometry-edit.html)

## 快速回顾

上一节课我们讲解了编辑模式下两个基本的操作：拉伸(Extrude)和环切(Loop Cut)。

什么是拉伸？就是拉着一个点/边/面走：

![](https://thumbs.gfycat.com/ThunderousHandyBeagle-size_restricted.gif)

操作顺序是：**选中物体，tab 键进入编辑模式，然后按 e 进入拉伸状态**。

![](https://raw.githubusercontent.com/a1studmuffin/SpaceshipGenerator/master/screenshots/step-by-step-animation.gif)

环切/Loop Cut 则帮助我们快速切分连续的边和面，获得更多的调节节点。使用快捷键的操作步骤：

- 选择物体，按 tab 进入编辑模式
- 按快捷键 ctrl+r，将鼠标移到物体上，会出现环状的指示线(如果想退出环切状态，可以鼠标右键或者按 esc 键)
- 移动鼠标到想要的面(指示线只会出现在中点连接线)
- 按下鼠标左键，确定 Loop Cut

![](https://blenderartists.org/uploads/default/original/4X/8/c/7/8c70cbda30e9fc2a6d84539be6508614756f8e12.gif)

## 细分曲面

随着对 Blender 操作的熟悉，我们会开始塑造更加复杂的形状。

形状复杂意味着什么？意味着我们需要对一个平面切分为多个子平面，然后调整这些子平面来获得更精确的控制。这就是细分曲面(sub-division)的概念。

下面我们连着看三个 Pixar in a Box 的视频，形象地理解一下什么是细分曲面。

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=e0527y4lxf3&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Introduction to subdivision surfaces](https://v.qq.com/x/page/e0527y4lxf3.html)

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=x0527k1vsqf&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[第三课 Split vs. average\_腾讯视频](https://v.qq.com/x/page/x0527k1vsqf.html)

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=u0859bf0qse&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Subdivision in 3D\_腾讯视频](https://v.qq.com/x/page/u0859bf0qse.html)

下面进入练习时间。通过 3 个练习，我们进一步巩固之前学过的操作，并且学习一些新的技能。

## 练习

### 内插面

这个练习我们会学习一个新的操作：内插面（insect faces）。

内插面就是在一个面里面切一块按比例缩小的面：

![](https://i.stack.imgur.com/ccGXJ.gif)

内插面的快捷键是 i。

![](http://img.viz.mobi/w6-shape1.jpg)

上面的几何体的操作顺序是：

- 新建立方体
- 按 tab 键进入编辑模式，按 3 键进入面选择模式，选中顶部的面
- 按 i 然后移动鼠标，调整内插面的大小，然后点鼠标左键确定
- 按 e 沿 z 轴拉伸刚才新建的内插面
- 按 i 再建一个内插面
- 按 e 沿 z 轴反方向拉伸，做出内凹的形状

### 拉伸+缩放 vs 缩放+拉伸

![](http://img.viz.mobi/w6-shape2.jpg)

这个练习帮助我们理解 `先拉伸后缩放` 和 `先缩放后拉伸` 的区别。

操作顺序是：

- 新建立方体
- 按 tab 键进入编辑模式，选中顶部的面，按 g 然后沿 z 轴压扁 (也可以不进入编辑模式，直接缩放立方体）
- 选中顶部的面，按 i 建一个内插面
- 按 e 拉伸内插面，拉伸完毕后，按 s 缩小内插面

![](http://img.viz.mobi/2019-04-11%2010.25.56.gif)

- 按 i 再建一个内插面，然后按 e 拉伸出中间长长的柱体
- 顶部的面按 e 然后 s，放大
- 按 e 拉伸，然后按 s 放大这个面，最后再按 e 拉伸，完成柱体

![](http://img.viz.mobi/2019-04-11%2010.28.05.gif)

- 在四个侧面，选中面然后做内插面，向内拉伸内插面

### 使用 Subdivision Surfaces 修改器

![](http://img.viz.mobi/w6-shape3.jpg)

- 新建圆柱体，按 tab 键进入编辑模式，选中顶部的面
- 按 e 沿 z 轴拉伸，然后按 s 缩小口径
- 再按 e 向上拉伸，然后 e → s 放大，拉出瓶口的底部
- 再按 e 向上拉伸出瓶口，然后建内插面，再把内插面向内拉伸形成瓶口的凹陷

![](http://img.viz.mobi/2019-04-11%2010.31.46.gif)

添加 Subdivision Surfaces 的操作如下：

首先添加修改器(Modifier) 表面细分 / Subdivision Surface，将视图的细分值改为 2。

![](http://img.viz.mobi/blender-subSurface.jpg)

然后添加环切，平整细分表面的边缘：

![](http://img.viz.mobi/2019-04-11%2010.45.38.gif)

仔细调整各边缘的弧度，并且调整瓶颈的形状(添加、选中环切线并缩放)，最后得到瓶子。

![](http://img.viz.mobi/w6-shape3.jpg)

最后，可以选择 物体-光滑着色，把几何体的表面变得更光滑一些。

![](http://img.viz.mobi/blender-smoothshading.jpg)

快去练习吧~
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义06-MIDI 和 OSC 数据传输练习]]></title>
            <link>https://tophci.com/posts/190409-df06-midi-osc-practice</link>
            <guid isPermaLink="true">https://tophci.com/posts/190409-df06-midi-osc-practice</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[Fab]]></category>
            <category><![CDATA[通信]]></category>
            <category><![CDATA[MIDI]]></category>
            <category><![CDATA[OSC]]></category>
            <category><![CDATA[Max]]></category>
            <category><![CDATA[Ableton Live]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 08 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

&lt;!--more--&gt;

[数字制造讲义 01-成为数字世界的建造者](https://www.uegeek.com/190305-df01-digital-fabrication.html)
[数字制造讲义 02-Arduino 入门](https://www.uegeek.com/190313-df02-arduino-intro.html)
[数字制造讲义 03-电路基础](https://www.uegeek.com/190319-df03-electronics-basic.html)
[数字制造讲义 04-负责输入和输出的智能元件](https://www.uegeek.com/190326-df04-input-and-output.html)
[数字制造讲义 05-软硬件数据通信](https://www.uegeek.com/190402-df05-communication.html)

## 回顾

上一节课，我们学习了有哪些方式把不同的软硬件连接在一起，让它们之间可以传递数据，完成一定的功能。

有线的方式主要使用数据线进行串口通信。在远距离传输的场景下，则常使用互联网（广域网/局域网）。基于无线的连接主要包括 Wifi 和蓝牙。

传输音乐数据最常用的协议包括 MIDI 和 OSC。OSC 的分辨率更高、可传递的参数更丰富，它使用 UDP / IP 和以太网通过 Internet 和局域网传输。

![](http://img.viz.mobi/MIDIvsOSC.jpg)

OSC 已广泛应用于音乐表演、机器人、视频性能接口、分布式音乐系统和进程间通信等领域，在实验音乐控制器中更是必不可少。

下面我们就来实际操作几个例子。

## Mobile MIDI 2 Max

从移动端发送 MIDI 数据给其他设备，可以使用类似 KnobLab 的 APP，它支持多种传输方式：

![](http://img.viz.mobi/KnobLab.jpg)

首先下载 KnobLab App。

然后我们在 Max 里面建一个简单的 patch，接收 KnobLab 发过来的 midi 数据，然后传给键盘并且 makenote：

![](http://img.viz.mobi/KnobLab2Max.jpg)

打开 Setting 里面 MaxOS 的 Wifi 连接说明：

![](http://img.viz.mobi/KnobLabWifiConnection.jpg)

打开电脑里的 Audio MIDI Setup，打开 MIDI Studio，点工具栏上的网络图标:

![](http://img.viz.mobi/MIDIStudio.jpg)

打开网络设置窗口，在 My Sessions 下面勾选 Session 1，然后在 Directory 里面可以看到自己的手机(电脑和手机需要在同一个 Wifi 网络下)。然后点 Connect。

![](http://img.viz.mobi/MIDINetworkSetup.jpg)

这时候已经可以用 KnobLab 操作，向 Max 发送 MIDI 数据了。在 Max 里面，要注意选择 midiin 的来源，双击对象就可以看到 Session 1 的选项，选择后，Max 才开始接收数据。

在 KnobLab 的主界面上转动旋钮，Max 就会发出对应的 MIDI 音高。

## Mobile OSC 2 Max

在触摸设备如 iOS 上，用 [TouchOSC](https://hexler.net/software/touchosc) 操作复杂的 MIDI Controller 非常方便。

![](https://hexler.net/gfx/_software/touchosc-11.png)

首先，在移动端下载 TouchOSC，在桌面端[下载编辑器](https://hexler.net/software/touchosc)。

在编辑器里面可以创建自定义的操作面板。我们也可以直接使用 TouchOSC 里面预设的面板。在设置页面的 Layout 项，点击进去即可选择面板。

连接的关键是设置 TouchOSC 的 IP 地址和输入输出端口。

确保电脑和手机处于同一个 Wifi 网络。然后我们查询电脑的 IP 地址。打开 Terminal，Windows 系统使用命令 ipconfig，MacOS 系统使用命令 ifconfig，回车后可以看到一长串的数据，仔细找到其中以 192.168 开头的局域网 IP 地址：

```bash
en1: flags=8863&lt;UP,BROADCAST,SMART,RUNNING,SIMPLEX,MULTICAST&gt; mtu 1500
	ether 24:f6:77:08:87:04
	inet6 fe80::81c:2c9b:50cf:8e39%en1 prefixlen 64 secured scopeid 0x7
	inet 192.168.xx.xxx netmask 0xffffff00 broadcast 192.168.xxx.xxx
	nd6 options=201&lt;PERFORMNUD,DAD&gt;
	media: autoselect
	status: active
```

broadcast 后面的 192.168.xxx.xxx 就是需要填入 TouchOSC 设置中的 IP 地址。

打开手机 APP 进入设置页面，在 Host 里面填入上面的的 IP 地址。

![](https://guide.lightform.com/hc/article_attachments/360018787213/IMG_8577.png)

设置输入端口 Port(outgoing) 为某个数值，如 8800。

接下来就可以在 Max/MSP 里面接收和发送 OSC 数据了。因为 OSC 通过 UDP 协议传输，所以使用 `udpsend` 和 `udpreceive` 对象：

![](http://img.viz.mobi/touchOSC2Max.jpg)

`udpreceive` 的 port 参数应该跟 TouchOSC 设置的输出端口一致，如上图的 8800。

Max 接收到数据后，可以看到 OSC 的数据格式类似文件路径 URI：`/{序号}/{参数名} {参数值}`。

这样我们就把手机和电脑连接起来。只要将 TouchOSC 里面所有的 controller 都映射到 Max 中，就可以在手机上实现效果丰富的个性化控制。

## Arduino 2 Max

Arduino 和 Max 也可以方便地勾搭上。我们试着做一个旋钮控制音高的小应用。

首先搭出最简单的电位计电路。电位计正极接 5V 端口，负极接 GND，数据脚接 A0 端口：

![](http://img.viz.mobi/potentiometer2midi.jpg)

Arduino 中的代码也非常简单：

```c++
int sensor_pin = A0;
int knobValue = 0;

void setup()
{
  Serial.begin(9600); // open the arduino serial port
}

void loop()
{
  knobValue = analogRead(sensor_pin);
  Serial.println(knobValue);
  delay(500); // pause
}
```

电路和 Arduino 发送数据已经准备好。接着我们处理 Max 接收数据的逻辑。

![](http://img.viz.mobi/Serial2Max.png)

咦？为什么这么多接线？

其实并没有看上去复杂。

我们转动电位计，打开 Arduino 的串口监视器查看是否可以正常读数。然后再观察 Max 中有哪些数据进来。

Max 中使用 `serial` 对象读取串口数据，不过它输出的是未经处理的原始格式。如果用 print 对象打印出来，会看到接收的数据会是以下格式：

```
13
54
10
35
```

第一行的 13 和第三行的 10 都是标记，第二行和第四行才是串口数据，但是它是 ASCII 码，而不是直接可以使用的数字。所以还需要用 `itoa` 和 `fromsymbol` 对象将 ASCII 码转换为数字。因为电位计发送的模拟数据范围是 0~1023，所以接着我们用一个 `scale` 把数据映射到 MIDI 的数据范围 0~127，这样就可以发出音高了。

## Bonus

Arduino 能不能直接跟 Ableton 连接呢？当然是可以的。

Ableton 已经提供了 Package，跟 Arduino 连接后，可以做好多脑洞大开的酷炫应用：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=h0190wbyt6w&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Max for Live Connection Kit\_腾讯视频](https://v.qq.com/x/page/h0190wbyt6w.html)

具体教程，请查看：[Ableton Live 连接 Arduino 教程](https://www.uegeek.com/190408-Ableton-Arduino.html)。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[Ableton Live 连接 Arduino 教程]]></title>
            <link>https://tophci.com/posts/190408-Ableton-Arduino</link>
            <guid isPermaLink="true">https://tophci.com/posts/190408-Ableton-Arduino</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[Music]]></category>
            <category><![CDATA[Ableton Live]]></category>
            <category><![CDATA[MIDI]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Sun, 07 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](https://cdn-resources.ableton.com/resources/filer_thumbnails/fd/d4/fdd4707d-fbcb-441a-a07d-f6e58c9e717d/connkit_artwork_1000x1000.jpg__600x600_q85_crop_subsampling-2_upscale.jpg)

&lt;!--more--&gt;

你有没有想过，用 Arduino 做一个简单的 MIDI controller，控制 Ableton Live 中的参数？

如果想实现两者的连接，以前的解决方案比较复杂，需要基于 Max/MSP，用 [Maxuino](http://www.maxuino.org/) 实现，还需要在 Arduino 上安装对应的固件。

有没有更简单的方法呢？

## Connection Kit

好消息是，Ableton 已经提供了官方的 [Connection Kit](https://www.ableton.com/en/packs/connection-kit/)，其中包含了与流行的外接设备的连接工具如 Arduino、OSC、LEGO Mindstorms 等。

介绍视频真是帅炸了~

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=h0190wbyt6w&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Max for Live Connection Kit\_腾讯视频](https://v.qq.com/x/page/h0190wbyt6w.html)

如果你已经购买了 Ableton Live 10 Suit，可以在[官网直接下载这个 Pack](https://www.ableton.com/en/packs/connection-kit/)。如果不能直接下载，这个 Pack 的源文件也可以在 github 找到：[Ableton/m4l-connection-kit: Max for Live Connection Kit](https://github.com/Ableton/m4l-connection-kit)。下载后，将文件夹复制到 Documents-Ableton-Third-Party Packs。打开软件后，就可以在左侧找到 Arduino.amxd：

![](http://img.viz.mobi/Ableton-connection-kit-pack.jpg)

## 初始化

开始连接之前，让我们看看[使用说明](https://github.com/Ableton/m4l-connection-kit/tree/master/Arduino)。

&gt; The Arduino Max4Live device connects an Arduino Uno to Live using its serial port via USB and allows access to its analog inputs as well as its digital GPIOs. The device enables you to receive sensor data like switches, potentiometers or light-dependent resistors as well as sending Live parameter values to LEDs or servo motors. So far you may only connect sensors and other periphals to it directly as we do not yet support I2Cs and other periphals via the Serial Periphal Interface (SPI).

目前应该只支持 Uno 板，由 USB 串口连接。

因为 Max4Live 需要特定的固件支持，所以我们先上传程序到 Arduino 板。上传的程序在 Arduino IDE 里面就有：File-&gt;Examples-&gt;Firmata-&gt;StandardFirmata。打开文件后(至少是 2.5 版本)，上传到板子。

接着我们可以在 Ableton 里面编辑一段 clip，双击 Arduino.amxd 加入到 device viewer 里。

![](http://img.viz.mobi/addArduino2Ableton.jpg)

## 连接测试电路

回到 Arduino，接一个最简单的电路。找一个电位计，正极接 Uno 板的 5V 口，负极接 GND，中间的信号接 A0 模拟端口。

![](http://img.viz.mobi/potentiometer2arduino.png)

上传以下程序，然后打开串口监视器，查看是否可以正常读取旋钮的值：

```c
void setup() {
  // initialize serial communication at 9600 bits per second:
  Serial.begin(9600);
}

// the loop routine runs over and over again forever:
void loop() {
  // read the input on analog pin 0:
  int sensorValue = analogRead(A0);
  // print out the value you read:
  Serial.println(sensorValue);
  delay(20);        // delay in between reads for stability
}
```

成功后，关闭串口监视器。

## Ableton Mapping

然后到 Ableton 中，选择 port 为 usbmodemxxxx。切换到 Analog tab，点 A0 右侧的 Map 按钮，选择已经编辑的那个 track 的 Track Volume。

做好这一步映射后，可以看到 A0 旁边小小的蓝色指示条已经开始跳动。旋转电位计，会看到 Track 的音量产生了变化。

可是，这里的变化不太符合我们的预期：扭动旋钮停止后，音量还是会变化，甚至产生随机的爆音。

这是因为电位计产生了抖动。再打开 Arduino 串口监视器，可以观察到 A0 端口接收到的不是平滑的值，而是夹杂着很多不稳定的波动值。

![](http://img.viz.mobi/ArduinoSerialMonitor.png)

### 消抖处理

最简单的办法是在 kit 里面设置 Smooth 的值：

![](http://img.viz.mobi/ableton-arduino-smooth.png)

但是这样做，误差会较大。我们可以进一步尝试在代码里消抖，或者在电路中加入电容消抖。可以参考这篇文章 [Smooth Potentiometer Input](https://www.instructables.com/id/Smooth-Potentiometer-Input/)。

进一步的消抖还需要参考一些资料继续研究。

- [Debouncing a potentiometer](http://forum.arduino.cc/index.php?topic=216582.0)
- [Writing an analog pot debounce as a function](https://forum.arduino.cc/index.php?topic=210348.0)
- [Debounce a Potentiometer?](https://forum.arduino.cc/index.php?topic=75946.0)
- [arduino 按钮传感器常见的几种消抖方法 - 简书](https://www.jianshu.com/p/99d861de03e0)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义05 - 几何体编辑：拉伸和环切]]></title>
            <link>https://tophci.com/posts/190403-3d05-basic-geometry-edit</link>
            <guid isPermaLink="true">https://tophci.com/posts/190403-3d05-basic-geometry-edit</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Modeling]]></category>
            <category><![CDATA[Geometry]]></category>
            <category><![CDATA[Loop Cut]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 02 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

[三维制图讲义 01 - 欢迎来到三维世界](https://www.uegeek.com/190306-3d01-welcome-to-the-3d-world.html)

[三维制图讲义 02 - 三维制作流程](https://www.uegeek.com/190314-3d02-workflow.html)

[三维制图讲义 03 - 三维软件和 Blender 介绍](https://www.uegeek.com/190320-3d03-blender-intro.html)

[三维制图讲义 04 - 基础几何体](https://www.uegeek.com/190327-3d04-basic-geometry.html)

## 快速回顾

上一节课我们练习了编辑模式下，点线面的切换和移动、旋转、缩放。

选中几何体后，按快捷键 Tab 进入编辑模式。这时候按键盘 1、2、3 键（或者点界面中模式选择右边的三个图标），可以切换为 点选择、边选择、面选择状态。

将点、线、面选择，跟位移、旋转、缩放结合起来练习：

- 切换到点选择模式（编辑模式下按 1 键），选中点，进行移动（G）(包括沿轴的操作)
- 切换到边选择模式（编辑模式下按 2 键），选中多条边，进行旋转（R）(包括沿轴的操作)
- 切换到面选择模式（编辑模式下按 3 键），选中多个面，进行缩放（S）(包括沿轴的操作)

![](http://img.viz.mobi/Blender_edit.jpg)

## 拉伸 Extrude

拉伸(Extrude)是重要的基本操作，也是这一节课的练习重点。

什么是拉伸？就是拉着一个点/边/面走：

![](https://thumbs.gfycat.com/ThunderousHandyBeagle-size_restricted.gif)

拉伸操作需要在编辑模式下进行。

操作顺序是：**选中物体，tab 键进入编辑模式，然后按 e 进入拉伸状态**。

你可能会问，拉伸 (e) 跟移动 (g) 有什么不同呢？

注意观察上面的动画，在拉伸时，是在原有面的基础上，增加了一个面，然后沿着这个面的四条边移动。而单纯的移动（选中点线面后按 g），则不会增加面。

拉伸为什么重要？

它是三维物体成型最基本的方式之一。甚至只用 extrude 这个基本操作加上点/边/面的 TRS，就可以建出复杂的模型：

![](https://raw.githubusercontent.com/a1studmuffin/SpaceshipGenerator/master/screenshots/step-by-step-animation.gif)

## 环切 Loop Cut

环切/Loop Cut 功能可以说是金手指级的作弊型基础功能。它帮助我们快速切分连续的边和面，获得更多的调节节点。

比如，把一个圆柱体修改成复杂一点的造型，借助环切可以秒完成：

![](https://www.plejadium.de/wp-content/uploads/2015/05/blender-loop-cut-and-slide.gif)

环切也需要在编辑模式中使用。可以在左侧工具栏中找到：

![](http://img.viz.mobi/blander-loopcup-menu.jpg)

使用快捷键的操作步骤：

- 选择物体，按 tab 进入编辑模式
- 按快捷键 ctrl+r，将鼠标移到物体上，会出现环状的指示线(如果想退出环切状态，可以鼠标右键或者按 esc 键)
- 移动鼠标到想要的面(指示线只会出现在中点连接线)
- 按下鼠标左键，确定 Loop Cut

![](https://blenderartists.org/uploads/default/original/4X/8/c/7/8c70cbda30e9fc2a6d84539be6508614756f8e12.gif)

然后问题来了：

&gt; 如果移动环的时候，没有移到对的位置，就不小心点了鼠标左键，环就不动了，怎么办？

没事，毕竟是作弊级别的常用功能，就算已经切了，也还是可以调整位置。

- 先选中要调整的 Loop Cut：按住 alt 键点左键，可以选中连续的边或者面
- 然后按 g，进行移动

咦？这时候的移动没有限制轴线，一动 Loop Cut 就歪了……

![](http://img.viz.mobi/2019-04-02%2011.47.39.gif)

&gt; 如果想沿原来的边缘移动 Loop cut，怎么办？

可以在选择 loop 以后，按两次 g，然后移动到合适的位置。

![](http://img.viz.mobi/blender-loopcut-gg.gif)

&gt; 问题 2：如果想一次性添加多个环切怎么办？

Easy Peasy

在按 ctrl+r 后，移动到合适的面上，然后**滚动鼠标中键或者按对应的数字键**，就可以指定切割的数量了。

## 组合练习

好了，目前为止，Blender 的基础大招你都已经学过了：

- 调整视图和切换正/侧/顶视图
- 进入编辑模式
- 移动（g）/旋转（r）/缩放（s）物体或者点/线/面
- 拉伸(e)
- 环切(ctrl+r)

可以说，你已经可以造出 90% 的基础造型。下面就进入探索和练习时间吧！

![](https://blenderartists.org/uploads/default/original/4X/6/9/e/69ec27d84baf0f5f30d46aa956887320da4d182f.gif)

![](https://polygoniq.com/sites/default/files/2018-10/03C_d.gif)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义05-软硬件数据通信]]></title>
            <link>https://tophci.com/posts/190402-df05-communication</link>
            <guid isPermaLink="true">https://tophci.com/posts/190402-df05-communication</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[电路]]></category>
            <category><![CDATA[Fab]]></category>
            <category><![CDATA[通信]]></category>
            <category><![CDATA[MIDI]]></category>
            <category><![CDATA[OSC]]></category>
            <category><![CDATA[Max]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 01 Apr 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

&lt;!--more--&gt;

[数字制造讲义 01-成为数字世界的建造者](https://www.uegeek.com/190305-df01-digital-fabrication.html)

[数字制造讲义 02-Arduino 入门](https://www.uegeek.com/190313-df02-arduino-intro.html)

[数字制造讲义 03-电路基础](https://www.uegeek.com/190319-df03-electronics-basic.html)

[数字制造讲义 04-负责输入和输出的智能元件](https://www.uegeek.com/190326-df04-input-and-output.html)

## Connect Everything

![](https://target.scene7.com/is/image/Target/GUEST_35ece802-7780-4243-b78a-c94cc6f7f682?wid=488&amp;hei=488&amp;fmt=pjpeg)

玩过乐高的同学都知道，乐高积木非常容易上手，只需要把积木拼在一起——它们总是能拼在一起，不管是什么大小和形状，所以它成为了经典的儿童益智玩具。

在我们制造东西的时候，目标也是把不同的物体和元件拼接成一个完整的、具有一定功能的物品。但是我们会面对一个比乐高困难得多的问题：不同的元件出身和禀赋可能天差地别，想要把它们连接到一起，得想出各种办法。

比如，我想做一个薯片罐头打击乐器，敲击罐头，就可以让 iPad 里面的乐器发出对应的声响。

![](https://cdn.instructables.com/FO1/LDW4/IUSLP51T/FO1LDW4IUSLP51T.LARGE.jpg?auto=webp&amp;width=700)

想想看，我们要把哪些东西连接起来？

我们要连接敲击的平面和 iPad 中的 APP。可是并不存在这样的接口。怎么办？

一段电线连不起来，那我们用两段。可以先用 Arduino 帮我们收集敲击的信号，然后作为中转，再传给 APP。

可是， Arduino 怎么连接 iPad 呢？

你可能会说，可以用数据线呀！没错，不过，要用什么样的数据线呢？这取决于我们要传输什么样的数据。我们想要控制 APP 中的乐器，就需要包含 MIDI 信息的数据，于是要用 MIDI 数据线来传递。

所以，我们的问题拆分成了好几个：

- 如何连接敲击面和 Arduino (电路)
- 如何连接 Arduino 和 iPad(一头必需是 iPad 支持的端口，如 type-c)
- 如何从 Arduino 传输 MIDI 数据到 APP(一头必需是 MIDI 数据线)

## 条条小路通骡马

这节课我们学习有哪些方式把不同的东西连接在一起，让它们之间可以传递数据，完成一定的功能。

硬件和硬件、软件和硬件、软件和软件的数据通信，主要可以分为两大类型：有线和无线。

想要跟硬件沟通，需要用某种它能听懂的「语言」。但是这种语言在人类看来简直像天书，它是机器专用的代码——汇编语言（assembly language），是一种用于电子计算机、微处理器、微控制器，或其他可编程器件的低级语言。

### 有线

串口通信(Serial Communication)， 是最常见的通信方式。它是指外接设备和计算机之间，通过数据信号线、地线、控制线等，按位进行传输数据的一种通讯方式。 这种通信方式使用的数据线少，在远距离通信中可以节约通信成本，但其传输速度比并行传输低。

串口的概念跟并口相对应：

![](https://upload.wikimedia.org/wikipedia/commons/a/a6/Parallel_and_Serial_Transmission.gif)

因为要跟机器直接打交道的语言（低级别的语言）比较难掌握，所以有许多更高级别的语言(近似人类语言)的库可以帮助我们通过串口跟机器沟通，例如 Python 语言的 [pySerial](https://github.com/pyserial/pyserial)。

Arduino 也是靠串口跟计算机通信。

![](https://cdn.sparkfun.com/assets/learn_tutorials/1/8/1/Arduino_IDE_serial_port.png)

在我们上传程序到板子之前，就需要选择用哪个串口通信。在 Port 选项上方，还有 Serial Monitor 工具（IDE 右上角放大镜图标也可以），我们常常在调试程序时，打开串口监视器并查看里面的数据。

那么，Arduino 用什么数据线跟电脑的串口连接呢？

最常见就是 USB 数据线了。USB 是 Universal Serial BUS 的缩写，从名字可见其野心(不过讲真，数据接口类型太多，真的让人头疼死……)

来认认 USB 接口们，哪些是平常经常会见到的：

![](http://www.l-com.com/images/usb-tutorial_connectors.gif)

备受关注的 USB 4.0 就要来了，但是现实比较骨干，我们仍然需要跟各种各样的数据接口和数据线打交道，尤其是音频和视频的数据线，还远未到 USB 一统天下的时候。

这张图汇总了大部分音视频数据接口的长相，总有一款适合你：

![](http://www.conceptdraw.com/How-To-Guide/picture/Vector-stencils--Audio-video-connectors.png)

USB 没有办法替代这么多的数据接口和数据线，其中很重要的一个原因是连接距离。音视频的连接长度常常跨越几米甚至上百米，这时候 USB 就傻眼了。

在远距离传输的场景下，互联网（广域网/局域网）就可以大显身手。在有线互联网中，我们通过 IP 地址访问和联通计算机。

IPv4 地址分为 A、B、C、D、E 五类，出去特殊作用的 D、E 两类，剩下的 A、B、C 三类地址是常见的 IP 地址段。A 类地址的容量最大，可以容纳 16,777,214 个主机，B 类地址可以容纳 65,534 个主机，C 类地址可以容纳 254 个主机。

- A 类地址：10.0.0.0--10.255.255.255
- B 类地址：172.16.0.0--172.31.255.255
- C 类地址：192.168.0.0--192.168.255.255

### 无线

基于无线的连接越来越普遍，也越来越重要了。

为啥？

![](http://debangw.com/img/aHR0cDovL2ltZzIuaW1ndG4uYmRpbWcuY29tL2l0L3U9Mzg3NDAzNjc4OSwxODk1NTY0MjI1JmZtPTI2JmdwPTAuanBn.jpg)

尤其在制作互动装置时，我们不希望被太多连线所缠绕和局限活动范围，所以需要借助无线连接的方式。

而且，多种多样的无线数据传输，也是 IOT(Internet of Things 物联网)的基础设施。

![](https://taazaa.com/wp-content/uploads/2017/05/IoT-3.3.png)

那么蓝牙呢？蓝牙的应用也越来越普遍了。

蓝牙是一种点对点的通信方式，主要目的是服务移动设备。蓝牙的功耗以及成本比 wifi 低一些，但是传输距离很短，一般用于近距离设备的通信，例如耳机和手机。

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=a05428d2mlx&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[科技情报局：NFC、蓝牙和 WiFi 有什么区别？\_腾讯视频](https://v.qq.com/x/page/a05428d2mlx.html)

除了 wifi 和蓝牙，还有 ZigBee、RF、WiMax 等等传输方式，我们不太会接触到，这里就略过了。

## 传输音乐数据

音乐和乐器是我们不变的主题。那么我们要深入了解一下如何传输音乐相关的数据。

### MIDI

音乐数字接口（Musical Instrument Digital Interface，简称 MIDI ）是一个工业标准的电子通讯协议，为电子乐器等演奏装置（如合成器）定义各种音符或弹奏码，让电子乐器、电脑、手机或其它的舞台演出配备彼此连接，调整和同步，可以即时交换音乐数据。 MIDI 不传送声音，只传送包括音调和音乐强度的数据、音量、颤音和相位等参数，还有设定节奏的时钟信号。在不同的电脑上，输出的声音也因音源器不同而有差异。

回顾 MIDI 的历史，简直就像回顾数字时代的陈年往事：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=n08561s7vij&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[WHAT IS MIDI 什么是 MIDI\_腾讯视频](https://v.qq.com/x/page/n08561s7vij.html)

MIDI 1.0 于 1983 年 8 月发布。35 年过去了，MIDI 终于在今年 1 月迎来了 2.0 版本。

![](https://static.bhphotovideo.com/explora/sites/default/files/4_112.jpg)

当然，现阶段我们常用的还是 5 脚的 MIDI 数据线，和 0~127 的整数型数字：

![](https://cdn.sparkfun.com/r/600-600/assets/learn_tutorials/4/0/8/midi-cable.jpg)

| **MIDI Cable Wiring** |                        |                      |
| --------------------- | ---------------------- | -------------------- |
| **First Connector**   | **Cable**              | **Second Connector** |
| Pin 1                 | No Connection          | Pin 1                |
| Pin 2                 | Shield                 | Pin 2                |
| Pin 3                 | No Connection          | Pin 3                |
| Pin 4                 | Voltage Reference Line | Pin 4                |
| Pin 5                 | Data Line              | Pin 5                |

课上演示的从 MAX 发送 MIDI 数据给 Ableton，记得自己动手试一试哦！

从移动端发送 MIDI 数据给其他设备，可以使用类似 KnobLab 的 APP，它支持多种传输方式：

![](http://img.viz.mobi/KnobLab.jpg)

### OSC

[OSC](http://opensoundcontrol.org/)（Open Sound Control）是用于连接声音合成器、计算机和其他多媒体设备的协议，用于辅助音乐表演或节目控制之类（共享音乐表现数据如手势、参数和音符序列）的目的。OSC 的优势包括互动性，准确性，灵活性等。

来听听看 OSC 的作者之一 Matt Wright 是如何介绍它的：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=f08563i3n66&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Open Sound Control OSC intro\_腾讯视频](https://v.qq.com/x/page/f08563i3n66.html)

OSC 常常用来替代 MIDI，因为它的分辨率更高、可传递的参数更丰富。OSC 消息使用 UDP / IP 和以太网通过 Internet 和局域网传输。

![](http://img.viz.mobi/MIDIvsOSC.jpg)

OSC 已广泛应用于音乐表演、机器人、视频性能接口、分布式音乐系统和进程间通信等领域，在实验音乐控制器中更是必不可少。

那么怎么使用 OSC 传输数据呢？

在触摸设备如 iOS 上，用 [TouchOSC](https://hexler.net/software/touchosc) 最方便不过了(不过要收费)。

![](https://hexler.net/gfx/_software/touchosc-11.png)

在移动端下载 TouchOSC，在桌面端下载编辑器，在编辑器里面可以创建自定义的操作面板。然后在移动端设置输入和输出端口。接下来就可以在 Max/MSP 里面接收和发送 OSC 数据了。因为 OSC 通过 UDP 协议传输，所以使用 `udpsend` 和 `udpreceive` 对象：

![](http://img.viz.mobi/touchOSC2Max.jpg)

Max 接收到数据后，可以看到 OSC 的数据格式类似文件路径 URI：`/{序号}/{参数名} {参数值}`。

这样我们就把手机和电脑连接起来，并且在手机上实现个性化的控制。

除了移动端的 TouchOSC，[OSCulator](https://osculator.net/) 也是一款好用的 OSC 控制器，感兴趣的同学可以自行研究一下。

当然，Arduino 和 Max 也是可以方便地勾搭上的：

![](http://img.viz.mobi/ardumax-demo.jpg)

本周的作业，是研究 Arduino 如何触发 Ableton 或 Max 里面的声音采样，以及[如何使用 OSC 跟 Arduino 通信](https://github.com/CNMAT/OSC)。
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义04 - 基础几何体]]></title>
            <link>https://tophci.com/posts/190327-3d04-basic-geometry</link>
            <guid isPermaLink="true">https://tophci.com/posts/190327-3d04-basic-geometry</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Modeling]]></category>
            <category><![CDATA[Geometry]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 26 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

[三维制图讲义 01 - 欢迎来到三维世界](https://www.uegeek.com/190306-3d01-welcome-to-the-3d-world.html)

[三维制图讲义 02 - 三维制作流程](https://www.uegeek.com/190314-3d02-workflow.html)

[三维制图讲义 03 - 三维软件和 Blender 介绍](https://www.uegeek.com/190320-3d03-blender-intro.html)

## 快速回顾

上一节课，我们介绍了 Blender 软件的下载、安装、设置和基本界面组成。

接着练习了视图的变换：

- 围绕着兴趣点旋转视图：按下鼠标中键并移动
- 缩放视图：滚轮鼠标中键
- 平移视图：Shift+按下鼠标中键
- 正/右/顶视图切换：如果没有小键盘，需要先在设置中修改快捷键，比如我一般设置 Alt 1 / Alt3 / Alt7 为正/右/顶视图

然后练习了最基本的几何体操作：位移、旋转和缩放（TRS）。

![](http://img.viz.mobi/Blender_move.jpg)

特别需要练习的是，沿着某个轴做以上操作。当我们熟练使用界面中的辅助手柄来移动、旋转和缩放以后，还可以进一步使用鼠标来加速操作，毕竟这是最常使用的操作：

- 按一下 G/R/S 键后，再按一下需要沿着哪个轴移动，比如沿着 x 轴就按下 x 键，然后移动物体；
- 或者配合鼠标中键使用：按下 G 键后，按住鼠标中键，沿着坐标轴参考线移动，物体就会只沿着这条坐标轴移动

在这个基础上，我们加入**复制并移动的练习**：

- 选中几何体(非编辑状态)
- 按 shift+D 复制一个一模一样的几何体
- 沿坐标轴移动到某处(配合鼠标中键使用)
- 需要对齐多个几何体时，需要切换为正/侧/顶视图查看
- 将几何体 translate 到合适的地方

## 几何体

当我们第一次打开 Blender 软件的时候，会看到编辑视图中央有一个立方体。如果我们按下 shift+A，会弹出添加菜单，在 mesh 选项里面，会有一系列选项，它们就是最最基本的几何体：平面、立方体、圆形、球体、圆柱体、圆锥体、圆环。

![](http://jayanam.com/wp-content/uploads/2015/05/add_torus.jpg)

万丈高楼平地起。基础几何体就是万丈高楼的基本模块。

观察下面的几何体，想想在日常生活中，能见到哪些物品拥有类似的形状：

![](http://img.viz.mobi/85715889-set-of-basic-3d-geometric-shapes-geometric-solids-vector-isolated-on-a-white-background-.jpg)

用不同的基础几何体组合，几乎可以搭出任意的形状。乐高就是最好的例子：

![](http://img.viz.mobi/lego_bricks_pieces_02.jpg)

乐器？没问题啊~

![](https://aintbaroque.files.wordpress.com/2012/11/nanoblocks.jpg)

练习观察几何体的构成，可以从方方正正的物体开始。比如上面的乐高钢琴，是由哪几部分组成的？不规则的形状可以由哪些比较规则的形状拼接而成？

除了观察，还可以通过游戏来训练三维的想象力和直觉！比如，三维俄罗斯方块，二维玩得再溜，刚接触三维版本也会觉得自己手残：

![](https://www.androidsis.com/wp-content/uploads/2016/12/kubik-juego.jpg)

以后再玩跳一跳、纪念碑谷游戏，尤其是后者，记得仔细观察精美场景中的三维构造哦！

![](http://n.sinaimg.cn/tech/crawl/w550h488/20180102/xZKm-fyqefvx0379699.jpg)

![](http://www.domarketing.cn/uploadfile/2017/1120/20171120113509137.jpg)

而且，在现实世界中看到好玩有趣的物品，要留意它的不同侧面都长什么样子：

![](http://img.viz.mobi/b23af8da78874d7d920823b86e2cb1f3.jpg)

## Blender 练习

编辑模式点线面选择切换。

选中几何体后，按快捷键 Tab 进入编辑模式。这时候会看到物体变为橙色，顶点、边和面都跟物体状态时不太一样。

在编辑状态下，按键盘 1、2、3 键（或者点界面中模式选择右边的三个图标），可以切换为 点选择、边选择、面选择状态。

点选择（编辑模式下按 1 键）：

![](http://img.viz.mobi/Blender_point_select.jpg)

面选择（编辑模式下按 3 键）：

![](http://img.viz.mobi/Blender_face_select.jpg)

接下来，我们可以将点、线、面选择，跟位移、旋转、缩放结合起来练习：

- 切换到点选择模式（编辑模式下按 1 键），选中点，进行移动（G）(包括沿轴的操作)
- 切换到边选择模式（编辑模式下按 2 键），选中多条边，进行旋转（R）(包括沿轴的操作)
- 切换到面选择模式（编辑模式下按 3 键），选中多个面，进行缩放（S）(包括沿轴的操作)

![](http://img.viz.mobi/Blender_edit.jpg)

完成了立方体的修改以后，再结合上一节的知识，用三个形状不一样的几何体，做成 3X3X3 的几何体矩阵，并且截下正/侧/斜面三张图，记录过程中的心得。

你已经开始创造属于自己的作品了 😀，加油~
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义04-负责输入和输出的智能元件]]></title>
            <link>https://tophci.com/posts/190326-df04-input-and-output</link>
            <guid isPermaLink="true">https://tophci.com/posts/190326-df04-input-and-output</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[电路]]></category>
            <category><![CDATA[Fab]]></category>
            <category><![CDATA[传感器]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 25 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

[数字制造讲义 01-成为数字世界的建造者](https://www.uegeek.com/190305-df01-digital-fabrication.html)
[数字制造讲义 02-Arduino 入门](https://www.uegeek.com/190313-df02-arduino-intro.html)
[数字制造讲义 03-电路基础](https://www.uegeek.com/190319-df03-electronics-basic.html)

## 快速回顾

让我们先回顾[上节课的内容](https://www.uegeek.com/190319-df03-electronics-basic.html)。

电路是由导体和元件组成的回路，电流可以在其中流动。电路有三种状态：通路，开路（某处断开）和短路。

![](http://img.viz.mobi/3typesofCircuits.png)

闭合回路在同一点开始和结束，形成一个完整的循环，允许电力不间断地从（+）电源流到（ - ）地。短路是指，电路中有很大电流流过，但不流过负载，负载不起作用。

![](https://i0.wp.com/www.makerspaces.com/wp-content/uploads/2017/05/led-switch-schematic-diagram.jpg?zoom=2&amp;resize=563%2C477&amp;ssl=1)

电路图通过符号表示电子元件及其位置。

电阻器通常用于限流，我们用欧姆定律计算电路中所需电阻阻值。更复杂的电路则需要用基尔霍夫定律。

## 电路类型

有了基本的电路元件，我们可以构建出不同类型的电路。除了通路、开路和短路，电路还有其他的分类方法。

比如，从构成来分，可以分为电气电路和电子电路两大类。电气电路由电阻、线圈、电容组成。电子电路除了电阻、线圈和电容之外，还包括晶体管和二极管等半导体元件。

按照功能来分，又分为以下类型的电路：

**放大电路**：用于增大输入信号并且输出，例如常见的 Amplifier/功放

**振荡电路**：使电路在没有输入信号时也能产生交流信号

**调制电路**：可以调制振幅大小(AM)或频率(FM)的电路

![](https://www.saysyou.net/wp-content/uploads/2017/06/AM-FM-gif.gif)

**检波电路**：从信号中提取声音等（调幅波解调）

![](https://www.st-andrews.ac.uk/~www_pa/Scots_Guide/RadCom/part9/fig2.gif)

**滤波器**：提取指定频段的信号

![](&lt;http://designer.mech.yzu.edu.tw/articlesystem/article/compressedfile/(2003-01-05)%20%E6%BF%BE%E6%B3%A2%E6%8A%80%E8%A1%93%E7%B0%A1%E4%BB%8B.files/image005.gif&gt;)

**[运算放大器](https://www.wikiwand.com/zh/%E8%BF%90%E7%AE%97%E6%94%BE%E5%A4%A7%E5%99%A8)**：能产生一个比输入端电势差大数十万倍的输出电势（对地而言）。集成电路的一种，输入输出互不影响。

![](https://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Op-amp_symbol.svg/400px-Op-amp_symbol.svg.png)

**逻辑电路**：计算加法、乘法、记忆数字/文字

![](http://wiki.jikexueyuan.com/project/mcu-tutorial-one/images/59.png)

**电源电路**：交流直流电转换

## 我有千里眼，你有顺风耳吗？

在初学电子电路知识时，很容易被种类繁多的电子元件搞晕。想要一种一种元件学习，不是不可能，但是没必要。我们需要提醒自己，学习电路的目标是做出自己需要的东西，带有功能和互动的装置。

电子元件虽然名目繁多，但是从用途来分，除了上节课介绍过的基本元件，接下来就是这节课要学习的两大类：输入类和输出类。

**输入类元件帮助我们感知和获取环境中的信息/状态，输出类元件负责向环境施加影响**，例如展示数字/图像、移动物体等等。

![](http://www.teachhub.com/sites/default/files/field/image/technology-in-the-classroom-human-body-websites.jpg)

想象一下人体，可以类比为装备着强大输入输出设备的智能体。输入设备包括眼睛、鼻子、耳朵、皮肤等，可以感知并接收图像、运动物体、声音、气味、压力等等复杂多样的信息。而输出设备包括嘴巴、身体关节和肌肉等，可以发出声音、做动作、移动物体等等。

当然，电子元件能够做的事情就更多了，比如，测量土壤湿度、测量脉搏、获取蓝牙信号等等。这些由各显神通的元器件来实现。

## 输入设备

我们借助输入设备，实时获取环境中的各种信息。

### 开关

开关也是一种设备？没错，电路本身就是一个小环境，这个小环境最重要的状态之一，就是电路是否形成通路。(聪明的你应该意识到，开关同时也是一种输出设备)

不要小看了开关，它有多种类型，可以控制多种状态。比如有按钮类型的，toggle 类型的，还有开关组：

![](http://img.viz.mobi/8-parts-switch.jpg)

### 声音

检测环境中声音大小的元件(更高级一些的可以提取声音包络，或者做语音识别)。猜猜看，这类元件价格是多少？

![](http://img.viz.mobi/9-15219.jpg)

### 距离

超声波传感器的本领，是不断发出探测距离的超声波，计算并报告元件距离目标物体(障碍)的距离：

![](https://www.allelectronics.com/mas_assets/cache/image/3/b/5/5/480x480-15189.Jpg)

### 温度

测量温度的元件大多数都是热敏电阻，也就是阻值随着温度发生变化。

![](http://img.viz.mobi/11-parts-Thermistors.jpg)

### 光照

测量光照亮度的元件大多数都是光敏电阻，也就是阻值随着亮度发生变化。

![](http://img.viz.mobi/12-parts-Photoresistors.jpg)

### 图像

想要识别物体，首先要获取图像。摄像头就是最常见的设备。现在的摄像头已经做到体积微小、成像高清。

![](https://www.circuitspecialists.com/content/448097/CAMERA-MICRO-0.jpg)

另外一种传感器可以专门检测 RGB 的颜色值：

![](https://www.circuitspecialists.com/content/172210/color-01-1.jpg)

### 压力

压电传感器用来检测振动或敲击。

![](https://upload.wikimedia.org/wikipedia/commons/c/c4/SchemaPiezo.gif)

![](http://img.viz.mobi/16-16808.jpg)

### 磁场

我们常见的磁铁也是一种电子元件哦~

![](http://img.viz.mobi/17-NEODYMIUM_MAGNET.jpg)

霍尔效应传感器也称霍尔传感器，是一个换能器，将变化的磁场转化为输出电压的变化。

![](https://www.allelectronics.com/mas_assets/cache/image/4/1/e/8/480x480-16872.Jpg)

### 红外

互动装置总是少不了人的参与，其中经常会用到的一个元件，是检测某个距离内是否有人出现的红外传感器。

![](https://www.allelectronics.com/mas_assets/cache/image/3/b/8/a/480x480-15242.Jpg)

### 应变计

应变计是电阻随作用力变化的传感器；它将力、压力、张力、重量等物理量转化为电阻的变化，从而测量这些物理量。当外力作用于固定物体时，就会产生应力和应变。物体内部产生的（对外力的）反作用力即为应力，产生的位移和形变即为应变。

![](http://img.viz.mobi/20-StrainGage.jpg)

例如基于应变计的称重传感器，将力转换为可测量的电信号输出的传感器。

### 加速计

加速计（accelerometer）也叫重力感应器，是测量加速度的装置。相对于远距感测的装置，它测量的是自身组件在某个轴向的受力情况，表现形式为轴向的加速度大小和方向（XYZ）。这有点类似于陀螺仪，但陀螺仪的更多关注自身旋转情况，加速计则主要是测量受力情况，也就是三轴运动情况，更适合用于空间运动判断。

![](http://img.viz.mobi/21-part-ACCELEROMETER.jpg)

陀螺仪（gyroscope）是一种基于角动量守恒理论感测与维持方向的装置。三轴陀螺仪的工作原理，是通过测量三维坐标系内陀螺转子的垂直轴与设备之间的夹角，并计算角速度，通过夹角和角速度来判别物体在三维空间的运动状态。三轴陀螺仪可以同时测定上、下、左、右、前、后等 6 个方向，最终可判断出设备的移动轨迹和加速度。

常见的体感游戏机、手机里都有这种元件。

![](http://img.viz.mobi/22-pry-wiimote.gif)

### 机器视觉

前面提到了获取图像的元件，也就是常见的摄像头。不过我们更常见的需求是用摄像头识别某些东西，比如人脸、比如让机器人拥有视力。所以，机器视觉相关的硬件和软件也是我们可能会用到的工具。

机器视觉是人工智能中一个重要的研究领域，相关的算法一直在改进。[OpenCV](https://opencv.org/) 就是使用最为广泛的机器视觉开源库，它提供了实时识别形状和物体的能力，许多机器视觉的应用都是在它的基础上改进实现的。

当然，也有一些硬件已经集成了特定的视觉能力。

比如 [OpenMV](https://openmv.io/) 项目提供低成本、可扩展、支持 Python 的机器视觉模块，成为「机器视觉的 Arduino」：

![](https://cdn.shopify.com/s/files/1/0803/9211/products/web-new-cam-v2-angle_grande.jpg?v=1479601839)

又比如 Pixy2 摄像头，能通过简单的训练快速识别物体：

![](https://pixycam.com/wp-content/uploads/2018/05/IMG_5269_result.jpg)

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=s0753ulknzo&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Pixy2 摄像头图像识别](https://v.qq.com/x/page/s0753ulknzo.html)

## 输出设备

看了这么多输入元件，是不是觉得人对环境的感知能力得到极大的扩展？这样我们可以收集无数来自环境的实时信息。接着，我们处理这些信息，或者设定一些规则，达到某些条件的时候，就自动去做某些事情。这就是智能硬件的基本原理。并不难，对吧？

接下来我们就了解一下输出设备，看看如果要对环境施加影响，我们都有哪些能力可以使用。

### LED

严格来说，单个 LED 不算一类输出设备。但是它实在太常用了，而且多个 LED 组合起来，就可以成为可能性无穷的输出显示屏。

![](http://img.viz.mobi/25-part-LEDdisplay.jpg)

### LCD

跟 LED 对应的还有另外一种专门用于显示的屏幕——LCD (Liquid Crystal Displays)。

![](http://img.viz.mobi/26-part-LCD.jpg)

### 扬声器

视觉的输出设备有了，接下来是听觉。那就是各种扬声器，也就是喇叭了。

![](http://img.viz.mobi/27-part-speaker.jpg)

### 电机/马达

听和看都有了，那么接下来就是运动了。运动涉及到物理位移，我们需要借助电机来完成。

电机有非常多种，分类也各不相同，比如[直流电机（DC Moter）和交流电机](https://www.zhihu.com/question/24086069)。

在 DIY 装置中，常用到伺服电机、步进电机和舵机这几种。

**伺服电机**：闭环控制，即通过传感器实时反馈电机的运行状态，由控制芯片进行实时调节。

![](http://www.tedmotors.com/Archive/_cn/products/G0228/1607185816.jpg)

**步进电机**：开环控制，接收的是电脉冲信号，根据信号数量转过相应的步距角（角位移）。

![](https://www.allelectronics.com/mas_assets/cache/image/4/2/5/5/480x480-16981.Jpg)

**舵机**：是伺服电机在航模、小型机器人等领域下常用的一个特殊版本

![](https://www.allelectronics.com/mas_assets/cache/image/4/5/b/1/480x480-17841.Jpg)

## 小结

今天我们认识了很多新伙伴。你可能眼有点花，头有点昏。不要紧，在动手实践过程中会慢慢加深了解的。

现在，你已经踏上了自己折腾的旅程——有那么多好玩的东西等着你去搭建呢！

`输入+Arduino+输出` 可以实现无数的组合，只要你愿意细心查看元件的说明，按照电路的原理去设计接线，使用 tinkercad 等工具来模拟和检查电路，并且编写一些 Arduino 代码，理论上就可以做出许许多多好玩的东西。

![](http://blog.codebender.cc/wp-content/uploads/2014/03/intro__zps2d47d1b6.png)

嗯，理论只是理论。在实际动手的过程中，我们还会遇到这样那样的问题，可能是搞不懂某个元件的工作原理，可能电路总是出问题，可能是编程很吃力。这些都是成为 Maker 的过程中必不可少的锻炼。别忘记，我们还有 instructables、Arduino 等网站和社区，上面有海量的例子、项目和资料，是我们折腾路上很好的陪伴。

接下来就开始扑腾吧！享受淹没在新知中的缺氧感，享受遇到问题解决问题的痛苦，享受打完大小 boss 通关后的成就感。不要忘记跟大家分享你的点滴心得~
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义03 - 三维软件和Blender介绍]]></title>
            <link>https://tophci.com/posts/190320-3d03-blender-intro</link>
            <guid isPermaLink="true">https://tophci.com/posts/190320-3d03-blender-intro</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Blender]]></category>
            <category><![CDATA[Modeling]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 19 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

[三维制图讲义 01 - 欢迎来到三维世界](https://www.uegeek.com/190306-3d01-welcome-to-the-3d-world.html)

[三维制图讲义 02 - 三维制作流程](https://www.uegeek.com/190314-3d02-workflow.html)

三维软件实在太多了，到底该选哪一个？

![](http://img.viz.mobi/3D_softwares.jpg)

我并不是资深从业者，用过的三维软件并不多。我只从个人需求出发：

- 不贵，安装和维护简单
- 功能足够强大(不特别偏向工程制图/动画/三维雕塑)
- 软件还在持续改进中

Blender 是比较理想的选择。开源、功能完善，安装和使用都比较轻巧，关键是，免费用正版啊：

![](http://img.viz.mobi/3D_software_price.jpg)

如果是专业人士请直接忽略本文。或者移步 all3dp.com 在年初发布的一篇文章，介绍和比较了 30 款软件，其中 15 款为免费软件：

[Best 3D Design/3D Modeling Software 2019 (15 of 30 are Free) | All3DP](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#solidworks)

| Name                                                                                                                                    | Level         | OS                                           | Price                                                         | Formats                                                                                                                                                                   |
| :-------------------------------------------------------------------------------------------------------------------------------------- | :------------ | :------------------------------------------- | :------------------------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| [3D Slash](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#3d-slash)                                     | Beginner      | Windows, Mac, Linux, Raspberry Pi or Browser | Free, 24$/year Premium                                        | 3dslash, obj, stl                                                                                                                                                         |
| [LibreCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#librecad)                                     | Beginner      | Windows, macOS and Linux                     | Free                                                          | dxf, dwg                                                                                                                                                                  |
| [Photoshop CC](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#photoshop-cc)                             | Beginner      | Windows and Mac                              | 142€/year                                                     | 3ds, dae, kmz, obj, psd, stl, u3d                                                                                                                                         |
| [SculptGL](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#sculptgl)                                     | Beginner      | Browser                                      | Free                                                          | obj, ply, sgl, stl                                                                                                                                                        |
| [SelfCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#selfcad)                                       | Beginner      | Browser                                      | Free 30-day trial, 9.99$/month                                | stl, mtl, ply, dae, svg                                                                                                                                                   |
| [TinkerCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#tinkercad)                                   | Beginner      | Browser                                      | Free                                                          | 123dx, 3ds, c4d, mb, obj, svg, stl                                                                                                                                        |
| [Clara.io](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#clara-io)                                     | Intermediate  | Browser                                      | Free, Premium features from 100$/year                         | 3dm, 3ds, cd, dae, dgn, dwg, emf, fbx, gf, gdf, gts, igs, kmz, lwo, rws, obj, off, ply, pm, sat, scn, skp, slc, sldprt, stp, stl, x3dv, xaml, vda, vrml, x_t, x, xgl, zpr |
| [DesignSpark](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#designspark)                               | Intermediate  | Windows                                      | Freemium, 835$ (All Addons)                                   | rsdoc, dxf, ecad, idf, idb, emn, obj, skp, STL, iges, step                                                                                                                |
| [FreeCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#freecad)                                       | Intermediate  | Windows, Mac and Linux                       | Free                                                          | step, iges, obj, stl, dxf, svg, dae, ifc, off, nastran, Fcstd                                                                                                             |
| [MakeHuman](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#makehuman)                                   | Intermediate  | Windows, Mac, Linux                          | Free                                                          | dae, fbx, obj, STL                                                                                                                                                        |
| [Meshmixer](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#meshmixer)                                   | Intermediate  | Windows, Mac and Linux                       | Free                                                          | amf, mix, obj, off, stl                                                                                                                                                   |
| [Moment of Inspiration (MoI)](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#moment-of-inspiration-moi) | Intermediate  | Windows and Mac                              | 266€                                                          | 3ds, 3dm, dxf, fbx, igs, lwo, obj, skp, stl, stp and sat                                                                                                                  |
| [nanoCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#nanocad)                                       | Intermediate  | Windows                                      | Freemium, 180$/year                                           | sat, step, igs, iges, sldprt, STL, 3dm, dae, dfx, dwg, dwt, pdf, x_t, x_b, xxm_txt, ssm_bin                                                                               |
| [OpenSCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#openscad)                                     | Intermediate  | Windows, Mac and Linux                       | Free                                                          | dxf, off, stl                                                                                                                                                             |
| [Sculptris](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#sculptris)                                   | Intermediate  | Windows and Mac                              | Free                                                          | obj, goz                                                                                                                                                                  |
| [SketchUp](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#sketchup)                                     | Intermediate  | Windows and Mac                              | Free, 240$ Pro                                                | dwg, dxf, 3ds, dae, dem, def, ifc, kmz, stl                                                                                                                               |
| [3ds Max](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#3ds-max)                                       | Professional  | Windows                                      | 1505$/year, Educational licenses available                    | stl, 3ds, ai, abc, ase, asm, catproduct, catpart, dem, dwg, dxf, dwf, flt, iges, ipt, jt, nx, obj, prj, prt, rvt, sat, skp, sldprt, sldasm, stp, vrml, w3d xml            |
| [AutoCAD](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#autocad)                                       | Professional  | Windows and Mac                              | 1575$/year                                                    | dwg, dxf, pdf                                                                                                                                                             |
| [Blender](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#blender)                                       | Professional  | Windows, Mac and Linux                       | Free                                                          | 3ds, dae, fbx, dxf, obj, x, lwo, svg, ply, stl, vrml, vrml97, x3d                                                                                                         |
| [Cinema 4D](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#cinema-4d)                                   | Professional  | Windows, macOS                               | 3695$                                                         | 3ds, dae, dem, dxf, dwg, x, fbx, iges, lwf, rib, skp, stl, wrl, obj                                                                                                       |
| [modo](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#modo)                                             | Professionals | Windows, macOS, Linux                        | 1799$                                                         | lwo, abc, obj, pdb, 3dm, dae, fbx, dxf, x3d, geo, stl                                                                                                                     |
| [Mudbox](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#mudbox)                                         | Professional  | Windows and Mac                              | 85€/year                                                      | fbx, mud, obj                                                                                                                                                             |
| [Onshape](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#onshape)                                       | Professional  | Windows, Mac, Linux, iOS, Android            | 2400€/year, free and price reduced business version available | sat, step, igs, iges, sldprt, stl, 3dm, dae, dfx, dwg, dwt, pdf, x_t, x_b, xxm_txt, ssm_bin                                                                               |
| [Poser](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#poser)                                           | Professionals | Windows, Mac                                 | Standard 129.99$, Pro 349.99$                                 | cr2, obj, pz2                                                                                                                                                             |
| [Rhino3D](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#rhino3d)                                       | Professional  | Windows and Mac                              | 495€ Educational, 995€ Commercial                             | 3dm, 3ds, cd, dae, dgn, dwg, emf, fbx, gf, gdf, gts, igs, kmz, lwo, rws, obj, off, ply, pm, sat, scn, skp, slc, sldprt, stp, stl, x3dv, xaml, vda, vrml, x_t, x, xgl, zpr |
| [ZBrush](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#zbrush)                                         | Professional  | Windows and Mac                              | 400€ Educational License, 720€ Single User License            | dxf, goz, ma, obj, stl, vrml, x3d                                                                                                                                         |
| [CATIA](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#catia)                                           | Industrial    | Windows                                      | 7180€; Educational licenses available                         | 3dxml, catpart, igs, pdf, stp, stl, vrml                                                                                                                                  |
| [Fusion 360](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#fusion-360)                                 | Industrial    | Windows and Mac                              | 499.80€/year, Educational licenses available                  | catpart, dwg, dxf, f3d, igs, obj, pdf, sat, sldprt, stp                                                                                                                   |
| [Inventor](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#inventor)                                     | Industrial    | Windows and Mac                              | 1935$/year                                                    | 3dm, igs, ipt, nx, obj, prt, rvt, sldprt, stl, stp, x_b, xgl                                                                                                              |
| [Solidworks](https://all3dp.com/1/best-free-3d-modeling-software-3d-cad-3d-design-software/#solidworks)                                 | Industrial    | Windows                                      | 9950€, Educational licenses available                         | 3dxml, 3dm, 3ds, 3mf, amf, dwg, dxf, idf, ifc, obj, pdf, sldprt, stp, stl, vrml                                                                                           |

下载 Blender 请到官网 blender.org 选择 2.80 版本。不推荐之前的版本，是因为 2.8 版本的调整实在太大了，几乎对整个软件各方面都做了一些重构。尤其是加入了实时渲染的 eevee 引擎，用上就已经回不去之前的版本了……

Blender 官网每天会发布新的测试版(迭代速度真的飞快)。下载后找到应用程序直接打开就可以使用。

打开软件后，可以先按需做一些设置，比如显示中文菜单、修改小键盘相关的快捷键：

- 语言选择：顶部菜单-Edit-Preferences-Interface-Translation
- 鼠标/键盘快捷键设置：顶部菜单-Edit-Preferences-Keymap

![](http://img.viz.mobi/Blender_language.png)

学习 Blender，最重要的是反复练习。在这个系列课程讲义中，我不会详细讲解怎么使用软件，网上已经有相当多很棒的视频教程了。

我会尝试提供一些基本的练习清单，也就是帮助大家去拆解需要训练的技能。

这一周涉及的技能模块是最基础也是最重要的，因为它们的组合构成了 Blender (包括在其他三维软件里) 大部分的操作。

### 视图浏览

围绕着兴趣点旋转视图：按下鼠标中键并移动

缩放视图：滚轮鼠标中键

平移视图：Shift+按下鼠标中键

正/右/顶视图切换：如果没有小键盘，需要先在设置中修改快捷键，比如我一般设置 Alt 1 / Alt3 / Alt7 为正/右/顶视图

### 物体移动+旋转+缩放

非快捷键操作：先选中物体，然后在左侧工具栏选择 移动/选择/缩放 工具，然后操作

![](http://img.viz.mobi/Blender_move.jpg)

快捷键操作：先选中物体，然后按一下 G 键，移动鼠标就会看到物体会跟随移动。移到目标位置后，点鼠标左键，物体就确认移动。

但是在移动时，我们经常需要只沿着某个轴(x 轴辅助线为红色，y 轴辅助线为绿色，z 轴辅助线为蓝色)移动。

这个操作又有两种做法

- 按一下 G/R/S 键后，再按一下需要沿着哪个轴移动，比如沿着 x 轴就按下 x 键，然后移动物体；
- 或者配合鼠标中键使用：按下 G 键后，按住鼠标中键，沿着坐标轴参考线移动，物体就会只沿着这条坐标轴移动

确认移动都是点击鼠标左键。

沿着某个轴旋转和缩放也是类似的操作。

- 比如，沿 x 轴旋转：r - x - 移动鼠标 - 按鼠标左键确认
- 比如，沿 z 轴缩放：s - z - 移动鼠标 - 按鼠标左键确认

以上就是这节课的主要练习：用不同的视图查看物体，移动/旋转/缩放物体。

记得多练习几次哦，下周见~
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义03-电路基础]]></title>
            <link>https://tophci.com/posts/190319-df03-electronics-basic</link>
            <guid isPermaLink="true">https://tophci.com/posts/190319-df03-electronics-basic</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[电路]]></category>
            <category><![CDATA[Fab]]></category>
            <category><![CDATA[基尔霍夫定律]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 18 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

&lt;!--more--&gt;

[数字制造讲义 01-成为数字世界的建造者](https://www.uegeek.com/190305-df01-digital-fabrication.html)

[数字制造讲义 02-Arduino 入门](https://www.uegeek.com/190313-df02-arduino-intro.html)

上一节课，我们学习了时下最普及的单片机开发软硬件工具 Arduino。今天我们来了解 Arduino 开发板，以及其他电子元器件背后的基础——电路。

上次我们用 Arduino 和面包板搭了第一个简单的电路，了解到电路就是电流的通路，电流给电路中的负载输送能量，负载将电能转化为其他能量，比如 💡 亮起来。

![](http://img.viz.mobi/circuitMetaphor.jpg)

## 电路 101

如果把电流比作水流，那么电路就有点像为水流提供通路的水渠。在没有人为干预的情况下，水从高处向地处流。如果想给不同高度的地方提供用水，就需要建造水塔，或者用水泵把水从 A 处运送到 B 处。

电流也是类似。电源是电位/电压的高点，接地点是电位的零基准点，电流由两点之间的电压差形成，从电压高的地方流量电压低的地方。

![](http://img.viz.mobi/currentIllustration.jpg)

在流动的过程中，河床或水渠不可能绝对平整，而是会坑坑洼洼高低起伏，这样就对水流产生了一些阻碍作用。在电路中也是类似，电阻对电路产生阻力 (通过将电能转化为热能)。

简单来说，电路有三种状态：通路，开路（某处断开）和短路。

![](http://img.viz.mobi/3typesofCircuits.png)

其中短路是指，电路中有很大电流流过，但不流过负载，负载不起作用。咳咳，也就是说，在电路中走捷径是有代价的（🤦‍♀️）。

下面这个视频，可以帮助我们形成对电路更直观的印象：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=b0850foexnn&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Electric Circuits\_腾讯视频](https://v.qq.com/x/page/b0850foexnn.html)

从电流/水流的类比中，我们总结出电路中几个基本的规律：

- 电流趋向于电阻小的路径 (最小阻力原则)
- 电路始终要接地 (有始有终原则)
- 要防止短路 (有钱也不能任性原则)

## 电路 102

### 串联和并联

电路有两种基本类型：串联和并联。

为什么要学这个？因为它们是计算电路中电阻、电流等数值的基础知识。比如，要点亮多个 LED，需要多少伏的电源？

当多个元件串联（下图图二）时，会平均「瓜分」掉整段串联电路两端的电压，也就是起到分压作用。当多个元件并联时(下图图三)，「复制」了原本只有 1 个元件时的电压。

![](http://img.viz.mobi/Series%20and%20Parallell%20Circuits.png)

via tinkercad.com

再仔细观察一下，对比图一，为什么图二中的 LED 几乎没有亮？图三的 LED 为什么稍微暗一点？(图中的电阻都是 60Ω)

在图一中，我们测到点亮 LED 所需的电压约为 2V。如果要在串联电路中点亮两个 LED，那么根据「瓜分」原理，就需要提供 4V 的电压。但是图二的电池只有 3V，所以灯就点不亮啦。

在图三中，如果用万用表测量 LED 两端的电压，会发现电压只稍微下降到 1.9x V，LED 只是稍微变暗一点，接入很多 LED 也可以点亮。

### 欧姆定律

&gt; V = I \* R
&gt;
&gt; 流过电阻的电流 I 与电阻两端电压 U 成正比，与电阻 R 成反比

大家对欧姆定律都不陌生。那么知道欧姆定律在这门课中，最直接的应用是什么？它帮助我们计算电路中需要用多少阻值的电阻。

在前面一部分，我们讲过要防止短路。短路的本质就是电路中有很大的电流通过，这样会烧坏电路元件。电阻的作用是限制电流的大小，保护元件，保持电路正常运作。

比如一个 LED 的额定电流是 20 mA，我们手头只有一个 9V 电池。

![](http://img.viz.mobi/shortCircuit.png)

如果要保证 LED 安全，电路的阻值应该为 `9V / 0.02A=450Ω` 。这样我们就知道应该选择多少阻值的电阻加入到电路中了。

### 基尔霍夫定律

基尔霍夫定律？有什么用？

我们已经有欧姆定律了，为什么还需要多一个定律？因为电路也是会变得很复杂的嗯，比如有多个电池并联，比如要在电阻电路中加入电容(下一节会介绍)，那该怎么计算其中的电流与电压？

19 世纪，德国物理学家基尔霍夫扩展了欧姆定律，提出基尔霍夫定律：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=g0359uuom6b&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Crash Course Physics 31\_腾讯视频](https://v.qq.com/x/page/g0359uuom6b.html)

基尔霍夫第一定律(电流定律)

&gt; 在任何一个节点电路，流入该节点的总和电流，等于流出该节点的电流的总和，或：所有进入某节点的电流总和,等于所有离开这节点的电流总和。
&gt;
&gt; power: P = I&lt;sup&gt;2&lt;/sup&gt; , R = I V

基尔霍夫第二定律(电压定律)

&gt; 沿着闭合回路所有元件两端的电势差（电压）的代数和等于零。或者，所有电动势的代数和，等于所有电压降的代数和。

## 基本电路元件

![](http://img.viz.mobi/basicElectronicParts.jpg)

它们在电路图中的表示方法：

![](https://i1.wp.com/www.makerspaces.com/wp-content/uploads/2017/05/electronic-symbols2.jpg?resize=673%2C800&amp;ssl=1)

### 电阻

电阻的主要作用是限制电流。

不同的电路需要选择不同形态的电阻：DIP，SIP，SMD。

DIP（dual in-line package），两头都有引脚的电阻，是入门时使用的常见电阻。

![](https://ae01.alicdn.com/kf/HTB1iEAaj1uSBuNjy1Xcq6AYjFXa5/Free-ship-with-track-brand-new-200pcs-2R-2W-DIP-Resistors-carbon-Resisters-2W-2ohm-5.jpg)

这种电阻的阻值一般通过彩色的色环识别。有 4 环和 5 环两种标记方法，一般是记不住的，手头备一张色环卡比较实在：

![](https://www.digikey.com/-/media/Images/Marketing/Resources/Calculators/resistor-color-chart.png?ts=e802ab48-1ea0-4745-babf-9a21accec5c2&amp;la=en-US)

第一、二环是读数，第三环(五环的话是第四环)是乘数，比如 红-红-棕 表示 220 V。

SIP (single in-line package)，一头有引脚的电阻：

![](https://images-na.ssl-images-amazon.com/images/I/310RCcbsdbL._SX342_.jpg)

SMD (Surface Mounted Device)，贴片电阻，用于常见的 PCB 电路板：

![](https://leetechbd.com/wp-content/uploads/2017/12/SMD-Resistor.jpg)

### 电容

电容又是什么？

顾名思义，可以作为电荷容器的一种元件。

- 充放电特性：电容将电路中的电荷收集起来，然后在电压变化时放电。
- 阻直通交特性：阻止直流电流通过，允许交流电流通过(像个交警)

电容试图抵抗电路内的电压变化。因此，电容通常连接在电源和地之间，以保持稳定的电源并滤除间歇性的电压尖峰和下降。

![](https://cdn.instructables.com/FIA/1QHW/IQU11IWI/FIA1QHWIQU11IWI.LARGE.jpg?auto=webp)

其他元件就不继续一一介绍了。元件外型可以到 [Explore/3DModels | library.io](https://library.io/explore/3dmodels) 查看，元件的参数可以找到对应的 datasheet 查看。

## 电路图

电路图就是将各种元件连接起来组成完整电路的图示。

运用前面学过的知识，我们可以开始搭建电路图。在实际接线之前，建议先用工具画出接线图，可以帮助我们理清电路的功能和部件。推荐使用 Tinkercad 的 circuit 模块，网站上提供了一些常用的电路元件，方便快速搭建出虚拟电路。

![](https://csg.tinkercad.com/things/gw3hgGtVAdR/t725.png?rev=1517977820936000000&amp;s=ff528d92add92115be11517f8d5f191d&amp;v=1&amp;type=circuits)

更棒的是，它还提供了电路模拟运行的功能，分析电路中可能出现的问题，尤其是存在短路时会明确提示。这样就再也不用担心电路接不好会频繁烧坏元件了！✌️

![](https://cdn.instructables.com/F4A/OTSY/J1CEMMNL/F4AOTSYJ1CEMMNL.ANIMATED.SMALL.gif)

更让人开心的是，还集成了 Arduino 的模块功能，让没有编程基础的使用者，也能快速上手编写简易程序：

![](https://www.tinkercad.com/img/electronics/circuits-editor.gif)

去试试看吧~ 👀
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义02 - 三维制作流程]]></title>
            <link>https://tophci.com/posts/190314-3d02-workflow</link>
            <guid isPermaLink="true">https://tophci.com/posts/190314-3d02-workflow</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Animation]]></category>
            <category><![CDATA[Modeling]]></category>
            <category><![CDATA[Texture]]></category>
            <category><![CDATA[Camera]]></category>
            <category><![CDATA[Lighting]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Wed, 13 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

在进入三维软件的学习之前，我们先来了解一下在这方面应用最为成熟的产业之一：三维动画影视制作。

下面是 3D Production Pipeline 的流程图，很好地总结了一部完整的动画影片的制作过程。

![](http://img.viz.mobi/3d_production_timelines.jpg)

我们在这个学期从零基础学起，主要涉及到的是 Modeling 建模和 Texturing 材质贴图部分，也会简单应用一些 Lighting 灯光和 Rendering 渲染的知识。

在整个制作流程中，会涉及很多工具。下面是以 Blender 为例的 workflow（[来源](http://www.bgteach.com/article/9)）：

![](http://www.bgteach.com/files/default/2017/10-17/17124088c083968322.png)

在新年期间上映的「流浪地球」，已经充分展示出国内影视技术的实力。[这篇访谈](https://mp.weixin.qq.com/s/O8Zp7ok0JpPuFkofnQ7UaQ)介绍了大量的前期概念设计，涉及人物、场景、装备等等，推荐感兴趣的同学看一看。

相信绝大部分同学都看过皮克斯出品的动画：玩具总动员、海底总动员、超人总动员、机器人总动员、飞屋环游记、头脑特工队……每一部都是传奇般的经典。皮克斯不但连续制作出高水准的作品，而且为行业积累了大量实践经验，推动着影视动画制作向前发展。而且，皮克斯还推出了一套非常系统的动画制作入门课程，包括故事、角色、场景、材质、动效、灯光等等制作环节，制作精良，墙裂推荐大家观看。

下面的视频会对整个课程做一个导览：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=w0527u1xhcs&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Pixar in Box\_腾讯视频](https://v.qq.com/x/page/w0527u1xhcs.html)

## 三维制作 3+1

通过皮克斯的介绍视频，大家对整个制作过程有了一定了解。

在这么复杂的过程中，有三样东西是必不可少的。这三样东西也是我们打开 Blender 软件后，在视图区看到的东西：

![](http://img.viz.mobi/blenderDefault.jpg)

那么 3+1 的 1 又是什么呢？有了几何体、灯光和镜头，我们还需要渲染，才能生成最终的图像。下面对 3+1 分别做简单的介绍。

### 几何体

点线面是最基本的造型单位。在三维建模中，点线面有另外的名字：

- 顶点-vertices：在几何体角落上的点
- 边-edges：连接顶点的线
- 面-faces：由若干条边围成的填充区域

![](http://img.viz.mobi/720px-Mesh_overview.svg.png)

任何的几何体，再复杂的模型，无非都是反复增删、调整顶点、边和面而形成的。

如果说点、线、面是基本的操作对象，那么平移（translation）、缩放（scale）、旋转（rotation）就是基本的操作方式。这些是我们在三维设计建模过程中主要的工作。

### 材质/灯光

材质和灯光决定了一个物体看起来是什么样的。

材质涉及到纹理、粗糙度、反射率、亮度等等复杂的参数。

![](https://cdnb.artstation.com/p/assets/images/images/001/809/163/large/ania-przybylko-kostki.jpg?1453072206)

而灯光需要根据物体在真实光照环境下，对光线的反射规律来计算并呈现。在一个模型的表面，有许多多边形，每一个多边形接收和反射的光并不一样，这与人眼识别立体物体的原理有关。

![](http://img.viz.mobi/$flatshading.png)

材质结合光照，组成了千变万化的组合，也给三维世界带来了无数的可能性。

![](http://img.viz.mobi/materialWithLights.jpg)

## 镜头

镜头是大家相对陌生的领域。因为我们天然就有着两个镜头——眼睛。看向哪里、怎么看，几乎不需要经过思考和反应，所以我们感觉不到自己身上这个「镜头」的存在。

但是在虚拟的三维世界中，镜头决定了场景的呈现。

[Introduction to geometric transformations (video) | Khan Academy](https://www.khanacademy.org/partner-content/pixar/sets/sets1/v/sets-overview)

在影视动画中，镜头是叙事的关键要素之一。如何设置镜头相关的参数，获得我们想要的渲染结果，会在后续的课程中涉及到。

## 渲染

可以说，渲染是一个令人头疼的词。它意味着费时费力（主要是费计算机的算力）。

为什么需要渲染？相比手绘图像，三维图像其实不是被「画」出来的，而是由很多参数计算并自动绘制出来的成果。渲染就是计算机根据参数计算最终展示结果的过程。

计算机成像有不同的渲染方式。光栅化和光线追踪是常见的两种。

- 光栅化（Rasterization）是把顶点转换为片元的过程，也就是将图转化为一个个栅格组成的图象，特点是每个元素对应帧缓冲区中的一个像素。
- 光线追踪（Ray tracing）是三维计算机图形学中的特殊渲染算法，跟踪从眼睛发出的光线而不是光源发出的光线，生成编排好的场景的数学模型显现出来。

![](http://img.viz.mobi/HybridRendering.jpg)

在后续的课程中我们还会来讲解。

## 补充知识：三维投影

计算机是二维屏幕，如何表示三维的物体和世界呢？

这里要借助三维投影的概念。

![](http://img.viz.mobi/wireframeRendering.jpg)

从字面理解，投影就是物体被光照后投射到一个平面上的影像。计算机图形学里有大量关于光线和投影的研究。

在三维设计中，会经常接触到两种投影：透视投影（Perspective Projection）和正射投影（Orthographic Projection）。

下图可以帮助我们理解两者的区别：

![](http://img.viz.mobi/projection_example.gif)
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义02-Arduino入门]]></title>
            <link>https://tophci.com/posts/190313-df02-arduino-intro</link>
            <guid isPermaLink="true">https://tophci.com/posts/190313-df02-arduino-intro</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Arduino]]></category>
            <category><![CDATA[单片机]]></category>
            <category><![CDATA[电路]]></category>
            <category><![CDATA[Fab]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 12 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

&lt;!--more--&gt;

在这个学期，我们会学习数字制造中主要的环节和技术，包括 Build 和 Code 两部分。

![](http://img.viz.mobi/Build&amp;Code.001.JPEG)

上半学期我们主要学习 Code 部分，它赋予物品「灵魂」，让一件物品能完成我们期望的功能和互动。

怎样让物品拥有一定的「智力」呢？

给它加上芯片嘛。

可是芯片、电路、元件、硬件啊，都涉及到很专业的知识，对一般人来说门槛太高了。所以今天我们来介绍通往硬件世界的捷径——Arduino。

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=m0823vlpahu&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Arduino 创始人 TED 演讲：开启开源想象力](https://v.qq.com/x/page/m0823vlpahu.html)

Arduino 的初衷，是为了让没有电子相关专业背景的人，能够在很短的时间内上手。这个小小的板子，撬开了很多人的想象力，让动手做东西的门槛降低，让无数好玩的想法得以试验和实现。

## 为什么要用 Arduino？

它可以帮助我们用很小的成本，快速地搭建智能物件的原型。也就是

&gt; Prototype &amp; Digitize for the Real World

很多时候，我们有一个想法，比如：有一个自动给花浇水的装置。「自动」意味着我们会设定一些规则，在某些条件下自动触发浇花这个动作。要实现自动，就会需要一个类似电脑一样的带有一定「理解能力」的执行者。如果每一个想法，都需要一台电脑来实现，那我们早就破产了。

这时候只需要一个电脑的极度简化版本——我们一般叫做单片机（Microcontrollers）。它是一种集成电路芯片，把具有数据处理能力的中央处理器 CPU、随机存储器 RAM、只读存储器 ROM、多种 I/O 口和中断系统、定时器/计数器等功能集成到一块硅片上，构成的一个小而完善的微型计算机系统，在工业控制领域广泛应用。

单片机的大小确实可以只有薄薄的一片，方便我们放置到各种各样的物体内部，赋予它计算的能力。

Arduino 就是一种单片机。

![](https://cdn.arduino.cc/homepage/static/media/arduino-UNO.bcc69bde.png)

类似的工具还有树莓派（不算单片机了，是基于 Linux 的低配电脑）等等，它比 Arduino 要强大，因为芯片不止 8 位，可以运行操作系统。

![](https://shawzt.github.io/assets/images/raspberry_pi.png)

## 模拟信号和数字信号

当我们想要对实体环境施加影响，经常需要将模拟信号转化为数字信号——因为我们能操纵数字信号（编程就是一种强大的操纵），但是不能任意改变模拟信号。

那么什么是模拟信号和数字信号呢？

简单来说，模拟信号在时间上和取值上都是连续不间断的（可无限微分）。自然界常见的信号都是模拟信号，比如温度、声音等等。而数字信号在时间上和取值上，不完全连续，存在很多「档位」，档位越多，意味着信号的分辨率越高。

更详细的讲解，我们可以看看下面这个视频：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=z06602duiv9&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[什么是模拟信号？数字信号？区别是什么？它们又是如何完成转换的？](https://v.qq.com/x/page/z06602duiv9.html)

Arduino 的主要作用之一，就是帮助我们实现模数转换，完成对物理世界数据的采集，以及处理信号后反馈到物理世界中。

## Arduino 开发板

Arduino 有许多不同型号、功能各异的开发板。

![](https://assets.t3n.sc/news/wp-content/uploads/2016/07/Arduino-Boards-595x680.jpg)

其中一些体积更小，或是芯片的能力更强，又或者搭载了 wifi 或蓝牙模块。这样我们可以根据自己项目的需要，使用不同的板子。每一块板子的具体信息，可以在官网上查看。

Arduino 的开发板，本质上都是单片机应用开发板，使用的芯片大都是 AVR 芯片。开发板封装和简化了最常用的软硬件模块。硬件主要是提供基本的芯片、数字信号端口、模拟信号端口、电源和其他一些接口。软件主要提供了简单的函数和应用库，不用直接去操作寄存器，使得没有太多单片机基础的人也可以使用。

![](http://img.viz.mobi/arduino-illustration.jpg)

## 用 Arduino 搭建简易电路

电路是什么玩意儿？

作为一种路，它其实跟公路、地铁线路有点类似，只不过它运送的不是车辆和人，而是电荷。人和车会选择最短路径或者换乘最少的路线，电荷也会沿着阻碍最小的路径移动。

在最简单的电路中，有三个必不可少的部分：电源、中间环节、负载。

负载是指将电能转化为其他形式能量的部分，例如灯泡、电机等。电路的使命，是为了让负载能够正常工作。

![](http://img.viz.mobi/circuitMetaphor.jpg)

（雾）

下面就是一个最简单的电路，电流从电源正极流经 LED，返回到电源负极。

![](http://img.viz.mobi/breadboardCircuit.jpg)

上图右侧是一块面包板，它的作用是提供电路连接，帮助我们快速搭建电路。

在面包板中，Terminal Strips 都是连通的，而两侧的 Power Rails 也是连通的。

![](http://img.viz.mobi/breadboardEX.jpg)

关于电路板的使用，可以看看这个讲解得很仔细的视频：https://www.youtube.com/watch?v=6WReFkfrUIk （备好梯子）

Arduino 提供了电源和接地的端口，这样我们可以快速连成一个完整的电路：

![](http://img.viz.mobi/veryBasicCircuit.png)

## Arduino 编程环境

Arduino 开发板是硬件部分。接下来我们了解软件部分。从 Arduino 官网下载 Arduino 软件并安装，打开后就看到 Arduino 的编程环境。

现在不但可以在软件中编程，还可以访问在线编程工具：https://create.arduino.cc/

![](https://hackster.imgix.net/uploads/attachments/256423/screenshot_2017-01-31_16_Jb6CmduoC2.png?auto=compress%2Cformat&amp;w=680&amp;h=510&amp;fit=max)

具体的界面功能就不详细介绍了。

同学们最开始上传程序到板子时容易遇到一个错误，大都是因为没有选择传输端口导致的。需要注意在 `Tools` 菜单中选择对应的端口再上传。如果使用 USB 连接板子和电脑，就选择包含 `USB` 的端口。

![](https://i.stack.imgur.com/MOvDD.png)

下节课我们介绍一些电路基本知识。C U
</content:encoded>
        </item>
        <item>
            <title><![CDATA[三维制图讲义01 - 欢迎来到三维世界]]></title>
            <link>https://tophci.com/posts/190306-3d01-welcome-to-the-3d-world</link>
            <guid isPermaLink="true">https://tophci.com/posts/190306-3d01-welcome-to-the-3d-world</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[3D]]></category>
            <category><![CDATA[Animation]]></category>
            <category><![CDATA[Modeling]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Tue, 05 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![3d_course_title](https://uegeek-img.oss-cn-guangzhou.aliyuncs.com/img/3d_course_title.jpg)

## 一个价值数百小时的问题

&gt; 与我何干？

为什么要学习三维制图？

有点诡异的是，还没有学的人，很难回答上来。但是，如果不**自发**地问自己这个问题，学不好的可能性会挺大——如果我都不知道为什么学，我又为什么要去学呢？

那到底这应该是学生问自己的问题，还是老师提出的问题？

双方都应该**主动**提出。

如果学生不在老师提出前就问问自己，学习动力就不会很强，「不就是一门必修课嘛」。如果老师不在课程之初提出来，大概也是借「这就是一门必修课」让自己省点力……如果不回答这个问题，这门课大概也就没必要继续上了——双方都不知道为了什么呀。

在 [大哉问 05 - 什么是学习中最大的误区？](https://www.uegeek.com/180106-the-learning-myth.html) 中，我们讨论过学习中最大的误区：

![](http://img.viz.mobi/mythOfStudy.png)

回顾自己这么多年的学习经历，但凡学了等于白学的东西，基本上都有一个共同特点：我不清楚为什么而学。

也就是，没有花十分钟时间去思考一下：到底跟我有什么关系？然后就浪费了数十、上百小时在上面。

学习是一件难受的事情，因为需要在某种程度上改变自己。比如这门课，对没有美术和绘画基础的同学来说，会进入一个不舒适的技能区域；它也会比想象要精（gui）密（mao），而且还有一些数学知识……当我不知道为何而战的时候，为什么要去承受一些折磨？我们费力是为了讨什么好？

这是我希望每一门课开始时，老师能告诉我的。更好的是，老师不只是告诉我，他还用他在其中获得的经验、快乐、热情来 fire 我——在旅途的起点就加上油，而不是一辆没有动力的车，需要人推着走。

## Why 3D?

&gt; 重新认识我们的世界；如果有可能，去创造新世界

这是我给自己定制的通用学习目标，适用于大部分知识和技能的学习。

### 重新认识世界

&gt; 世界上本来到处是神迹。神迹出现得多了，也就没有了神迹。——00

我们生活在三维世界中。但是我们对「三维」的理解，大都是直觉，而不是精细编码过的知识。

「看」是每个人的本能，所以我们不需要去思考它，更不需要去理解它是如何运作的。但是，如果有一天，我们了解到其中的一些奥妙，从此看待世界的视角和眼光会发生改变——你不再会用以往的眼光，去看待那些看似平凡的神奇事物。人因此而习得了带有个性的审美和偏好，能够欣赏光影的变幻、赞叹生命的神奇，并且在探索谜题中获得乐趣。

我们不仅生活在三维世界中，我们还在编织、建造虚拟的三维世界：

比如说动画

![](https://m.media-amazon.com/images/I/71+8hkKvieL._SS500_.jpg)

比如说电影

![](http://img.viz.mobi/liulangdiqiu-poster.jpg)

VR

![](https://sportsilab-cms.imgix.net/39qybULeGQWiAGGu642cA2/8f3c29e61c9a08d87380c633b9079948/The_International_2015__Key_Arena__Seattle__Washington_D.C..jpg?ixlib=rb-1.2.2&amp;fit=crop&amp;auto=fm%2Ccompress&amp;w=1280&amp;h=800&amp;s=685daf5f7c0beb8a433e80a764a866db)

游戏

![](http://img.viz.mobi/zelda.jpg)

有些东西，知道以后，就再也回不去了。就像塞尔达的这张经典场景。新的世界就在眼前。

### 创造新世界

更激动人心的是，我们可以亲手参与创造这些世界。也就是，为自己或他人造梦。

比如，现在的乐器，我们可以绘制和生产出来：

![](https://d1ag85ptixulvl.cloudfront.net/k28kmvrzx80m/415FaERZHyIkOicEgiK2Is/3608caa87773424f67328628e6300f7b/family_seaboard_top.jpg?w=1200&amp;h=630)

那么，未来人们和音乐的关系可能是什么样的？未来的乐器可能是什么样的？

![](http://hyperallergic.com/wp-content/uploads/2015/02/jsparksnomis.jpg)

以及，未来的音乐世界是什么样的？

过去已经有人探讨过，并且这种探索永远不会停止：

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=e0520x0cdpa&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[Pipe Dream - Animusic](https://v.qq.com/x/page/e0520x0cdpa.html)

而且，这些梦境最终可以变成现实。因为真实世界也是三维的，我们可以将设想数字化，然后将它制造出来。

![](https://digital.hammacher.com/Items/13068/13068_1000x1000.jpg)

## 从蠢问题开始

学习的起点在哪里？想法？课本？社群？

都可以。

我更喜欢从问一个「蠢问题」开始，比如：

&gt; 人怎么可以看见东西？

对声音和音乐知识比较了解的同学知道，[不同频率和振幅的声波，形成了不同音高和响度的声音](https://www.uegeek.com/180623-make-noise-02.html)。

![](http://img.viz.mobi/soundwave-f&amp;a.png)

听觉和视觉的原理有一些类似。跟声音类似，光也是一种波动，是能量的一种形式。人能看见东西，是因为有一种类似声波的波，它的频率决定了光的颜色，它的强度决定了光的亮度：

![](http://img.viz.mobi/lightwave-f&amp;a.png)

人能看见的光，波长有一定的范围：

![](http://sci.esa.int/science-e-media/img/cb/Figure_4_spectrum_High-energy_highlight.jpg)

正是环境中各种类型的光源，照射在物体上，产生了光的反射、漫射，让我们眼睛中的视网膜的感光细胞可以感知到，并且通过视神经传递到视觉皮层，由大脑「计算」出一幅关于真实世界的「投影」。

## 神奇之处在哪里？

先不说大脑到底是怎么把乱七八糟的感光强度变成一幅图像，那太硬核了。我们先来问另外一个蠢问题：

&gt; 三维世界是怎么被「拍扁」成二维图像的？

这件事其实有人老早就在做，而且做得更专业，那就是照相机。

世界是三维的，照片是二维的，但是我们看到二维的照片，会觉得它「就是」三维的。

（此处省略摄影成像原理……）

跟照片有点类似，计算机屏幕的成像，也是二维的，也就是用 M 行 N 列的矩阵，来表示屏幕上每一个像素点。每个像素点填充不同的颜色，最终构成了整个屏幕的图像。

&lt;iframe frameborder=&quot;0&quot; src=&quot;https://v.qq.com/txp/iframe/player.html?vid=b0845ngqa6l&quot; allowFullScreen=&quot;true&quot;&gt;&lt;/iframe&gt;

[scanline rendering](https://v.qq.com/x/page/b0845ngqa6l.html)

另一个更神奇的蠢问题：

&gt; 为什么二维平面可以模拟三维世界？

我们去电影院看 3D 电影时，会用一副 3D 眼镜。这副眼镜帮助我们把原本二维的画面，变成三维。

![](https://media.techeblog.com/images/3d_technology.jpg)

这一门课要学习的，其实都是关于怎么在二维的平面/屏幕上呈现三维的世界。

## What is Rio

将二维的麻瓜平面变成三维的巫师场景，最大的目标或者敌人就是：

&gt; 怎么让物体看起来真实？

![](http://www.ykwjlg.com/images/201704/source_img/3630_G_1491353910155.jpg)

### 形状·比例

人天生对人体各种部位的比例敏感，对物体的形状也有远超计算机的辨认能力。「真」的第一要义，是形状和比例要接近我们对真实人事物的印象。

![](https://cdn3-www.comingsoon.net/assets/uploads/2017/07/Westworld.jpg)

（当然，虚拟场景尤其是游戏、动画另当别论）

![](http://img.viz.mobi/Vitruvian%20lego.jpg)

### 颜·皮·光

一个方块只是一个方块，在还没有给它披上皮之前：

![](https://cdnb.artstation.com/p/assets/images/images/001/809/163/large/ania-przybylko-kostki.jpg?1453072206)

&gt; 要有光。——God

一个人只是一个人，在没有让他进入不同的光照环境之前：

![](http://img.viz.mobi/Different-Light-and-shadow-prmote-original.jpg)

预警：学习了光照的知识后，容易开启发呆状态。一个光影可以让人盯着出神好久……因为光中有影中有光中有光有影中有光~

## 上路之前

新世界的大门（坑）马上就要开启了。在上路之前，还有几点对同学们、也是对自己的寄望。除了上面提到的对世界新的视角和理解、拥有建造新世界的能力，希望通过这个学期的学习，我们还能一起收获：

**创造者心态**

消费陷阱千万个，通往创造的小路只有两三条。围绕消费的生活终究没有尽头。为自己创造点什么，为他人创造点什么，这两个简单的目标，可以帮助我们躲开一些无聊、迷茫、寂寞、心理疾病甚至厄运。在这门课上，我们有很多机会站在设计和创造者的角度来观察世界、思考问题，从而习得一种创造的心态。

**改进过的学习习惯**

学习方法不对，往往是对低效学习方式的痛感不够强。我经历过许多学习的痛苦，相信学习本身就是一种迭代过程。学什么其实不太重要，重要的是[用什么姿势去学，以及这种姿势适用于什么情境，是否可以迁移到任意一种知识的学习](https://www.uegeek.com/learning-guide-v1.html)。

![](http://img.viz.mobi/LearningGuide-s.png)

(如需完整版高清大图，请关注公众号 HackYourself，回复“指南”)

**眼界和审美**

学习完课程，能独立完成简单的乐器设计当然重要。但更重要的是，看到更大的世界，看到各行各业的苦与乐，看到这个世界中迷人的部分，开始分辨什么是美、怎样是更美，并且挑选吸引自己的谜题去深入探索。

**以终为始的旅程**

[学习不是学习行为本身](https://www.uegeek.com/180106-the-learning-myth.html)，[学习是一种改变](https://www.uegeek.com/learning-about-learn.html)。如果能清晰地描述自己当前所处的 A 点是什么样子，想去到的 B 点又是什么样子，这段学习的旅程会更富有挑战、意义和乐趣。现在就去立 🚩 吧~

更有效的做法，是找到一个标杆（作品），提醒自己走到 B 点时，要拿出什么样的旗子插在上面。

![](http://img.viz.mobi/rethinkingLearning.png)

希望这是一个有点不一样的开始。

希望陪伴你们度过一个痛苦又有趣的学期~

00
</content:encoded>
        </item>
        <item>
            <title><![CDATA[数字制造讲义01-成为数字世界的建造者]]></title>
            <link>https://tophci.com/posts/190305-df01-digital-fabrication</link>
            <guid isPermaLink="true">https://tophci.com/posts/190305-df01-digital-fabrication</guid>
            <category><![CDATA[ArtxCode]]></category>
            <category><![CDATA[Creative Coding]]></category>
            <category><![CDATA[制造]]></category>
            <category><![CDATA[Maker]]></category>
            <category><![CDATA[Digital Fabrication]]></category>
            <category><![CDATA[Fab]]></category>
            <dc:creator><![CDATA[00]]></dc:creator>
            <pubDate>Mon, 04 Mar 2019 16:00:00 GMT</pubDate>
            <content:encoded>
![](http://img.viz.mobi/week7title.jpg)

&lt;!--more--&gt;

## 开始的开始

并没有想过自己有机会在大学里讲这门课——一门自己永远觉得学不够（会）的课。

三年前的今天，我正在痛苦的上一门叫做 Digital Fabrication 的课。它由 MIT 原子与比特中心 FabAcademy 开设，前身是一门叫做 How to Make Allmost Anything 的课程。

![](http://img.viz.mobi/FabAcademy%20Website.png)

关于课程学习什么，我写了[一系列的笔记](https://www.uegeek.com/tags/Fab/)，这里就不多介绍了。

![](http://img.viz.mobi/Fab18topics.jpg)

How to make almost anything:

![](http://img.viz.mobi/Fabacademy13.11.projects.jpg)

伴随 FabAcademy 的发展，Fab Lab 已经遍布全球：

![](https://www.fablabconnect.com/wp-content/uploads/2017/07/Map-3-world.jpg)

今年我有机会把这门课的体验带给你们，把这门课改进得更本土化、可操作，以及尝试如何在小成本的实验室里进行基本的实践。这门课不仅仅是为了帮助你们学习制作乐器的一些基本知识和技能，更重要的是，我们有机会一起探索人与音乐互动的历史、边界和可能性，一起体会动手做东西的痛苦和快乐、挫败和成就感，从而形成对一个全新身份的理解和认同——创客，或者更具体点，音乐创客。

## 数字制造的浪潮

什么是数字制造？

简单说就是将制造流程数字化、自动化、智能化。我把它划分为三个部分：

```
CAD + Programming + CAM

数字化设计 + 编程 + 数控生产
```

数字化浪潮已经翻滚很多年了，一些领域早已完成数字化，而一些领域还处在变革当中，包括制造业。

数字制造浪潮的背后有两大基础：工业 4.0 和创客运动。

![](https://www.sanofi.com/-/media/Project/One-Sanofi-Web/Websites/Global/Sanofi-COM/Home/en/about-us/img/Infographie_RevolutionIndustrielle_1940x960_EN-5.JPG?la=en&amp;hash=547E56AAEB6EC72BBE213128E2D59FA671F59A65)

工业 4.0 在机械化、自动化生产的基础上，进一步把生产流程相关的所有数据整合进来，形成物联网、全流程数据化、数据智能驱动物理计算和执行。过去是机器排好队，人来引导。现在则是构建一套数据自动流转的网络，人不参与的情况下也能由各种系统自动完成。

另外一个是更偏文化影响的基础：创客文化。

创客文化根植于欧美国家的 DIY 传统，大家喜欢自己动手做东西。为什么喜欢动手做东西呢？因为人工很贵啊！而且房子大，家里面一般都有车库，可以用做工作室或者是创业的办公室。很多东西就是这样在车库里面捣鼓出来了。（所以高房价和廉价劳动力真是创客文化的敌人 😒）

![](http://makerfaire.wpengine.com/wp-content/uploads/2014/05/unknown.jpeg)

Maker 杂志每年举办的 Maker Faire 已经成为全球创客盛大的节日，还一度开到了白宫里面。（真·网红）

制造，曾经是一个离一般人很遥远的行业。在我们的印象中，制造业干的都是一些有技术含量的体力活。女生？不可能的~

但世界的变化比我们想象得要快。

随着数字化浪潮席卷各行各业，随着制造工具变得更强大、更小、更便宜，随着包括电子、编程在内的通识教育的普及，随着项目的积累和开源，我们不知不觉已经站在了 Personal Digital Fabrication 的门口。配备一个设备齐全的 lab，也不再是那么遥远的念想。

![](http://img.viz.mobi/18.01.fablab.jpg)

## 数字制造基本流程

我们先来看一个不那么数字化的制造流程：

[匠心工艺 小提琴精湛工艺的制作](https://v.qq.com/x/page/i0569cc1q2r.html)

然后是一个 Fab lab 中的制造流程：

[Making an Electric Violin](https://v.qq.com/x/page/u0845zxy0vl.html)

然后看看制造业里面经常用到的 CNC 制造过程：

[CNC machining a Fender body](https://v.qq.com/x/page/i08458jou2c.html)

在这个学期里，我们会学习数字制造中主要的环节和技术，包括 Build 和 Code 两部分。Build 部分主要负责物品的造型和外观，以及如何把它从设计变成实物。Code 的部分赋予物品「灵魂」，让一件物品能完成我们期望的功能和互动。

![](http://img.viz.mobi/Build&amp;Code.001.JPEG)

颜值和智商，都不可以偏废。

一个音箱表面看起来是这样的：

![](https://www.apple.com/v/homepod/h/images/overview/homepod_side_dark_large_2x.jpg)

为了不只是胸大无脑，它里面是这样的：

![](https://www.apple.com/v/homepod/h/images/overview/guts_4_large_2x.jpg)

从数字制造的三个模块来看，一个合成器的制造可以分成几个部分。

```
CAD + Programming + CAM

数字化设计 + 编程 + 数控生产
```

首先是合成什么样的音色？以前只能通过物理的方式，用不同的电路电压获得波形，然后做各种调制的效果。而现在我们可以用软件编程的方式来实现

![](http://1cyjknyddcx62agyb002-c74projects.s3.amazonaws.com/files/2015/01/godel2c.jpg)

其次是合成器的外观造型部分，如何设计：

![](http://cdn.shopify.com/s/files/1/0244/6325/products/Korg-MS-10-Mono-Synthesizer-Cover-1_grande.jpg?v=1510921210)

然后如何把每一个部件制造出来并组装：

![](http://static1.squarespace.com/static/583893b7d2b857c44d3569de/587e1f701b631be781cc42ba/59a8787f6f4ca391ad4004c6/1548105972274/VC-10-.jpg?format=1500w)

## 挖宝和立 🚩

这门课程的学习，将会是一个混乱的过程——因为有太多陌生的名词、知识和领域。但也意味着一旦入了门，就拥有了一件无价之宝：可能性。

结合同学们的专业，这里有两个建议的方向，选择一个作为自己期末项目的目标，整个学习过程会更有针对性。

### 专业乐器方向

主要尝试制作通用的、已经商业化的专业乐器。例如：

音序器

![](https://mixmag.net/assets/uploads/images/_full/SEQ_2.jpg)

模块化的 MIDI controller

![](https://macprovid.vo.llnwd.net/o43/hub/media/1001/12979/headline-specialwaves-Mine-modular-MIDI-Controller.jpg)

### 实验乐器方向

这个方向简直就没有边界了……

![](https://catherineodson.files.wordpress.com/2017/01/15994547_10104285061140089_7978028209646499382_o.jpg?w=825)

![](https://www.bareconductive.com/wp-content/uploads/2016/03/FR9ZLIXIGQW6BSJ.LARGE_1000x667-720x415.jpg)

做点东西并不容易，要做出真实世界中存在的、能正常运转、甚至有点好玩的东西，就更困难了。

好消息是，你不是一个人。已经有无数的前人探索过，玩得不亦乐乎，还留下了许多...文档和源文件！我建议在学期之初，就去寻找一些让自己脑洞大开、心痒手痒的项目，作为标杆。如果能在一个学期内，逼近这些标杆，那么成就感将是巨大的。

挖宝地址：

- [NIME | Archive of NIME Proceedings](http://www.nime.org/archives/)
- [Musical instrument design](https://www.dezeen.com/tag/musical-instruments/)
- [Instructables - How to make anything](https://www.instructables.com/)
- [DF 创客社区](http://mc.dfrobot.com.cn/portal.php)

希望陪伴你们度过一个痛苦又有趣的学期~

LET&apos;S MAKE!

![](https://res.cloudinary.com/www-virgin-com/virgin-com-prod/sites/virgin.com/files/Articles/Music/Ototo_in_use.jpg)
</content:encoded>
        </item>
    </channel>
</rss>