SAP Fiori学习笔记

article/2025/9/14 6:25:58

资料链接:有些是需要自带梯子的哦~

Fiori Design Guidelines​experience.sap.com图标戴团长:SAP Fiori Design​zhuanlan.zhihu.com图标如何评价 SAP Fiori Design Guidelines?​www.zhihu.com图标https://mp.weixin.qq.com/s?__biz=MzIyNjY4NjQ3Ng==&mid=2247483792&idx=1&sn=7128698a3180eeb522ee37d29df48894&chksm=e86de2f3df1a6be5faf2dae491a24a4a749fd2ff78043a6188f6d46580112db9ccf5a551da6d#rd​mp.weixin.qq.com

 

SAP(德国开发的企业管理系列软件)

先对SAP有个了解吧(来自百度百科):

SAP公司也是目前全球最大的 ERP软件公司,SAP更是ERP软件的代名词。同时,SAP又是其ERP (Enterprise Resource Planning)软件名称,SAP是ERP解决方案的先驱,也是目前全世界排名第一的ERP软件,可以为各种行业、不同规模的企业提供全面的解决方案。SAP代表着最先进的管理思想、最优秀的软件设计,世界500强中有将近80%的公司使用SAP软件,中国将近90%的大型国营、民营企业使用SAP软件。

资料里“SAP Fiori”的解释:

SAP Fiori它指的是一个针对企业软件的综合设计系统。SAP Fiori提供了一套可在不同组合中重复使用的组件和模版,其中也包括相关的使用场景、视觉规范、如何复用、文本规范以及如何集成的说明和指导。这套设计系统不仅跨越多种技术、平台和交互模式,同时,SAP Fiori中的所有内容都遵循相同的设计价值观、原则和实践标准。”

“SAP Fiori的最初的应用程序集中于移动端的解决方案,当其发展到下一个阶段Fiori 2.0阶段,SAP Fiori 2的目标是将SAP Fiori设计应用于所有的核心的ERP方案。而今天,我们将进入下一阶段,即SAP Fiori 3,SAP Fiori设计系统将应用于智能企业应用领域里的所有SAP产品。”

  • SAP Fiori的意义在于 ——它开启了SAP和企业软件的用户体验革命。
  • 当我们将SAP Fiori 2构建到我们的旗舰产品SAP S/4HANA中,我们在2016年的Sapphire向客户展示它如何将ERP的强大功能与现代简单的设计结合在一起。
  • SAP Fiori 3 —— 一致性(Consistent), 集成(Integrated), 智能 (Intelligent)

“Fiori 就是大而全的设计规范,Material Design System 是小而精的设计规范。”

Fiori覆盖了Android和iOS两大平台,又有web端的规范应用,可以说是很全面地把方方面面都介绍到了,“大而全”形容觉得很贴切。


For Android篇:

基本组件完全遵循Material Design的定义,因为它们是Android UX的组成部分。SAP Fiori for Android颜色和排版将这些组件与应用程序的其余部分完全集成,并在所有组件中保持相同的可视语言。

Design Principles:

1. 基于角色的(Role-based);2. 自我适应的(Adaptive);3. 简洁大方的(Simple);4. 连贯一致的(Coherent);5. 令人愉悦的(Delightful)

Type system:

为SAP Fiori Android系统设置了自己的字体系统,SAP专有字体“72”。这种字体的设计特别考虑了Fiori的原则,使SAP Fiori Android设计保持一致。“72”经过优化,可在不同的上下文中提供可读性、清晰度和一致性。

Colors:

主色、文字颜色、按钮颜色、主题颜色(深浅主题下也有不同)、强调色

ICON:

(这里和以往MD、iOS的规范有所不一样貌似,这里icon的绘制要求没有其它的严格)

Layout:

Density-Independent Pixels (dp):密度独立像素(dp)

8dp/4dp Increment system:8dp / 4dp增量系统(这里的翻译不知道对不对?)

Keylines:

padding:

height:

