Dosen原创

这是我学习quartz composer，Origami，看官方文档翻译下来的，每天一篇，有不准确的地方希望能指出，一起交流进步。转载请与我联系，擅自转载视作侵权。

Introduction      介绍

Origami is built on Quartz Composer, a graphics visualization application by Apple. This section will give you an introduction to its interface and the building blocks: patches and cables.

Origami是基于Quartz Composer，一个苹果的图形可视化应用程序。这章节将要向你介绍它的界面和组织结构：模块与连线。

1. Interface     界面

There are four main windows:

这里有四个主要的窗口：

Editor     编辑器

Also known as the graph. The editor is where you define all the layers, interactions, and logic for your prototype, using blocks called "patches".

就像图中所能知道的，这个编辑器是你为你的原型定义所有层，交互，和逻辑的地方，使用的“模块”。

Viewer     查看器

The viewer is where you see and interact with your prototype. You can preview and interact with your prototypes on your device over USB with Origami Live.

这个查看器是你能看到原型并与原型互动的地方。你也可以用USB连接手机，使用Origami Live预览并与你的原型进行交互。

Patch Inspector  “ ⌘ i ”      模块检查器

The inspector lets you change parameters for a selected patch. You can also use the docked Parameters view (accessible from the toolbar). The inspector contains three modes you can toggle with the dropdown at the top: Input Parameters “ ⌘ 1 ” , Settings “ ⌘ 2 ” , and Published Inputs & Outputs “ ⌘ 3 ” .

检查器让你为选择的模块更改参数，你也可以使用停靠的参数视图(可以通过工具栏打开)。检查器包涵三个通过拉下切换的模式：输入参数 “ ⌘ 1 ” ，设置 “ ⌘ 2 ” ，发布的输入和输出 “ ⌘ 3 ” .

不是很理解发布的输入和输出具体是干嘛的，望懂的朋友告知

Patch Library  “ ⌘ ⏎ ”      模块库

The Library is where you can find and add patches. You can add patches even faster using the Origami keyboard shortcuts.

库是找模块和添加模块的地方。你可以使用快捷键，更快速的添加模块。

A good way to organize your windows is Window > Resize to Thirds “ ⌘ ⌥ ⌃ 0 ”  to dock your Editor to the left and Viewer to the right, and only bring up the Inspector/Library when you need them.

一个组织视图的好方法是Window > Resize to Thirds “ ⌘ ⌥ ⌃ 0 ”来固定你的编辑器在左边，查看器在右边，在你需要的时候再打开Inspector/Library。

2. Patches      模块

Patches are the building blocks of Origami. They are used to capture interactions, compute logic, and draw to the viewer. Patches can talk to other patches using cables attached to their ports. You can add patches from the Patch Library “ ⌘ ⏎ ” .

模块是Origami的组织结构。他们常用于捕捉交互，逻辑运算，往查看器上绘制。在模块的接口上连线可以传递数据。你可以从模块库“ ⌘ ⏎ ”中添加模块。

Patch types:

模块类型：

Black (Processor) patches take inputs and process them to create various outputs.

黑色(运算)模块可以接收输入并处理它们创建多个输出。

Purple (Provider) patches are similar to processors, but typically provide interactions (e.g. Interaction 2, Swipe, Keyboard...) from the viewer.

紫色(素材)模块和processors相似，不同的是，它提供查看器中典型的交互组件(例如：Interaction 2，Swipe， Keyboard...)

Blue (Consumer) patches are what's displayed in the viewer.

蓝色(视觉)模块是决定查看器上显示什么。

Patches must be connected to a Consumer (like a Layer) to work. This helps optimize the performance of your prototype.

模块必须连接一个Consumer(像是一个层)去工作，这会帮助你的原型性能更优化。

3. Ports      接口

Ports allow patches to take information in and send new information out. The ports on the left side of a patch are inputs, and the ones on the right are outputs. You can edit Inputs with the Patch Inspector  “ ⌘ i ” or double-clicking the port.

接口允许模块将数据输入，并输出新的数据。在模块的左侧是输入接口，在右侧的只有一个的是输出接口。你可以通过模块检查器或者双击接口来编辑输入接口。

Each port has a different type of information it can take — the important types of values used in Origami are:

每个接口都有不同的数据类型——Origami中常用的重要的数据类型是：

Number: Any number, with decimals

数字：decimal类型的任何数字。

Boolean: Also known as On/Off, and represented with a checkmark. Can be turned into a Number with 0 being Off and 1 being On.

布尔：众所周知的开／关，可以转换为数字0(Off)/1(On)。

String: Also known as text.

字符串：文本。

Image: Any image that you drag, paste, or create.

图片：拖动，粘贴或创建的任何图片。

Color: Any color.

颜色：任何颜色。

Index: Any non-negative, round numbers. i.e. 0, 1, 2,...

索引：任意非负数，循环数字，例如：0, 1, 2,...

Structure: Stores any number of values within, labeled by indexes or keys (see Structure Creator). Similar to an Object/Dictionary in programming.

结构体：包含任意个值，用index或key做标签，和编程中的对象/字典相似。

Interaction: Ties patches together for interactions. Mostly used in Interaction 2 and Layer patches, and displayed unlabeled in the top right/left respectively.

交互：为交互把模块连接在一起。大多数用在Interaction 2和Layer模块，显示分布在在顶部左侧/右侧没有标记的。

Interaction这两句不知道怎么翻译，原文看得我云里雾里。

4. Cables      连线

Cables pass information (values) from patch to patch via their ports. Think of values like water and electricity, and cables as the pipes and cables that move them from place to place. The values flow in one direction: left-to-right from an Output to an Input.

通过接口的连线在模块和模块之间传递数据(值)。把值想象成水和电，然后连线就是管道，它们通过管道从一个地方移动到另一个地方。值的流动只有一个方向：从左至右，从输出到输入。

To create a cable, drag from an output port (on the right of a patch) to an Input port (on the left of a patch). To disconnect a cable, drag the rightmost end out of the Input port.

创建一个连线，从一个输出接口(在模块的右侧)拖动到一个输入接口(在模块的左侧)。断开一个连线，拖动最右边的尾端离开输入接口。

An Output may have multiple cables connected, but an Input can only accept one cable at a time. Use patches like Math, Logic, Transition, or Multiplexer to combine or select from multiple cables. To quickly connect an output to multiple inputs, drag from the output and hold “ ⌥ ”  while clicking on the inputs.

一个输出接口可以有多个连线连接，但是一个输入接口在同一时间内只能有一个连线。像数学，逻辑，转换，或者复用器一个使用模块去组合或选择多种连线。快速连线多个输出到一个输入，按住“option”，从输出接口拖动，然后点击输入接口

Note that an Input port can either have a cable connected to it, or a value that you manually enter in.

注释：一个输入接口可以有一个连线连接它，也可以手动的输入一个值。

5. Connecting them together      把它们连接在一起

An example of a typical setup of patches is shown below, where 3 different patches pass values to each other with cables through their ports in order to create an Interaction that Switches a Layer on and off.

下面展示的是模块的一个典型例子，这三个不同的模块通过给接口连线在互相之间传递数值，创建了一个可以通过交互来开关的层。