平面设计 - 允许重用通用元素的设计软件，例如编程的 DRY 原则 - 吾爱随笔录

平面设计网站设计工具工作流程

2022-02-18 05:14:06

通常，当我为 Web 设计时（无论是模拟还是网站的完整传播），我的文档中都有许多重复的元素。我希望遵循不要重复自己 ( DRY ) 的理念。

一个案例：我正在设计一个模型来说明用户通过网站的路径。为此，我从包含网站默认状态的 tabula rasa 页面开始。然后，我复制此页面并对其进行调整以适应用户交互的下一步。然后，页面的一些小方面会发生变化（例如标题颜色），我将被迫对我的模拟中的每一步进行更改。

那么，是否有软件可以让我一次制作我的设计部分（页眉、页脚、侧边栏、一组按钮等），重复使用它们，然后在需要时只在一个地方进行更改？

如果您熟悉的话，这类似于 Rails 或 Microsoft MVC 的 partials，但用于设计软件。

4个回答

大多数 Adobe 创意套件/CC 软件都有类似的工具。以下是一些主要的：

所有应用程序
- 动作，类似于可录制的宏 - 保存一组动作，然后用一个按钮执行它。
Photoshop：
- 智能对象（可重复使用的层和矢量数据包）
- 调整层（目的是改变它们下面的层，同时保持独立于它们下面的层 - 便于重复使用）
- 文本的基本段落和字符样式
插画师：
- 符号（可以保存为符号库并加载到文档中）
- 放置外部文档（File > place, 放置对外部文档的引用，以便多个文档可以共享一个元素）
- 图形样式（允许保存元素外观的元素、应用于多个元素并立即更新），以及文本的字符和段落样式
设计：
- 母版页（允许页面继承相同的元素；母版页可以从其他母版页继承）
- 放置外部文档（如 Illustrator，但使用更广泛）
- 大多数类型元素的样式：非常复杂的段落样式（包括自动应用字符样式的 GREP 规则）、字符样式、对象样式、表格样式、表格单元格样式...

人们有时将 InDesign 用于网站模型——即使它是为打印文档设计的——因为上述功能有助于模板化和避免重复。更多信息：什么软件最适合 GUI 设计？

Adobe Fireworks也有/有一些类似的有用功能 - 但 Adobe 从来没有认真对待 Fireworks，它有问题，他们最近宣布他们正在杀死它，并用模糊的营销绒毛代替它。

Axure 等交互式原型设计工具就是为此专门设计的。

如果我们谈论的是网页设计，那么在 HTML 中制作原型是我的首选方法，因为它变得非常容易重用元素。

正如其他人所说，许多 Adobe 产品也在设计工具本身内提供了这种能力。

有专门用于 UI 模型的软件。Visio有一组图形、Balsamiq Mockup、Microsoft Expression Blend（虽然这有点高级）和一个用于 UI Mockup Tools 的快速 Bing/Google 会产生大量结果——其中许多是免费的。

看起来Sketch 3有这个功能。他们称之为可重用元素。

也适用于 Sketch，但版本 2 我遇到了具有类似功能的插件 Symbols，但实际上没有 GUI

其它你可能感兴趣的问题