Touch Target:手指触碰区域48x48dp,两个区域之间的间距是8dp


Attach(模式)

这部分官网讲的其实蛮细致的,最好还是去看一下官网上的具体内容比较好。

https://experience.sap.com/fiori-design-android/attach/​experience.sap.com

 


资源下载(提取码: aqvj) :

 

https://pan.baidu.com/s/1ENGiil8dT55ONkbZwIFMLQ​pan.baidu.com

 


For iOS篇:

Design Principles:

1. 基于角色的(Role-based);2. 自我适应的(Adaptive);3. 简洁大方的(Simple);4. 连贯一致的(Coherent);5. 令人愉悦的(Delightful)

Navigation:

Hierarchical Navigation:分层导航

Flat Navigation:平行导航

Modals:

模态用于帮助用户专注于完成任务或查看关键内容。(这部分没看懂)

Adaptive Design:

Time and Date Formats:时间表达

Accessibility:

颜色对比度:建议尽量争取4.5:1的色彩对比度,但优选7:1的比例。要确定合适的颜色对比度,请使用在线颜色对比度计算器。(我想知道这个颜色比例如何计算出来的?)

动态类型:动态布局,更加灵活

iOS辅助功能:除了色彩对比度和动态类型之外,还有更多方法可以确保每个人都可以访问您的应用。iOS提供了有关如何启用辅助功能的指导,例如语音,阅读支持,开关控制,听写等等。


Controls、Patterns:

Fiori for iOS Design Guidelines​experience.sap.com图标

这2部分还是去看看官网比较好,Fiori的控件说明和使用场景解释的真的很仔细。例如text input从intro、types、guidelines、behavior&interaction四个方面去说明。下图所示是text input的behavior&interaction,图中讲述的是信息输入的时候,不同字段信息存在内容差异,如何展示比较好。此类的例子比较多,感觉看它的控件部分,都能学习到很多东西。


For Web篇:

SAP Fiori于2013年推出,已从一系列应用程序发展为SAP软件的新用户体验。

SAP Fiori 2.0于2016年10月推出。

多设备支持:

响应与自适应;

移动优先:

从最小和最有限的设备开始,然后再是更大的设备;

SAP的UI主题设计器:

可以在这个设计器里编辑自己的主题,不过基础还是fiori的。这个网站我点进去查看过,愣是没找到使用路口,所以具体如何不太清楚,不过看到这个,联想到了之前推出的fusion design,总感觉有点相似。

运动设计:

平均眼球运动需要230毫秒(基于70-700毫秒的研究)。我们将通用动画分类为0 ms到500 ms。如果持续时间超过500毫秒,我们会说“连续动画”。

1.立即响应(<150毫秒)

当用户直接操作内容时,此持续时间适用 。如果需要此类型的动画(例如,要显示悬停效果,向下状态或拖放),设备必须立即做出反应,动画的持续时间不应超过150毫秒

据尼尔森诺曼集团称,0.1秒是用户感觉他们直接导致屏幕上发生某些事情的响应时间限制。例如,为了给用户提供他们直接操作表的印象,用户单击表列与突出显示的列之间所需的时间不应超过0.1秒。理想情况下,这也是排序列的响应时间。然后用户感觉他们正在对表进行排序,而不是命令计算机对它们进行排序。

2.小动作(150毫秒 - 250毫秒)

在某些情况下,应用程序会以如此快的速度响应交互,以至于用户可能无法跟踪屏幕上发生的情况。为了以更自然的方式呈现反馈,我们在元素在位置或状态之间移动时显示短动画。

3.大移动 (250毫秒 - 500毫秒)

如果需要在屏幕上描绘大的移动,请使用较长的动画持续时间以避免快速闪烁移动。

4.连续动画 (500毫秒 - ∞)

这些动画的持续时间是不可预测的。任何不到一秒的时间都应尽快反映在屏幕上。但是,某些交互具有未知的响应时间。占位符动画是连续动画的典型示例。

Fiori Design Guidelines​experience.sap.com图标

 


