Très souvent associé à SAP Fiori, SAP UI5 est pourtant une entité de SAP à part entière. Ce framework permet de créer facilement des applications grâce à une collection de bibliothèques contenant de nombreuses interfaces, icones et autres applications de démonstration…
12/04/2023
Ne confondez plus SAP Fiori et SAP UI5
6 minutes de lecture
Table des matières
Un projet ? Une question ?
Laissez-nous vos coordonnées pour qu’un de nos experts vous recontacte très rapidement
Si vous utilisez SAP depuis un certain nombre d’années, vous avez peut-être connu la version de l’ERP aux écrans spartiates et à l’incroyable quantité de menus qui vous obligeaient à passer des heures à réaliser des tâches pourtant simples à priori.
Heureusement, SAP a su écouter les différentes plaintes et propose depuis quelque années SAP Fiori qui fonctionne sous le framework SAP UI5. D’ailleurs, on voit de très nombreuses publications qui n’hésitent pas à parler de la technologie SAP Fiori UI5.
Dans cet article, nous avons décidé de mettre en avant SAP UI5 qui est injustement méconnu et souvent confondu avec d’autres innovations SAP.
Qu’est-ce que SAP UI5 ?
SAP UI5 est l’acronyme de SAP User Interface 5 même si aujourd’hui, il a été remplacé par SAP Open User Interface 5, la dernière version en date. Il s’agit d’un framework de programmation basé sur Java qui facilite notamment le développement d’applications web HTLM5.
Plus simplement, SAPUI5 est une collection de bibliothèques que les développeurs peuvent utiliser pour créer des applications de bureau et mobiles qui s’exécutent dans un navigateur.
Avec la boîte à outils JavaScript SAPUI5 de SAP, les développeurs peuvent créer des applications Web SAP à l’aide des normes de développement Web HTML5.
SAP construit constamment non seulement les API (Application Program Interface), mais fournit également des éléments d’interface utilisateur, des icônes, des polices, des exemples, etc. préconstruits et prêts à l’emploi :
- Plus de 200 éléments d’interface utilisateur avec différentes variantes qui sont réactifs par conception et indépendants de l’appareil et du navigateur. Ils ont des comportements à la fois compacts et confortables
- Plus de 600 icônes dans la bibliothèque de polices SAP pouvant être utilisées sans avoir à se soucier des problèmes de propriété intellectuelle. Combinez-les avec différentes couleurs et les développeurs n’auront pas à courir derrière les concepteurs UX pour fournir des icônes et des images
- Les icônes faisant partie de la police SAP peuvent être dimensionnées et colorées en fonction des besoins du projet et du client
- Des applications de démonstration pour aider à comprendre les différentes fonctionnalités du développement de certaines applications
- Un très grand nombre de tutoriels appelés aussi « Guides du développeur » soutenus par une communauté de développeurs SAP très actifs et expérimentés.
Les éléments prêts à l’emploi permettent d’économiser du temps de développement, réduisant ainsi le délai de mise sur le marché et les coûts de développement et de maintenance.
Les Origines de SAP UI5
A la fin des années 2010, un groupe d’experts a été réuni avec un objectif précis : celui de développer une nouvelle technologie d’User Interface pour remplacer celle de SAP de l’époque. En effet, la firme allemande faisait face à de nombreuses critiques :
- Un manque d’extensibilité général
- L’impossibilité d’utiliser de nouvelles fonctionnalités CSS ou associées au navigateur
- Une relation indissociable avec le backend
- L’impossibilité de développer dans un langage autre que ABAP ou JAVA. Cela pénalisait notamment les nouvelles entreprises rachetées par SAP qui développaient sur des langages différents.
L’objectif premier du projet nommé Projet Phoenix était de créer une technologie d’interface utilisateur flexible, extensible, moderne et surtout totalement indépendante du backend.
Ils ont finalement proposé un framework très semblable à celui proposé aujourd’hui qu’ils ont appelé Open UI5. Quand quelques années plus tard, SAP a ajouté des librairies complémentaires, il a pris le nom qu’on lui connait aujourd’hui, soit SAP UI5.
Quels sont les Principes à respecter par les Applications SAP UI5 ?
Des applications orientées “Rôles” : les applications SAP UI5 sont développées pour les utilisateurs finaux. Ainsi, ces derniers ne peuvent avoir accès qu’aux données correspondantes à leur rôle. L’application doit donc permettre la même chose. Pour ce faire, les transactions vont être divisées en plusieurs petites applications correspondantes à des tâches spécifiques à un rôle en particulier.
Des applications responsives : quelle que soit la plateforme, l’appareil ou encore le système utilisé, l’expérience utilisateur est importante si ce n’est primordial pour ces applications. Ces dernières se doivent d’être intuitives et faciles d’utilisation pour offrir la meilleure expérience possible.
Des applications simples : on parle de la règle 1-1-3 :
- Un utilisateur
- Une utilisation
- Trois écrans au maximum.
S’il est impossible de la réduire à trois écrans, il faudra alors la décomposer en plusieurs applications.
Des applications cohérentes : si toutes les applications vont être différentes, elles doivent avec les mêmes principes de fonctionnement. Ainsi, un utilisateur qui sait se servir d’une application devrait savoir se servir de toutes les autres
Quelle est la différence entre SAP UI5 et SAP Fiori ?
Ces deux termes sont souvent utilisés (à tort) pour désigner la même chose, soit la nouvelle interface intuitive de SAP avec ses différentes tuiles. Pourtant, il existe des différences majeures entre ces deux termes.
Qu’est-ce que SAP Fiori ?
SAP Fiori est un design ou une approche utilisateur développé par SAP. Il s’apparente à un guide qui indique la façon dont les programmes doivent s’exécuter et fonctionner.
Ainsi, l’objectif de SAP Fiori est de proposer des applications SAP faciles d’utilisation et intuitives pour que la formation sur ces dernières soit courte et le travail quotidien plus productif. Gain de temps et simplicité d’utilisation sont les maitres-mots de SAP Fiori.
SAP a mis en œuvre cette expérience utilisateur dans plus de 1100 applications disponibles dans la bibliothèque d’applications. Toutes les applications qui suivent ces directives de conception sont des applications de type FIORI.
Les applications sont légères, indépendantes de l’appareil et du navigateur et fonctionnent « prêtes à l’emploi » avec SAP et/ou HANA DB. A noter que FIORI est une alternative à SAPGUI.
SAP Fiori VS SAP UI5
Concrètement, SAP UI5 est le langage de programmation des applications FIORI. Ainsi, il n’est pas possible de développer une application Fiori sans utiliser SAP UI5. C’est donc la technologie qui va permettre le développement des applications responsives et intuitives.
De ce fait, il est possible d’avoir des application SAP UI5 qui ne sont pas des applications Fiori.
L’Architecture de SAP UI5
L’architecture SAP UI5 est composée de trois couches principales :
- Tout en haut, on retrouve la présentation où les différents composants UI5 sont composés par les mobiles, tablettes et autres ordinateurs
- Puis on retrouve l’application client qui contient la librairie incluant entre autres SAP.common pour les textes et les boutons ou encore SAP.m pour les appareils mobiles.
- Nous avons enfin le serveur avec SAP Netweaver, le backend…
Le framework utilise une architecture Modèle-Vue-Contrôleur (MVC), qui sépare la logique de l’application en trois composants principaux : le modèle, la vue et le contrôleur.
Le modèle représente les données et la logique métier de l’application. Il peut s’agir d’un simple objet JavaScript ou d’un objet plus complexe qui utilise le protocole OData pour communiquer avec un système backend.
La vue est chargée d’afficher les données du modèle à l’utilisateur. Dans SAP UI5, la vue est représentée par un document XML qui définit la disposition et la structure des éléments de l’interface utilisateur.
Le contrôleur est ce qui lie le modèle et la vue. Il contient la logique d’application qui met à jour le modèle et la vue lorsque le modèle change.
Le framework fournit également un certain nombre de contrôles d’interface utilisateur intégrés, tels que des boutons, des tableaux et des formulaires, qui peuvent être utilisés pour construire l’interface utilisateur.
Ils sont appelés « contrôles » dans SAPUI5 et sont réutilisables dans toute l’application.
Un autre point important est que SAP UI5 est construit sur OpenUI5, une version open-source de SAP UI5. Cela signifie que l’architecture et les concepts utilisés dans SAP UI5 sont également applicables à OpenUI5, de sorte que les développeurs peuvent utiliser les mêmes compétences et connaissances pour développer des applications Web en utilisant les deux frameworks.
Pourquoi les Applications SAP UI5 sont Parfaites pour l'ensemble de vos Processus Métiers ?
Une conception Conviviale
SAP UI5 fournit un grand nombre de contrôles et de bibliothèques d’interface utilisateur intégrés qui peuvent être utilisés pour créer des interfaces utilisateur à la fois fonctionnelles et visuellement attrayantes.
Une Compatibilité Multiplateforme
Les applications SAP UI5 peuvent s’exécuter sur diverses plateformes, notamment les ordinateurs de bureau et les appareils mobiles, ce qui permet de toucher facilement un large éventail d’utilisateurs.
Une Large Communauté
SAP UI5 est un framework largement utilisé et dispose d’une grande communauté de développeurs qui partagent leurs connaissances et leurs ressources, ce qui permet de trouver facilement de l’aide et des solutions en cas de besoin.
Une Intégration à l’écosystème SAP
Si vous utilisez SAP comme ERP et que vous cherchez un moyen de connecter votre application web à votre ERP, SAP UI5 est le choix idéal. Le framework est étroitement intégré à l’écosystème SAP, ce qui permet aux développeurs d’accéder facilement aux données et aux fonctionnalités des systèmes SAP.
La Réutilisabilité
Les contrôles réutilisables de SAP UI5 permettent aux développeurs d’écrire le code une fois et de l‘utiliser plusieurs fois, ce qui contribue à améliorer la productivité et la maintenabilité de l’application.
L’Accessibilité
SAP UI5 prend en charge l’accessibilité en suivant les directives d’accessibilité au contenu Web (WCAG), permettant ainsi de proposer l’application pour les utilisateurs handicapés.
Découvrir plus d’articles VASPP
Le Design Thinking au service de l’Expérience Utilisateur : les Bonnes Pratiques à Adopter
Explorez les principes fondamentaux du design thinking et apprenez comment cette approche centrée sur l’utilisateur peut aider votre entreprise à innover et à résoudre les
Quelle Méthodologie de Projet Choisir ?
Choisir la bonne méthodologie de projet est souvent crucial pour atteindre les objectifs. En cascade ou encore AGILE, elle implique une réfléxion préalable pour obtenir
SAP FIORI : Guide et Avantages
SAP Fiori, souvent associé à SAP UI5 et à l’UX Design, est une technologie permettant de moderniser les écrans SAP, les rendre plus simples et
