• 在线客服

  • 扫描二维码
    下载博学谷APP

  • 扫描二维码
    关注博学谷微信公众号

  • 意见反馈

原创 10个小技巧帮助UI设计快速提升自身设计能力

发布时间:2019-07-08 17:50:41 浏览 6507 来源:博学谷资讯 作者:枫调

      互联网时代,用户面对数以千万计的信息爆炸,很难将实现固定在某个平台上。而企业为了获取更多的忠实用户群体,必然需要从用户的角度出发,为用户提供更加完善的视觉体验以及使用体验。因此UI设计师的设计能力成为企业最看重的一点。那作为UI设计师如何提升自己的设计能力呢?

     

    10个小技巧帮助<a href = 'https://www.boxuegu.com/news/819.html' target='_blank' style='color: #466de2;font-size: 14px'>UI设计</a>快速提升自身设计能力

     

      大部分的设计师通过自身长期的实践积累设计经验,从而提升自己的设计能力。而这里小编为大家提供10个小技巧,让你快速掌握UI设计师的设计能力。

     

      一、足够强烈的色彩对比。背景和字体必须有足够区分,阅读起来不伤眼睛。白底黑字是极容易辨认的。不要使用浅灰、黄色或绿色。如果别人必须眯着眼睛才能看清文字,那肯定是有问题的。

     

      二、深灰比黑色更好。如果可以的话,尝试使用#333333 RGB(51, 51, 51),而不是黑色,作为文字颜色。黑白对比晃眼睛,让人更难集中注意力。

     

      三、重要内容放在前面。布局是帮助使用App或网站的重要信息。重要的内容应该是一眼可见的,不需要缩放、滚动或点击。

     

      四、对齐一切。如果你感觉哪里有些不对,很快的解决方式很可能是把不对齐的东西全部对齐。有时设计师会念叨需要使用“栅格”,这其实是在提醒团队需要解决对齐的问题。确保元素对齐是改进任何App或网站的很简单的方法,可以立马让视觉效果提升10倍。

     

      五、文字尺寸和留白。我们是给人做设计的,不是给蚂蚁做的。增加文字尺寸并多留些空白能够确保内容更加易读。

     

      六、如果顺序很重要的话,使用列表。大部分移动/网页App有搜索功能,对于应该如何展示搜索结果,可能有些争议。如果顺序是很重要的,那么列表是很有效的。如果顺序不重要,并且还鼓励用户多浏览探索(像是PinterestAirbnb),那么网格视图就可以提供更多的信息,方便用户浏览探索。

     

      七、先做灰度设计,再上色。灰度设计能够确保聚焦于关键的用户体验。颜色牵扯到较多的情绪反射,并且容易打扰我们所聚焦的关键问题。

     

      八、设计用起来舒服。手的使用是一个重要的问题,Luke画出了手机上极容易使用的部分(对于右手来说)--我挺喜欢那些可以设置左右手的App的。很多高效的手机App确保导航和主要操作在手机的底部。

     

      九、借用色板。色彩是一种难以捉摸的艺术。我强烈推荐大家去dribbble搜索“Color Palettes”或者使用色板编辑器,如Coolors或者Color Claim。这样做可以节约好几个小时的争论、纠结的时间。

     

      十、使用AppleGoogle的系统设计规范。这两家公司都有很棒的资源帮助任何人搭建AndroidiOSApp。例如,GoogleMaterial里有设计原则、资源、色彩、图标和控件,能够帮助你迅速开始App设计。

     

      以上就是帮助UI设计快速提升自身设计能力的十个技巧。在UI设计的岗位上,有很多朋友将这些小技巧分享出来,最关键的是你是否学习了这些小技巧后真正的运营在实际工作中,并通过总结归纳变成你自己的知识体系。这也是为何有些UI设计师仅仅是5000的月薪,而有些设计师的年薪30万以上。

    申请免费试学名额    

在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!

上一篇: UI设计师工作常用的7个利器 下一篇: 什么人适合学习UI设计?零基础能学会UI设计吗?

相关推荐 更多

热门文章

  • 前端是什么
  • 前端开发的工作职责
  • 前端开发需要会什么?先掌握这三大核心关键技术
  • 前端开发的工作方向有哪些?
  • 简历加分-4步写出HR想要的简历
  • 程序员如何突击面试?两大招带你拿下面试官
  • 程序员面试技巧
  • 架构师的厉害之处竟然是这……
  • 架构师书籍推荐
  • 懂了这些,才能成为架构师
  • 查看更多

扫描二维码,了解更多信息

博学谷二维码