万字干货！全新 UI 视角帮你掌握「界面三重构」的知识点( 七 ) 编辑导语：好的界面设计有利

文章图片
八、模型升级界面三重构模型中的界面可以替换成交互、前端、容器、用户、信息等，当然也可以替换成桌面端、Web、小程序、APP、B端设计等。
这样就可以把中间的要素抽象成N ，界面三重构模型升级为N——X轴、Y轴、Z轴， N可以为单一的内容比如界面，也可以是N=N+N比如界面加交互一起思考。
简化的模型更适合微观层面的细节设计，并不适合于宏观视角的分析设计。

文章图片
1.如何使用该模型我们来举一个组件的例子，比如导航设计共分为二级导航，我们常规会显示出一级导航。一级导航可以从X轴、Y轴两个维度去思考， X轴的多为横向全局导航， Y轴多为侧边导航栏。
当交互大兄弟来显示二级导航时可以平铺（XY）、上浮（Z）、内嵌（Z），二级导航展示方式还需要考虑容器大兄弟的意见，容器够大就可以选择平铺，容器小就展开收起的交互模式，展开就会有上浮和内嵌的两种形式。

文章图片
模型抽象的N是随时发生变化，对应的界面设计形态也会发生变化，但是X轴、Y轴、Z轴的方法和设计技巧是相对不变的。
只是你知道或不知道，会用或不会用的区别。产品设计中常用的两个方法是等价设计和同形异构。
2.等价设计等价设计是帮助用户完成任务的结果是一致的，但过程可能不同，又或者是产品的逻辑结构是一致的，但设计的外在形式有差别。
如图京东购物车的数量添加减少功能是展示出来的，直接可以添加可减少商品数量；但是淘宝购物车的数量是展示结果，修改商品数量需要点击后出现步进器组件。
这两个设计形式就是等价设计，等价设计的好坏需要考虑很多因素，用户、目标、场景、手段、行为、容器、信息关系、生活方式等。存在即合理，合适最重要。

文章图片
3.同形异构同形异构是指不同的信息、数据类型设计出相同的外在形式。
微信消息列表也中有微信广告助手、服务通知、订阅号消息、文件传输助手、个人聊天、群聊天等，这些消息的数据类型、对象各不相同。
可是外在的结构形式是一样的，这样做的目的是简化、统一，通过图标和头像来区分人、应用、工具的消息差异。

文章图片
以上总结的界面三重构相关知识、理论、技巧都有其使用范围，那么有没有一种设计方法可以凌驾于界面三重构模型之上呢，答案是肯定的，那就是隐喻设计。
九、隐喻设计什么是隐喻设计？我们应该怎么去理解它呢？隐喻可以理解为隐含的相似性，它用想象的方式将某一物体与另一物体相联系，并把二者的特征、情感等相互结合转移。
如果对隐喻设计感兴趣可以搜索我之前写过的文章《揭开隐喻设计的面纱-你不知道的隐喻设计》。
隐喻设计是通过象征、类比的手法将复杂抽象的概念简明化、具象化、降低用户学习使用的成本，为用户创造清晰、明了、舒适的操作体验。产品设计具体表现在苹果的ios操作系统和谷歌的Materialdesign 。
1.iOS六大设计原则之一iOS六大设计原则：AestheticIntegrity(审美完整性)、Consistency(一致性)、DirectManipulation(直接操作)、Feedback(反馈)、Metaphors(隐喻)、UserControl(用户控制) 。