协众信息技术APP视觉设计规范

news/2024/11/29 1:56:53/

移动端显示有限,尽量突出界面功能网站中的导航可以做成百宝箱,显眼容易找到网站文字可以多些,多元化介绍:移动端少一些,简介明了  
  网站一个页面由很多个版块:移动端需要很多分层才可以表现移动端文字可以左对齐或者居中对齐,不要右对齐  
  APP设计规范  
  小程序与APP区别:导航(图标)有区别  
  设计风格:写实,简约,扁平  
  IOS常用尺寸:750*1334  
  中文:苹方  
  英文:FSB  
  android常用尺寸:720*1280  
  边距和间距  
  在移动端页面的设计中,页面中元素的边距和间距的设计规范是非常重要的,一个页面是否美观、简洁、是否通透和边距间距的设计规范紧密相连,所以说我们有必要对它们进行了解。  
  全局边距  
  全局边距是指页面内容到屏幕边缘的距离,整个应用的界面都应该以此来进行规范,以达到页面整体视觉效果的统1全局边距的设置可以更好的引导用户竖向向下阅读。  
  在实际应用中应该根据不同的产品气质采用不同的边距,让边距成为界面的一种设计语言,常用的全局边距有32px、30px、24px、20px等等,当然除了这些还有更大或者更小的边距,但上面说到的这些是最常用的,而且有一个特点就是数值全是偶数。  
  以iOS原生态页面为例,“设置”页面和“通用”页面都是使用的30px的边距。  
  再以微信和支付宝为例,他们的边距分别是20px和24px。  
  通常左右边距最小为20px,这样的距离可以展示更多的内容,不建议比20还小,否则就会使界面内容过于拥挤,给用户的浏览带来视觉负担。30px是非常舒服的距离,是绝大多数应用的首选边距。  
  还有一种是不留边距,通常被应用在卡片式布局中通栏显示,比如站酷APP(当然站酷APP也进行了改版,首页已经采用了不通栏的卡片式设计)。这种通栏显示的设置方式,更容易让用户将注意力集中到每个图文的内容本身,其视觉流在向下浏览时因为没有留白的引导被直接割裂,造成在上停留更长时间。  
  卡片间距  
  在移动端页面设计中卡片式布局是非常常见的布局方式,至于卡片和卡片之间的距离的设置需要根据界面的风格以及卡片承载信息的多少来界定,通常最小不低于16px,过小的间距会造成用户的紧张情绪,使用最多的间距是20px、24px、30px、40px,当然间距也不宜过大,过大的间距会使界面变得松散,间距的颜色设置可以与分割线一致,也可以更浅一些。  
  以iOS(750*1334px)为例,设置页面不需要承载太多的信息,因此采用了较大的70px作为卡片间距,有利于减轻用户的阅读负担,而通知中心承载了大量的信息,过大的间距会让浏览变得不连贯和界面视觉松散,因此采用了较小的16px作为卡片的间距。


http://www.ppmy.cn/news/52113.html

相关文章

cesium——相机飞行定位原理

Cesium飞行定位方法中,destination和orientation参数之间的关系可以用以下数学公式表示: 当只设置了destination参数时,相机保持当前朝向不变,直接飞往目标位置。 当只设置了orientation参数时,相机以当前位置为起点&…

C语言程序设计学习003——分支结构

在C语言中,分支结构是一种常用的控制结构,用于实现根据条件的不同而采取不同的措施。分支结构的语法形式包括if语句、if-else语句、if-else if语句、switch语句等,下面将逐一介绍它们的使用方法和注意事项。 if语句 if语句是最简单的分支结…

[读书笔记] 从问题和公式角度理解 Diffusion Model

[小全读书笔记] 从问题和公式角度理解 Diffusion Model 1. Diffusion Model的结构1.1 定义与限制1.2 定义与限制的数学体现 2. Diffusion Model的模型训练2.1 似然函数转换成ELBO2.2 拆解ELBO2.3 求解关键: q ( x t − 1 ∣ x t , x 0 ) q(x_{t-1}|x_t,x_0) q(xt−1…

java基础(一)-虚拟机和第一个命令

虚拟机: 用 Java 语言编写的程序由 Java 虚拟机 (JVM) 来执行。JVM 是一个特殊的程序,它知道如何执行用 Java 语言编写的程序。并且它的命令列表涵盖范围很大,比如: System.out.println(“你以为我会说虚拟机是由什么组成&#x…

Spring(11. 循环依赖 - 周阳)学习笔记

上一篇 :10. 面试问题简析 文章目录 1. Spring AOP1.1. Aop 常用注解1.2 测试前的准备工作1.2.1 业务类1.2.2 切面类 1.3 Spring4 下的测试1.3.1 POM 文件1.3.2 创建测试类1.3.3 Aop 测试结果 1.4 Spring 5 下的测试1.4.1 POM 文件1.4.2 创建测试类1.4.3 Aop 测试结…

【UE】倒计时归零时结束游戏

上一篇博客(【UE】一个简易的游戏计时器)完成了游戏时间每秒1的功能,本篇博客在此基础上完成倒计归零时结束游戏的功能 效果 步骤 1. 打开“ThirdPersonGameMode”,将剩余的秒数和分钟数的默认值分别设置为1和59 在事件图表中添…

Flutter 状态管理框架 Provider 和 Get 原理分析

为什么需要状态管理? 首先,为什么需要状态管理,这是因为 Flutter 基于 声明式 构建 UI ,使用状态管理的目的之一就是解决「声明式」开发带来的问题。 「声明式」开发是一种区别于传原生的方式,所以我们没有在原生开发…

对象=拷贝构造,有无指针成员的不同之处

比如类Add,Add AB: 1、当新声明一个对象并赋初始值时,使用时,编译器会默认,将B的成员变量,拷贝赋值给B,使用的是浅拷贝,该函数自己不写到类内部时,编译器会默认隐式自带&#xff1b…