完善”交互与视觉”模块：

- “交互设计”中添加Origami和Framer的描述及配图; - "视觉设计"中添加Sketch的描述与配图添加“协作”模块该模块主要推荐了作为一个设计与开发兼顾的团队可能需要的优质协同工具 - 添加Zeplin的描述与配图 - 添加Slack的描述与配图 - 添加Trello的描述与配图其他模块后续完善
o2team · Jul 20, 2018 · d67ae65 · d67ae65
1 parent 9f01303
commit d67ae65
Show file tree

Hide file tree

Showing 12 changed files with 55 additions and 3 deletions.
diff --git a/source/_data/sidebar.yml b/source/_data/sidebar.yml
@@ -6,6 +6,7 @@ docs:
   id_vd:
     interactive: interactive.html
     visual:	visual.html
+    cooperation: cooperation.html
   dev_common:
     homebrew: dev-common/homebrew.html
     shell_terminal: dev-common/shell-and-terminal.html

diff --git a/source/docs/cooperation.md b/source/docs/cooperation.md
@@ -0,0 +1,22 @@
+title: 协作
+---
+
+## [Zeplin](https://zeplin.io/)
+
+如果你见过下面的黄色热气球logo，那你一定曾经在提高团队协作效率上做过考量
+
+![Zeplin Logo](../../img/zeplin.jpg)
+
+**Zeplin** 的开发团队成立于伊斯坦布尔的，这款软件作为一个团队协作软件，提供了设计师与工程师之间如何高效协作的解决方案，同属一个Team的成员可以共享设计图的色值、标线、字号等信息，降低沟通成本，同时可以和 **Sketch** 完美整合，直接产出生产环境可用的资源。 **Zeplin** 可以为你的团队带来更高的协作效率，值得一试。
+
+## [Slack](https://slack.com/)
+
+![Slack Logo](../../img/slack.png)
+
+**Slack** 是团队协作软件的先行者，国外使用较多，国内的 [**Teambition**](https://www.teambition.com/) 提供了相似的功能。
+
+## [Trello](https://trello.com/)
+
+![Trello Logo](../../img/trello.png)
+
+**Trello ** 是出众的项目进度管理工具，其最大特色是使用卡片的方式，可视化呈现项目进度和流程，同时可以通过不同卡片之间的拖拽操作，进行任务流程的跳转。
diff --git a/source/docs/interactive.md b/source/docs/interactive.md
@@ -7,3 +7,20 @@ title: 交互设计
 1. [Axure RP Pro](http://soft.macx.cn/5902.htm)
 2. [Briefs](http://soft.macx.cn/5442.htm)
     移动APP交互设计神器
+
+## [Origami](https://origami.design/) 
+
+**Origami** 意为“折纸”，由**Facebook** 出品的原型交互设计工具，正如其Logo一样，精巧无比
+![Origami Logo](../../img/origami.png)
+
+如果你使用过曾经在交互领域名噪一时的新闻App **Paper**，恰好你又是一名交互设计师（什么？你不知道！那请先看看[这篇介绍](https://www.uisdc.com/23-facebook-paper-design)），那么 **Origami** 就是其背后的强大工具。
+
+**Origami** 通过可视化蓝图构建交互效果，同时你可以使用配套的 **Origami Live** 应用在移动设备上实时预览你的交互效果。当然，与 **Sketch** 的集成也不在话下！
+
+## [Framer](https://framer.com/) 
+
+由 **Google** 出品的原型交互设计工具，瞧瞧它的Slogan --- “A little code goes a long way.”
+
+![Framer Logo](../../img/framer.png)
+
+没错！如果你是懂点开发的设计师，**Framer** 会是你的绝佳伴侣。想象一下，你将 **Sketch** 中做出的视觉素材导入 **Framer** 并有机组合 ，然后通过少量代码立刻让他们 “动起来”，让后在提供的配套移动设备中展示给其他人，这是多酷的一件事情！
diff --git a/source/docs/visual.md b/source/docs/visual.md
@@ -4,6 +4,16 @@ title: 视觉设计
 
 ## 软件推荐
 
-1. [Adobe CC 2015全系列](http://www.epinv.com/post/6082.html)
-2. [Sketch](https://www.sketchapp.com/)
-    移动APP设计必备
+### [Adobe CC 2015全系列](http://www.epinv.com/post/6082.html)
+
+### [Sketch](https://www.sketchapp.com/)
+
+![Sketch Logo](../../img/sketch-logo-dark.png)
+
+**Sketch** 是当下UI设计师不可避免的软件，主要专注于移动端，其引入的Artboard、Symbol、Export等概念极大的提升了移动界面导向UI设计，由于其初期的轻巧、快捷、没有历史开发包袱等特点，迅速占领了移动UI设计这一垂直领域的市场，撼动了Adobe在这里领域的地位。新版本的Photoshop等软件也加入了众多 **Sketch** 的类似特性，其影响力可见一斑。
+
+同时，**Sketch** 支持一个强大灵活的插件体系，可拓展性极强，其中就有国内开发者 [utom](https://github.com/utom) 制作的标线导出工具 [Sketch Measure](http://utom.design/measure)。你可以通过 [这个页面](https://sketchapp.com/extensions/plugins/) 寻找适合自己的插件:)
+
+新近版本的 **Sketch** 加入了Storyboard特性，对于原型图的产出提供了支持，同时你可以通过 **Sketch** 配套的移动应用 **Mirror** 在局域网络下实时预览你的设计在以真实屏幕上的显示效果。
+
+**Sketch** 是付费软件，也是Mac平台独占的优质软件，其优良的设计，便捷人性的操作和完善的操作流所带来的效率远远大于软件费用，墙裂推荐购买正版。
diff --git a/source/img/framer.png b/source/img/framer.png
diff --git a/source/img/origami.png b/source/img/origami.png
diff --git a/source/img/sketch-logo-dark.png b/source/img/sketch-logo-dark.png
diff --git a/source/img/slack.png b/source/img/slack.png
diff --git a/source/img/trello.png b/source/img/trello.png
diff --git a/source/img/zeplin.jpg b/source/img/zeplin.jpg
diff --git a/themes/navy/languages/en.yml b/themes/navy/languages/en.yml
@@ -26,6 +26,7 @@ sidebar:
     id_vd: Interactive & Visual Design
     interactive: Interactive Design
     visual: Visual Design
+    cooperation: Team Cooperation
     fd_rd: Full-Stack Development
     dev_common: Common Dev Configs
     homebrew: Homebrew

diff --git a/themes/navy/languages/zh-cn.yml b/themes/navy/languages/zh-cn.yml
@@ -26,6 +26,7 @@ sidebar:
     id_vd: 交互与视觉
     interactive: 交互设计
     visual: 视觉设计
+    cooperation: 协作
     fd_rd: 全栈开发 
     dev_common: 通用开发
     homebrew: Homebrew