http://chatgpt.dhexx.cn/article/DYKbP8UM.shtml

相关文章

C++Prime Plus(2)

目录 21.for循环(1)22.for循环(2)23.while循环24.do while循环25.二维数组与嵌套循环26.if语句27.逻辑表达式28.条件表达式29.switch语句30.文件概念31.文本文件的输入输出32.函数详解(1)回顾33.函数详解(2)参数传递34.函数详解(3)数组传递35.函数详解(4)C风格字符串36.递归概念…

C++Prime Plus(1)

目录 1.C简介2.程序生成&#xff08;创建源码&#xff0c;编译和链接&#xff09;3.进入C4.C语句5.函数入门6.整型7.char&#xff0c;bool&#xff08;小整数&#xff09;8.const与符号常量9.浮点数10.算术表达式11.数组12.C风格字符串13.C风格字符串14.结构15.指针16.动态内存…

C++Prime Plus(7)

目录 96.输入输出概述97.使用cout输出(1)ostream基本功能98.使用cout输出(2)格式化输出99.使用cin输入100.文件(1)简单的文件IO101.文件打开的进一步讨论102.二进制文件访问103.随机读写 96.输入输出概述 C的输入输出是由库iostream中提供的一组类实现的&#xff1b; 流 C把输…

E-Prime软件包及安装

E-Prime软件包及安装 1 版本问题2 安装过程3 注意事项4 唠唠叨叨 Hello&#xff0c; 这里是行上行下&#xff0c;我是喵君姐姐~ 众所周知&#xff0c;E-Prime是实验设计的执行者。 当我们提出一个想法&#xff0c;则需要一个具体的软件来实现它。 而E-Prime相对于Matlab和Py…

Prime Sample

又发现了个框架 但没有代码啊~~ 还是搬来了&#xff0c;重要样本关注机制&#xff0c;一种新颖的目标检测框架 上论文 论文地址&#xff1a; https://arxiv.org/pdf/1904.04821.pdf 在目标检测框架中&#xff0c;平等对待所有样本并以平均性能最大化目标是一种常见的范例。在…

Prime Factors

此题需要使用到质因子分解的算法&#xff0c;可以参考以下链接&#xff1a; https://blog.csdn.net/qq_42410605/article/details/100150140 题目描述&#xff1a; Given any positive integer N,you are supposed to find all of prime factors,and write them in the form…

SpringBoot实现分布式锁

SpringBoot实现分布式锁 先了解一下线程数&#xff1a; 线程锁 线程锁&#xff1a;主要用来给类&#xff0c;方法&#xff0c;代码加锁&#xff0c;当某个方法或者某块代码使用synchronize关键字来修饰&#xff0c;那么在同一时刻最多只能有一个线程执行该代码&#xff0c;如…

深入理解ConcurrentHashMap原理分析以及线程安全性问题

在之前的文章提到ConcurrentHashMap是一个线程安全的&#xff0c;那么我么看一下ConcurrentHashMap如何进行操作的。 ConcurrentHashMap与HashTable区别&#xff1f; HashTable put()源代码 我们来看一下put 操作&#xff1a; 方法体 被 同步锁标记&#xff0c;由于同步锁的…

Redis分布式锁到底安全吗?

若有收获,请记得分享和转发哦 这篇文章我想和你聊一聊&#xff0c;关于 Redis 分布式锁的「安全性」问题。 Redis 分布式锁的话题&#xff0c;很多文章已经写烂了&#xff0c;我为什么还要写这篇文章呢&#xff1f; 因为我发现网上 99% 的文章&#xff0c;并没有把这个问题真正…

Java线程安全

前段时间有测试一个后端对账单和话单采集服务,在测试过程中有涉及到数据库读写逻辑和并发的场景,所以结合经验针对系统技术架构设计了部分并发场景结合数据库读写时可能出现的一些问题的用例,也确实出现了一些测试环境容易忽视,线上环境确确实实可能出现的问题,当然最后还是得到…

线程安全之 - ThreadLocal

