首页 > 其他分享 >uniapp 的ui设计思路。设计五要素

uniapp 的ui设计思路。设计五要素

时间:2024-12-05 14:11:39浏览次数:4  
标签:uniapp 圆角 界面 字体 ui 设计 大小 视觉

https://www.shejidaren.com/app-sheji-5-zi-jue.html
据说,界面设计能掌握这5字诀之人(形、色、字、构、质),APP设计都不会差到哪里去。

江湖上一直流传着这样一套理论,视觉设计语言五维度即“形、色、字、构、质”,说人话就是图形、色彩、字体、结构、质感。这套理论的来源我寻了很久也没找到,但是这套理论却经常出现在各种方法论里面。下面我来逐一分享一下我对这几个要素的理解。

APP设计5字诀:形、色、字、构、质
1、形
形就是指图形,界面中的图形就包括图标、卡片、图片,因此,icon的风格、卡片圆角的大小、图片圆角的大小,都会影响界面的风格,所以要进行规范。

2、色
色即是色彩,在界面中色彩不是单一的色调,它是整个色彩规范,什么时候应该用主色,什么时候应该用辅色,主色和辅色的比例,颜色在图标、文字、装饰上的应用,这些会影响人的整体感受,吸引视觉注意力,规范的配色搭配会让界面的视觉更加舒适。

3、字
字即是字体,字体的形式、字号大小、文字的间距都影响着界面的信息传递,选择符合产品特性的字体、合适的字号、舒适的间距都能让界面看起来更加精致。

4、构
构即是结构,也就是界面的内容布局,排列的方式、分割的方式、留白的多少,都是属于界面结构的范围,结构的定义非常重要,决定着界面是否具有呼吸感、通透感、舒适感。

5、质
质就是质感,也就是整体页面的感觉,通过圆角的大小、留白的多少、排版的疏密、投影的大小来决定整个质感是扁平的还是拟物的、高冷的还是活泼的。

知道了这五个维度之后该如何应用呢?我们可以应用在竞品的视觉分析里,项目的视觉改版里,项目初期的定风格阶段里,反正就是应用在一切需要整理汇报的地方,提升你设计的专业度和可信度,如果在你的述职报告或者作品集里面搞一下,档次一下子就上去了。

最近因为季度汇报,我发现有些领导可太爱听这一套大道理了,加了这些方法论之后,他就会觉得这个人有思考、能力强、有自己的方法论,不过是好是坏那就各自评说吧。

标签:uniapp,圆角,界面,字体,ui,设计,大小,视觉
From: https://www.cnblogs.com/cn-oldboy/p/18588435

相关文章

  • 008java课程设计-javaweb学生信息、成绩、课程管理系统
    文章目录javaweb学生信息、成绩、课程管理系统一、总体功能描述二、项目技术介绍2.1技术2.2环境三、功能实现3.1登录注册3.2信息管理及其他功能四、系统结构分析4.1系统结构图4.2数据库设计(E-R图)4.3物理结构设计五、报告获取源码+报告javaweb学生信息、成绩、课......
  • 计算机毕设-基于springboot的软件产品展示销售系统的设计与实现(附源码+lw+ppt+开题报
    博主介绍:✌多个项目实战经验、多个大型网购商城开发经验、在某机构指导学员上千名、专注于本行业领域✌技术范围:Java实战项目、Python实战项目、微信小程序/安卓实战项目、爬虫+大数据实战项目、Nodejs实战项目、PHP实战项目、.NET实战项目、Golang实战项目。主要内容:系......
  • 计算机毕设-基于springboot的母婴护理知识共享系统的设计与实现(附源码+lw+ppt+开题报
    博主介绍:✌多个项目实战经验、多个大型网购商城开发经验、在某机构指导学员上千名、专注于本行业领域✌技术范围:Java实战项目、Python实战项目、微信小程序/安卓实战项目、爬虫+大数据实战项目、Nodejs实战项目、PHP实战项目、.NET实战项目、Golang实战项目。主要内容:系......
  • 为什么大厂设计师离职后,都降薪转产品了?
    35岁设计师都去哪里了?这个问题是平时问我最多的,刚好前几天我采访了一好朋友abo,他是我入行就认识了,到现在10年多了,我记得我进阿里时候他就已经呆了三四年,如今已经呆了11年,abo在我印象,带队硬核,很帅,阿里内网的标签「阿里鹿晗」,为什么在这个环境下选择离开大厂了,去做一个产品,今......
  • 【最新原创毕设】基于SpringBoot的网上报修平台+94800(免费领源码)可做计算机毕业设计JA
    摘要随着信息技术的快速发展和普及,高校宿舍管理面临着诸多挑战与机遇。传统的宿舍管理模式,如手工记录报修信息、纸质文档管理等,已无法满足现代高校对效率和便捷性的需求。因此,开发一套高效、智能的网上报修平台显得尤为重要。基于springBoot的网上报修平台的设计和实现正......
  • 【学习笔记总结】华为云:应用上云后的安全规划及设计
    一、背景和问题        数字化时代,随着信息技术的飞速发展,企业和各类组织纷纷将自身的应用程序迁移至云端。云计算凭借其诸多优势,如成本效益、可扩展性、灵活性以及便捷的资源共享等,已然成为了现代业务运营的重要支撑。    今年,我所在企业也将IT系统全面迁移......
  • 【开源】A064—基于JAVA的民族婚纱预定系统的设计与实现
    ......
  • XCVU13P板卡设计原理图:509-基于XCVU13P的4路QSFP28光纤PCIeX16收发卡
     一、板卡概述     基于XCVU13P的4路QSFP28光纤PCIeX16收发卡。该板卡要求符合PCIe3.0标准,包含一片XCVU13P-2FLGA2014I、4组64-bit/8GBDDR4;4路QSFP284X光纤,每路光纤支持4X25Gbps,双向;支持32路IO。板卡工作温度范围0到60℃,板卡设计加工包含散热装置,支持服务器风冷散热......
  • 系统架构设计师第二版备忘录
    第1章绪论第2章计算机系统基础知识第3章信息系统基础知识第4章信息安全技术基础知识第5章软件工程基础知识5.1软件工程软件开发方法,架构中没有:5.1.2软件过程模型名称描述关键词瀑布模型WaterfallModel(架构176、系分247、软设248)需求明确增量模型Increme......
  • uniapp图片懒加载全局自定义指令
    UniApp图片懒加载在UniApp中,<image>组件的图片渲染策略是通过子元素div背景图(background-image)来进行处理,而不是直接修改src。全局自定义指令constlazyDirective={mounted(el,binding){constpic_src=binding.valueconstobServer=newI......