企业及高校合作：010-59833514 ‬咨询电话：400-810-1418 服务与监督电话：400-810-1418转接2
北京
b

北京

g

广州

h

杭州

s

上海

w

武汉

火星网校
课程导航
元宇宙设计
虚幻引擎视效表现大师班 虚幻引擎交互开发工程师班
游戏设计
原画概念设计大师班 游戏UI设计师班 3D模型大师班 游戏动作设计师班 游戏特效大师班 VR视效与交互大师班
剪辑包装
影视剪辑包装广告大师班 影视剪辑大师班
影视后期
影视原画与模型渲染大师班 3D角色动画大师班 影视特效与合成大师班
游戏程序
Unity3D游戏开发工程师班 虚幻引擎交互开发工程师班
U I 设计
AI+UX设计大师班
商业插画
商业插画高级设计师班 艺术设计基础班
IT 学院
WEB前端+全栈工程师班 人工智能+Python开发工程师班
室内设计
室内设计表现大师班 室内高级设计师班 室内高级设计研修班 BIM全科班 VR建筑与室内表现设计师班
当前位置：首页 >教程首页 > U I 设计 > AI+UX设计大师班 >优秀设计师必须知道的UI设计原则

优秀设计师必须知道的UI设计原则

发布时间：2018-11-17 19:57:24
 
今天这篇教程是在Joshua Porter总结出来的优秀UI设计原则的基础上，进行了重新整理并增加图文解说，以便于大家理解。
 
界面清晰最重要
 
界面清晰是UI设计的第一步，要想让用户喜欢你设计的UI，首先必须让用户认可它、知道怎么使用它，让用户在使用时预期会发生什么，并方便地与它交互。
 
▲ 正确示范｜界面没有任何的操作提示，用户就明白通过左右滑动屏幕来查看更多卡片，还知道卡片是以扇形为运动轨迹。
 
全力维护用户的注意力
 
在阅读的时候，总是会有事物分散我们的注意力。因此，在设计界面的时候，能够吸引用户的注意力很关键，千万不要将界面的周围设计得乱七八糟。
 
▲ 正确示范｜干净简洁的界面可以让用户更加沉浸在阅读的世界里。
 
让界面处于用户的掌控之中

人类往往对能够掌控自己和周围的环境感到舒服，不考虑用户感受的设计往往会让这种舒适感消失。保证界面处于用户的掌控之中，让用户自己感受主动权。
 
▲  错误示范｜用户不知道如何查看很多的卡片，除了查看第一张卡片的详情，其他的卡片脱离了用户的掌控。
 
直接操作的感觉最棒
 
当能够直接操作物体时，用户的感觉是最棒的。在设计界面时，我们增加的图标往往并不是必需的，比如我们过多的使用按钮、选项等等其他繁琐的东西仅仅是为了填满界面，这些都是画蛇添足。
 
▲ 正确示范｜图标的作用是以图形化的视觉形象给用户快速引导，如果只是装饰，就不如不要。
 
每个屏幕只提供一个操作主题
 
我们设计的每一个画面都应该有单一的主题，这样不仅能够让用户使用到它真正的价值，也使得上手容易，使用起来也更方便。如果一个屏幕支持两个或两个以上的主题，立马会让整个界面看起来混乱不堪。
 
▲ 错误示范｜这个界面是让用户输入登录，却将注册放在与登录同等重要的位置，干扰用户操作，会导致操作错误。比较好的做法是，将注册放在右下或登录按钮下方。
 
界面过渡自然
 
界面的交互都是关联的，所以要认真地考虑到下一步的交互是怎样的，并且通过设计将其实现。当用户已经完成该做的步骤，不要让他们不知所措，给他们自然而然继续下去的方法，以达成目的。
 
▲ 正确示范｜界面的交互非常清晰，点击向下展开，再次点击向上收起。
 
表里如一
 
如果它看上去像个按钮，那么它就应该具备按钮的功能。设计师不应该在基本的交互问题上耍小聪明，要在更高层次的问题上发挥创造力。
 
▲ 错误示范｜界面非常漂亮，但登录被弱化，并且表现形式雷同输入的提示文字，用户不易察觉。
 
区别对待一致性
 
如果屏幕元素各自的功能不同，那么它们的外观也理应不同。反之，如果功能相同或相近，那么它们看起来就应该是一样的。
 
▲ 正确示范｜元素排版整齐且统一，功能清晰明了。
 