ThreadLocal的底层原理 ThreadLocal是Java中所提供的线程本地存储机制&#xff08;线程内共享&#xff09;&#xff0c;可以利⽤该机制将数据缓存在某个线程内部&#xff0c; 该线程可以在任意时刻、任意⽅法中获取缓存的数据&#xff1b;ThreadLocal底层是通过ThreadLocalMap…

线程锁(ReentrantLock、synchronized)为何不能用作分布式锁

为什么使用分布式锁 分布式锁实现目前有三种&#xff1a; 数据库乐观锁&#xff1b;ZooKeeper的分布式锁;Redis的分布式锁&#xff1b; 在以前单体架构Web应用场景下&#xff0c;我们可以使用ReentrantLock或synchronized进行上锁&#xff0c;保证资源安全&#xff0c;现如今大…

Redis分布式锁真的安全吗?

大家好&#xff0c;今天我们来聊一聊Redis分布式锁。 首先大家可以先思考一个简单的问题&#xff0c;为什么要使用分布式锁&#xff1f;普通的jvm锁为什么不可以&#xff1f; 这个时候&#xff0c;大家肯定会吧啦吧啦想到一堆&#xff0c;例如java应用属于进程级&#xff0c;…

ThreadLocal能解决线程安全问题?胡扯!本文教你正确的使用姿势【享学Java】

跟对领导很重要&#xff1a;愿意教你的&#xff0c;并且放手让你做的领导要珍惜。 目录 前言正文ThreadLocal是什么&#xff1f;ThreadLocal怎么用&#xff1f;局限性InheritableThreadLocal向子线程传递数据开源框架使用示例 ThreadLocal不能解决共享变量的线程安全问题Thread…

Java线程安全详细总结

以下是我的PPT文档&#xff0c;不知道怎么复制到博客&#xff0c;只能一个一个插入图片发上来了。感觉总结的不错&#xff0c;分享一下。 文档地址&#xff1a;http://download.csdn.net/detail/csujiangyu/9526641

分布式系统详解--基础知识(线程)

分布式系统详解--基础知识&#xff08;线程&#xff09; 一、导读 前面跟大家讲了一下 分布式系统详解--基础知识&#xff08;概论&#xff09; &#xff0c;可以稍微了解一下大体上分布式是怎么一回事了。这片篇文章主要是讲述一下线程的问题分别介绍一下&#xff0c;什么线…

分布式项目线程安全问题(电商扣减库存的安全问题1)

电商减库存存在的安全问题 Override public void deductStock(Map<Long, Integer> skuMap) {for (Map.Entry<Long, Integer> entry : skuMap.entrySet()) {Long skuId entry.getKey();Integer num entry.getValue();// 查询skuSku sku getById(skuId);// 判断…

分布式项目中 如何保证线程安全问题?-------ZooKeeper

前沿&#xff1a; 上篇文章我们聊到了在解决分布式项目中线程安全问题&#xff0c;提到解决方案还有其他的&#xff0c;那么在此提出 基于 zookeeper 解决分布式项目中的线程安全问题 也是目前市面上比较流行的。做为一个高级开发工程师也是必须要学习的。 ZooKeeper是什么东…

分布式线程安全(redis、zookeeper、数据库)

https://blog.csdn.net/u010963948/article/details/79006572 Q:一个业务服务器&#xff0c;一个数据库&#xff0c;操作&#xff1a;查询用户当前余额&#xff0c;扣除当前余额的3%作为手续费 synchronized lock db lock Q&#xff1a;两个业务服务器&#xff0c;一个数据库&…

分布式集群中如何保证线程安全?

目录 分布式集群中的线程安全问题 解决方法 串行化 分布式锁 Redis如何实现呢&#xff1f; 问题&#xff1a;setnx刚好获取到锁&#xff0c;业务逻辑出现异常&#xff0c;导致锁无法释放 问题&#xff1a;可能会释放其他服务器的锁。 问题&#xff1a;删除操作缺乏原子…