恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
提升UI设计界面高级感的小技巧 优漫动游
0.0°
2023-09-28 好文转载 经验/观点 原作者: 广州UI设计培训 举报 135 0 0 0

在UI设计中,界面排版同样很重要,将有效的信息传递给用户这才是用户界面的功能,下面就给大家介绍能够提升你的设计高级感的小技巧。  

  在UI设计中,界面排版同样很重要,将有效的信息传递给用户这才是用户界面的功能,下面就给大家介绍能够提升你的设计高级感的小技巧。  

  1、强化层次结构来提升UI的清晰度  

  将必要的文本内容集合起来,重新组织,有意识地梳理视觉层次结构,要让用户能够清晰地感知到内容。对于信息层级,通常会按照标题、副标题、正文、引用说明等常见的文本元素构成。  

  而清晰的文本层次结构,是依托于符合文本本身所属层次的响应的样式,这样才能确保可读性。大标题应当突出,正文应当清晰明了,副标题起到的是对标题的辅助说明作用,所以应当适当缩小,这样一来,文本元素之前的大小关系,位置关系都更加清晰了。  

  一个经验法则是,通过修改字号大小的加倍和减半来快速理清相互关系。比如,如标题字使用了32px,那么正文字体使用16px来创建这个对比度。  

  在更加复杂多变的使用场景中,普通正文标题使用正文的2倍字号,标题中需要突出显示话,那么可以使用正文的3倍字号,而在特别的专题或者需要着重强调说明的场景之下,使用正文的4倍字号来呈现。  

  2、有意识地创造具有呼吸感的排版  

  字间距、行高、行长是在进行排版的时候,最常调整的属性。缺少足够的间距,可能会让文本难以阅读,但是间接过多,可能会让用户在阅读的时候感到稀疏难受。  

  行高  

  在不同的地方,可能会使用不同的术语来表述「行高」的概念,比如PS当中会使用「行距」来描述它,本质上,它们描述的是同一个东西——两行文本的垂直间距大小。  

  行高本身并不存在一个标准的数值,它通常取决于字体本身的特征以及设计需求。一般而言,很多设计当中,倾向于将行高设置为字体高度的1.5倍,在实际的设计当中,会根据字体本身的设计特征和应用场景(移动端阅读可能会适当增加,智能手表这种使用场景上可能会设置得更高),进行合理的调整。如果你的正文使用的是16号字体的话,那么这个规则可以直接拿来用——这是久经验证的。  

  字间距  

  字间距指的是文本在横向上的间距。很少有人会在横向的字间距的设置上花费太多的时间,但是它确实是会对阅读产生影响的。在英文字体当中,字间距通常会遵循下面的准则:  

  使用大写字母的时候,需要增加字间距  

  字号增加的时候,需要适当减小字间距  

  增大字体粗细的时候,需要适当减小字间距  

  行长  

  行长本质上说的是文本段落的宽度,文本每行的长度。通常,文本的行长要控制得相对短一点,这样易于阅读。在大屏幕上,比如1440px宽度的笔记本电脑屏幕上,使用每行60~80字符的长度(中文通常控制在每行35~42个字之间),但是,如果在是移动端的屏幕上,那么每行的字符数要缩短到35~45这个范畴(中文则可以控制在20~25个字即可)。  

  在选取文本字体的时候,需要考虑到潜在读者的体验。不同的字体能够给界面和体验带来截然不同的体验,字体的选择能够影响用户对于界面的第一印象。  

  注:英文字体通常不会有很大的选择空间,在这方面中日韩三国在文本字体上,存在的问题明显会更多一些。不过在移动端APP上,不少应用可以选择非系统默认的第三方字体,而在网页上,要实现起来会麻烦很多,所以通常只会调用本地的字体。  

  正确的字体选择,能够在信息和视觉两个层面给用户传递信息,错误的选择会导致误解和混乱的结果。  

  如果你在不同字体的搭配上,并没有足够丰富的经验,那么使用同一字体族的字体来进行设计,总是最为安全的选择。通常,一个字体族是为一个明确的目标来设计的。它们有着更为统一的、富有凝聚力的外观,在设计使用过程中,会更加便捷。  

  使用字体族的另外一个好处在于,它可以更快适配不同文本元素在排版上的需求,你可以更快地通过调整字体大小、粗细、文字大小、色彩来制造相应的对比,呈现不同的视觉效果。  

  另外,同一字体族当中,通常会附带有相应的斜体、等宽字体等等,这可以应对一些相对特殊的需求,而不用手工去修改。  

  在世界上绝大多数的国家和地区,所使用的文字排版都是从左到右的(比如阿拉伯语就是反过来的),阅读顺讯是自上而下的。这决定了左对齐是确保可读性的重要基准。  

  左对齐给人的双眼提供了一个扫读时候的基准位置,在大量、长时间阅读的过程在,极大地减小了阅读压力——而居中对齐则明显做不到这一点。  

  另外,还要额外注意一点,就是要避免在段落的最后一行只有一个字,单字成行在排版中叫「寡字」,这是需要避免的。  

  

Powered by Froala Editor

更新:2023-09-28

收藏

0人已收藏

KK的778

哦吼

  • 195

    作品

  • 0

    粉丝

  • 0

    关注

  • 如何让设计作品更有张力?优漫教育
  • 网站开发为什么要做交互设计?  优漫教育
  • UI设计师都应该具备哪些职业技能优漫教育
  • 找视频剪辑素材就上这6个网站  优漫教育
相关标签
广州Ui设计培训

    猜你喜欢

      2023-09-28 好文转载 经验/观点 原作者: 广州UI设计培训 举报 135 0 0 0

      提升UI设计界面高级感的小技巧 优漫动游

      0.0°

      你确定要举报提升UI设计界面高级感的小技巧 优漫动游

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2023年09月28日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      0
      0
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录