一些不受关注的小细节设计提升作品高级感的技巧

简介: 在做UI界面设计时,有时候看着设计出来的界面总觉得不大好,但又不知道问题出在哪,这里其实考验的就是设计观察力。

资深设计师之所以强,往往就是强在对设计细节的把握能力,他们总能找到你所看不到的细节问题。大的问题往往一眼就能看出来,但设计品质高低往往就藏在这些设计细节中。观察力的提升也是来自于平时项目中的经验积累,为此,彩云围绕设计细节计划出一个系列文章,今天这篇文章是第一期,感兴趣的同学保持关注,后续会有更多设计细节干货文章连载更新,保证看完就能用到自己的工作中。

在这篇文章中,我整理了一些小的设计技巧,来帮助你快速改进自己的设计。有时只需要一些小的调整,就能快速提高设计的品质。
当你在设计一个高效、美观的UI界面时,有时只需要一些小的调整,就能快速提高设计的品质。有时候仅仅是简单的调整就能设计出让客户、用户和你自己真正满意的界面。

在这篇文章中,我整理了一些小的设计技巧,来帮助你快速改进自己的设计,提高用户体验。

适当使用文本装饰元素
有些人会拿极简设计出来说事,认为不应该加多余的文字干扰 ,界面上的内容都应该遵循有意义这个原则,这没有问题。但有时候增加文本的目的只是简单的为了“装饰”,这样是可以的。我们不希望所有的设计都变得平平无奇。

纯粹出于装饰原因而加入一些比较特别的元素也完全没问题,它可以不遵循可访问性标准,比如颜色对比度特别浅,看不清都没关系。只要这些元素不影响用户体验就可以。

UI界面中的不同元素要有区分度按钮、通知(文字链接)是用户界面中两个独立又重要的元素。如果可以的话,一定要确保用户在浏览你的网站或应用时能够快速且轻松地将它们区分开来。

按钮,在大多数情况下都是最重要的,所以在界面中一定要确保是最突出,并且很容易区分其他元素(例如:文本链接)。

使用更自然的投影

设计过程中我们通常都会用到投影。投影的恰当使用,可以有效提高视觉品质。在设计界面时,避免使用比较重的投影,降低不透明度,让界面看着更加自然。

使用让视觉更加清晰的字体
在设计中,字体适当都使用大写也是很不错的。它可以帮助你在设计中实现元素之间的多样性和对比度,提高视觉的整体效果。但要确保选择是合适的字体,行高和字重粗细,确保给用户呈现的内容清晰度。

面包屑导航设计要便于用户理解
导航的设计无处不在,通常会应用在内容比较多的网站上,但有时很难理解它所表达的意思。如果将字体颜色和粗细稍微调整下, 就可以让用户快速确定自己所在站点中的位置,以及他们可能需要去的其他地方。

例如:如果他们通过搜索跳转到某个站点的某个位置,这就特别有用。像上图中的设计一样,始终让导航链接中的最后一项让它在视觉上与其他有明显区别,这样用户更加容易理解。

少用过高饱和度的颜色
高饱和度的颜色(明亮的蓝色、红色、绿色等)在网站上是挺有视觉冲击力,并能吸引用户的注意的。但是如果过度使用它们可能会让用户的眼睛感到疲劳,尤其是结合文本内容一起使用的时候。

尽量少地使用高饱和的颜色,你可以尝试把饱和度降低,增加颜色中的灰度来使颜色变淡,这样不仅能避免用户视觉疲劳,还能更加突出重点内容,让用户阅读起来更加方便且不被视觉干扰。

使用用户熟悉便于识别的图标
在设计中使用图标时,最好使用用户熟悉并便于识别的图标,让用户能快速理解使用它能做什么。使用不能传达正确含义的图标,只会变成视觉噪音,引起用户混淆,成为用户的认知障碍。
减少标题的行高
冗长的正文需要足够的行高来增加可读性,而标题通常要短得多,所以你可以稍微减少间距。

标题的推荐行高通常是文本大小的1 – 1.3倍,标题文字越大,需要的行高就越少。

使用色轮上的邻近色不容易出错
邻近色,是最和谐的配色方案之一,当你在挑选颜色遇到困难时,它能给你很大的帮助。