强烈的视觉层次感
 
强烈的视觉层次感是通过界面上视觉元素提供的清晰浏览顺序来实现的，也就是说，用户每次都能按照同一个顺序浏览同一些元素。弱化的视觉层次没有给用户提供如何浏览的线索，用户会感到困惑和混乱。当一切都是粗体时，就没有主次之分了。
 
▲ 正确示范｜界面以用户的阅读习惯将层次拉开，从左到右，从上到下，元素之间互不干扰。
 
恰当的组织UI能够降低认知难度
 
正如John Maeda在他的书中所说，对屏幕元素的恰当组织能够使页面显得简洁，这能够帮助用户更容易并且更快地理解你的界面。
 
▲  正确示范｜将零散的元素进行组合，并以生活中常见的物品展示，用户更易理解。
 
颜色不是决定性因素
 
物体的颜色会随着光线的变化而变化，颜色是一个变化的性质，不应该在界面上起决定性作用。它可以用于提醒，但是不应该是唯一的区分元素。
 
▲ 正确示范｜通过鲜艳的色彩来提醒需要用户关注的内容，但是tiah不太认同颜色不能作为唯一的区分的观点，现在有很多天气、记事、时钟类APP极简的设计，常常采用色彩进行区分也非常赞。
 
渐进展示
 
在每个屏幕上只显示必要的内容，如果用户在做选择，那么给他们显示足够的信息，然后在各自的页面上展示详情，避免在某个界面过度展示所有细节。
 
▲ 正确示范｜用户只单纯地想播放音乐，所以列表页只需要当前播放状态、演唱者、专辑名和歌曲名，无需太多的信息。
 
零状态的界面
 
第一次访问界面是最重要的，但经常被设计者忽视，为了帮助用户适应，应该提供启动的方向和引导。
 
▲ 正确示范｜零状态结果本身对用户体验极其不好，更需要情感化或引导性的设计来降低用户焦躁的情绪。
 
优秀的设计是无形的
 
优秀的设计是没有痕迹的，如果设计是成功的，那么用户可以只关注自己的目的，而不是界面，不依赖于界面。
 
▲ 正确示范｜要想做到这点非常不易，tiah认为Yo做到了。
 
界面是被人使用的
 
只有用户使用你设计的界面时，才是成功的。如果一件衣服很漂亮，但是穿起来不舒服，那么设计是失败的。
 
▲ 错误示范｜视觉效果非常好，但是用户体验上非常糟糕，当前状态与主界面关联太弱，弧形轨迹阅读太累。

上一篇 2011年网页设计趋势全面分析

下一篇 《运动鞋写实制作》创作解析

返回列表
学员作品赏析
  • 2101期学员李思庭作品

    2101期学员李思庭作品

  • 2104期学员林雪茹作品

    2104期学员林雪茹作品

  • 2107期学员赵凌作品

    2107期学员赵凌作品

  • 2107期学员赵燃作品

    2107期学员赵燃作品

  • 2106期学员徐正浩作品

    2106期学员徐正浩作品

  • 2106期学员弓莉作品

    2106期学员弓莉作品

  • 2105期学员白羽新作品

    2105期学员白羽新作品

  • 2107期学员王佳蕊作品

    2107期学员王佳蕊作品

热门课程

专业讲师指导 快速摆脱技能困惑

相关文章

多种教程 总有一个适合自己

专业问题咨询

你担心的问题，火星帮你解答

火星资讯

链接合作QQ : 1336151628
室内设计 游戏培训 ui设计培训 影视特效培训 插画培训 原画培训 动画培训 平面设计培训 建筑设计 动漫培训 火星问答 web前端培训 技校 学技术 中专 动漫绘画教程 通用培训
关于火星
关于我们 人才合作 建议和意见
内容分类
频道专区 热门标签
火星优势
师资团队 教学模式 课程研发 学员成果 图书出版 资质认证
帮助中心
专业选择 考察学校 学习方式 如何就业 如何退费
联系我们
课程咨询：400-810-1418 人力资源：010-59833585 总机电话：010-59833333 监督电话：400-810-1418转接2 就业部：010-59833202 企业及高校合作：010-59833514 市场合作：010-59833359
©2021, www.hxsd.com 北京火星时代网络技术有限公司 电信与信息服务业务经营许可证070738号 京ICP备09083002号-6  京ICP证061064号  京公网安备11010502025474
获取验证码

×

确定