首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

SVG微信交互图文|苹果交互图文里有哪些排版设计原则?

设计的力量不容置疑,苹果公司成为用户设计体验的最佳典范,不仅是产品设计上的极高体验感,在其他宣传渠道与品牌相关的视觉元素展示中也不遗余力拥护设计的力量。今天从苹果的往期推文中,介绍一下苹果设计师告诉我们的视觉设计法则。

Apple《新 iPhone SE 预购。预备,购。》

在苹果该篇推送中,运用到的是视觉设计者最有效的设计工具之一——网格系统(Grid System)。在《交互设计精髓》一书中介绍它主要指“网格将屏幕分成多个大的水平和垂直区域,也称之为栅格系统。其在第二次世界大战后该系统在瑞士排版人员中开始流行,为布局提供了统一且一致的结构,对于设计视觉层次较多和功能上较为复杂的界面特别重要。”

从定义上就能快速理解其营造出的有序工整的风格。但是网格系统模块化设计不代表一致遵循左右完全对称原则,完全对称虽然达到视觉的一致性,却无法刺激用户的眼睛在屏幕上流动,甚至容易感到视觉死板并且增加阅读疲劳,导致内容未读完就流失大部分用户。所以在符合高效视觉逻辑设计的同时,利用平衡的不对称和设计主要屏幕区域,为用户提供视觉入口。正如苹果该推文主屏幕模块展示商品的同时,下方的模块化设计实现了平衡的不对称,模块化分区展示产品性能为用户制造视觉逻辑路径,同时也建立的阅读逻辑在通读全篇下来,即可大致了解产品的主要特性

对于交互图文,合理使用模块化的网格系统布局,有效规划在不同屏幕之间保证内容的整齐一致,视觉不同层次的元素和结构的强调,可以容纳多种适合的交互控件,能让开发者做出最合适的布局决策。其次是减少了在设计优化阶段大面积的迭代修改,方便地修改和扩展。除此之外,利用模块化的“意符” 创造视觉逻辑路径与界面互动,可以帮助用户快速找到到关键的界面元素,达到视觉上的高效提高界面的可读性,又能高效执行交互行为,让最小的视觉和模块化的功能元素发挥最大效能,同时创造美学上的舒适感。

无论交互设计还是日常视觉设计中,合理使用良好的布局网格模块化,规划足够灵活多变内容上,同时保持视觉效果一致性,正如苹果设计中其他产品一样,达到简洁又一致的舒适体验感,为用户营造简单、高效以及有益的体验感。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20201217A08RIF00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券