简介在过去的一年里，Figma一直是体验设计领域非常流行的工具。就在最近，我在Axure9.0和Figma之间频繁切换，深切感受到设计细节带来的体验差异。今天通过一些细节和亮点，总结出工具软件体验设计的几个原则。提前声明，本文不是比较软件工具的优劣，只是讨论设计技巧，希望对你有所帮助。本文主要内容包括：效率设计：提高用户行为效率简化设计：降低信息噪音视觉设计：减少用户思维成本效益设计工具软件的首要任务是追求效率，降低用户运营成本。1.模板化设置组件化设计Figma拥有强大的组件功能，类似于Axure中的主板，但更灵活。存在父子继承关系，父组件修改后，子组件可以同步修改。但是子组件在一定程度上也是独立的，内容可以编辑，保证了灵活性和易用性。Axure大师是强制性的。一旦修改了父组件的内容，就必须修改子组件。样式模板在Figma中，用户可以创建自己的颜色、笔触、阴影样式库，并在设计中随时调用，一劳永逸，减少频繁调整样式的运营成本。2.选择而不是输入预设选项可以有效提高用户效率。比如在设置字体大小的时候，Axure没有预设选项，需要用户手动输入修改。在Figma中，预设了常用的字体大小，用户可以从下拉列表中选择。另外，Axure的默认字号是13号，而Figma的默认字号是14号，更符合设计师使用的主流字号，减少了用户的修改次数。3.批量修改批量修改是我们最常用的提高效率的设计方法。Figma和Axure都有padding设置。而Figma可以一键操作，用户可以一次输入修改四个边距，调整效率更高。但是Axure如果要设置四边等距，需要一个一个修改，操作起来比较繁琐。简洁设计在工具软件中，对象的属性栏应该是用户的高频操作区域。在整体布局上，Figma和Axure基本相同，都包含3个模块。可以设置对象的各种属性，交互效果设计等，基础属性模块是用户操作的重中之重。而Figma属性栏通过信息分层展示、内容精简、布局有序等设计方式，为用户带来了更好的体验。1.分层显示，隐藏不需要的内容创建元素时，Figma属性栏默认只显示位置大小信息、图层透明度、颜色填充等基本信息。描边、投影、导出等设置只显示标题，所有内容隐藏。无显示可确保所见即所得的操作信息。当用户添加设置项时，系统会给出默认设置，用户只需根据需要修改内容即可。此外，Figma还使用交互式操作来减少页面上的信息量。例如，下拉选项默认不显示下拉按钮，而是在鼠标悬停时显示，让原本信息繁杂的页面变得更加清爽。而Axure则以平铺方式显示内容信息，无论用户是否需要操作，设置项的内容都会显示出来。这样的布局设计确实可以减少用户的一键式操作，但是低频操作的设置项反而增加了页面的信息量，成为页面的信息噪音。2、适应用户习惯，减少页面信息量。为了提高自助操作的效率，用户不会为所有的页面元素命名。事实上，用户命名的频率并不高。所以Figma在元素属性设置中没有修改元素名称的选项，而是放在图层列表中进行修改。在Axure元素属性中，名称作为主要内容放在顶部。3、统一对齐，信息更有序。两者在信息布局和对齐方面也有所不同。Figma采用自上而下的布局，功能标题在上，设置内容在下。信息层次更明显，更符合用户的浏览习惯。同时具有很好的一致性。另一方面，Axure使用左右布局，左侧是标题信息，右侧是内容项。我个人理解这种布局方式是在高度方向压缩尺寸，尽可能保证设置项在一屏显示，避免出现滚动条，增加用户操作成本。但是，这种布局方式在内容显示上造成了混乱。另外，长短不一的底边输入框也增加了内容的复杂度和混乱度，造成页面信息的杂乱感。视觉设计在设计工具中，视觉设计更多的用在位置相关的功能上，帮助用户更好的理解信息，从而降低用户的思考成本。所以两者都在设置选项中加入了可视化的形式。比如上面提到的Padding设置，Fimga采用了可视化的形式，用户可以直接填写标记。用户的思维成本更低，甚至可以说是0成本。Axure中的圆角设置和边缘可见性设置也可视化。并且可视化还具有操作功能，方便用户操作。写在最后，当然Figma中的设计细节远不止这些，但是很多设计并不是Figma的新创新，而是在Axure和Sketch的基础上进行了优化。所以，一个有价值的设计，并不一定是为了推翻世界，重新来过。也能站在巨人的肩膀上，做出符合自身产品定位和特点的设计方案。
