火星网校
大神分享的UI设计&交互设计细节技巧
发布时间：2024-05-10 14:47:41 浏览量：214次
UI设计靠细节，而大神们总结的设计细节经验绝对是干货，今天分享的这篇，海外大神总结的UI设计&交互设计细节经验，可以帮助你以四两拨千斤的方法，大大优化交互体验效果，enjoy！
这篇文章对初学者来说特别有用，但我还是建议所有设计师都应该把这些设计基础牢记在心，无论是否有经验。本文更偏向一些基础性的设计原则，而这些原则在实践中却往往被人遗忘。希望下面这些原则对你的设计能起到一个进阶调优的作用。
1.排版设计
首先声明一下，在一个项目中不应该使用2种以上的字体，以及它们的多种风格样式。这句话非常重要，希望大家无论如何也要遵循这个原则。下面我们来谈点更具体的细节。
文字间距
每当你使用完全由大写字母组成的文字时，不要忘记设置字母间距。这样可以防止字符之间的粘连，也会让文字有更好的可读性。
文字粗细
在使用细体和极细体字体的时候要格外注意。中细体字可以用，但要看具体的字体细到啥程度。如果你做的产品最终会被用户在屏幕上看到，那么最好不要使用细体和极细字体，因为它们非常难阅读，在某些屏幕上甚至会造成半像素模糊的效果。
标题和正文字体大小
我们来谈谈网页排版。标题的级别有6个（h1-h6）。首先你应该确保你的项目中的标题级别不超过四个，并控制好它们的逻辑和一致性。一个网站或着陆页的最大标题（可能出现在主页面的第一块）可以随心所欲：目前的趋势是鼓励有表现力的排版。但是，确保你的标题的其余部分不要太大，因为太大的文字和太小的文字一样难以阅读。现在说下正文。浏览器的默认设置（以Chrome浏览器为参照），会以16px大小显示每个文字。这个大小阅读起来是相当舒服的，但我倾向于主文字用不小于17px，附加文字用14px。保留12px作为最小的尺寸，而较小的尺寸由于视力问题或显示器不好而变得几乎无法阅读。记住，要避免近似的尺寸，不要在同一段中使用16px和17px，这样会给产品的外观带来混乱和视觉上的不协调，可能会让人误以为是错误。
行高
很少可以直接利用默认行高。通常情况下，必须比默认值稍大一些来提高可读性。这对于大的文本块尤其如此：博客、文章、网站或移动应用的信息块。同样的方法也适用于标题：确保字母上下不会互相碰触。
内容的层次
应使用加粗来突出显示文本的重要部分，包括标题、链接和按钮，有时也包括文本中被强调的部分。但如果所有文本内容都被加粗，就会变得不清楚该看哪里，分不清哪些部分更重要。内容需要有一定的层次性。
文字对比度
在设计中要特别注意文字的颜色。它应该有足够的对比度，这样文字在任何类型的显示器上都可以易读。这对于经常使用浅灰色的输入字段中的占位符尤其重要。
2.间距和边距
...内容填充
重复的示例文本放在设计中看起来会很廉价，不专业，所以应当避免使用。它只会让人觉得你懒得得去做一些像样的内容。此外，现在不再需要自己创建，有一堆Sketch和Figma的插件可以自动填充内容。内容尽量不要重复，哪怕只是为了演示的目的。放上不同的图片、标题和不同长度的预览文本，效果看起来会更好。 每条规则都有其例外。所有给出的建议从来都不是教条，总会有不同的情况。但在大多数情况下，这些建议会帮助你提高设计水平。希望这篇文章对你有帮助， 谢谢你的阅读。
热门课程推荐
热门资讯
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
3. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
探索零基础UI设计培训的时长与薪资前景。了解数字艺术教育领域的专业课程，以及培训后的职业发展机会。
-
ui设计应该让用户一目了然,能够快速找到所需的信息和功能。在设计过程中,应尽量使用简洁的图标、文字和色彩,避免过多的视觉干扰。符合用户习惯:ui设...
-
9. 设计中的色彩心理学:浅析中西方色彩的历史演变与设计应用
摘要:本文探讨了色彩的历史演变和设计应用。通过对色彩在早期文明社会中的实用运用、不同文化背景下色彩观念的差异、色彩在设计中的重要性以及新兴技...
-
10. 武汉UI设计培训班费用怎么样？想学UI设计要多少钱？
想了解武汉UI设计培训班的费用是多少吗？不知道学UI设计要花多少钱？不妨看看这篇文章，了解UI设计培训班的学费价格以及学习内容。
