每人每天仅限5票,快给你心仪的作品鼓励的一票。
投票一直在尝试从美术生的角度去理解技术开发中提到的UI kit,了解的越深入,发现这些都是术语。作为设计师,需要弄清楚设计界面的各个知识点,并能明白研发在说什么,足以满足工作需要,但如果你想变得更专业。还是建议一起学学代码,了解研发的工作方式,沟通起来会更加顺畅。我的学习从官方人机交互指南pdf开始。
推荐文章:iOS人机交互指南官方文档(2018已更新到 iOS11)
https://developer.apple.com/ios/human-interface-guidelines/overview/themes/
接下来说说 我对控件的理解:
控件指设计界面中既可组合、又可独立拆分的视觉元素。通常又叫UI kit,主要作用就是增强界面元素的复用性,保持视觉样式的一致性,减少设计工作量,达到优雅而高效的完成设计任务的效果。将设计组件应用到实际研发过程中,共用元素经过一次紧密沟通后,往后直接根据视觉图复用即可。不需要跟着版本迭代,重复标注、切图。从这点上看,也大大降低了设计和研发的沟通成本。
所有的UI kit 都来源于Android、iOS、Windows这三大系统的人机交互指南。虽然这三类系统的应用采用技术语言不同(Java、Swift、C++、Phython...)但前端展示页面的逻辑基本一致,只是因为设备的物理尺寸类型不同,页面展示有各自的风格,最终人机交互指南的规范不同而已。
以iOS为例:
手机端-常见UI Kit包含状态栏、导航栏、tab、弹窗、loading、列表、表格、表单等待。具体描述:如下图
Android、windows所属控件同iOS大同小异,只是用户操作的交互方式、程序调用控件的类/库略有不同。
例如删除功能:
iOS-左滑删除居多
Android-长按删除居多
Windows-(很久没用了,我不记得了)
接下来,将整理一些以样机尺寸设计时,各系统关键组件在样式、高度上的差异化:
每人每天仅限5票,快给你心仪的作品鼓励的一票。
投票
发表评论