一组由“主”、“次”、“再次”组成的邻近色可以帮你快速构建一个简单的、不会出错的配色方案。

相关文章
|
15天前
|
存储 人工智能 弹性计算
阿里云弹性计算_加速计算专场精华概览 | 2024云栖大会回顾
2024年9月19-21日,2024云栖大会在杭州云栖小镇举行,阿里云智能集团资深技术专家、异构计算产品技术负责人王超等多位产品、技术专家,共同带来了题为《AI Infra的前沿技术与应用实践》的专场session。本次专场重点介绍了阿里云AI Infra 产品架构与技术能力,及用户如何使用阿里云灵骏产品进行AI大模型开发、训练和应用。围绕当下大模型训练和推理的技术难点,专家们分享了如何在阿里云上实现稳定、高效、经济的大模型训练,并通过多个客户案例展示了云上大模型训练的显著优势。
|
19天前
|
存储 人工智能 调度
阿里云吴结生:高性能计算持续创新,响应数据+AI时代的多元化负载需求
在数字化转型的大潮中,每家公司都在积极探索如何利用数据驱动业务增长,而AI技术的快速发展更是加速了这一进程。
|
10天前
|
并行计算 前端开发 物联网
全网首发!真·从0到1!万字长文带你入门Qwen2.5-Coder——介绍、体验、本地部署及简单微调
2024年11月12日,阿里云通义大模型团队正式开源通义千问代码模型全系列,包括6款Qwen2.5-Coder模型,每个规模包含Base和Instruct两个版本。其中32B尺寸的旗舰代码模型在多项基准评测中取得开源最佳成绩,成为全球最强开源代码模型,多项关键能力超越GPT-4o。Qwen2.5-Coder具备强大、多样和实用等优点,通过持续训练,结合源代码、文本代码混合数据及合成数据,显著提升了代码生成、推理和修复等核心任务的性能。此外,该模型还支持多种编程语言,并在人类偏好对齐方面表现出色。本文为周周的奇妙编程原创,阿里云社区首发,未经同意不得转载。
|
23天前
|
缓存 监控 Linux
Python 实时获取Linux服务器信息
Python 实时获取Linux服务器信息
|
9天前
|
人工智能 自然语言处理 前端开发
什么?!通义千问也可以在线开发应用了?!
阿里巴巴推出的通义千问,是一个超大规模语言模型,旨在高效处理信息和生成创意内容。它不仅能在创意文案、办公助理、学习助手等领域提供丰富交互体验,还支持定制化解决方案。近日,通义千问推出代码模式,基于Qwen2.5-Coder模型,用户即使不懂编程也能用自然语言生成应用,如个人简历、2048小游戏等。该模式通过预置模板和灵活的自定义选项,极大简化了应用开发过程,助力用户快速实现创意。
|
5天前
|
云安全 存储 弹性计算
|
7天前
|
云安全 人工智能 自然语言处理
|
5天前
|
人工智能 C++ iOS开发
ollama + qwen2.5-coder + VS Code + Continue 实现本地AI 辅助写代码
本文介绍在Apple M4 MacOS环境下搭建Ollama和qwen2.5-coder模型的过程。首先通过官网或Brew安装Ollama,然后下载qwen2.5-coder模型,可通过终端命令`ollama run qwen2.5-coder`启动模型进行测试。最后,在VS Code中安装Continue插件,并配置qwen2.5-coder模型用于代码开发辅助。
387 4
|
5天前
|
缓存 Linux Docker
【最新版正确姿势】Docker安装教程(简单几步即可完成)
之前的老版本Docker安装教程已经发生了变化,本文分享了Docker最新版安装教程,其他操作系统版本也可以参考官 方的其他安装版本文档。
【最新版正确姿势】Docker安装教程(简单几步即可完成)
|
11天前
|
人工智能 自然语言处理 前端开发
用通义灵码,从 0 开始打造一个完整APP,无需编程经验就可以完成
通义灵码携手科技博主@玺哥超carry 打造全网第一个完整的、面向普通人的自然语言编程教程。完全使用 AI,再配合简单易懂的方法,只要你会打字,就能真正做出一个完整的应用。本教程完全免费,而且为大家准备了 100 个降噪蓝牙耳机,送给前 100 个完成的粉丝。获奖的方式非常简单,只要你跟着教程完成第一课的内容就能获得。