SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1....
Transcript of SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1....
![Page 1: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/1.jpg)
Mallorca, 14 octubre de 2015
SAP FIORI / SAPUI5
![Page 2: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/2.jpg)
2
1. INTRODUCCIÓN A LA MOVILIDAD
2. SAP FIORI
Índice
3. SAP Ui5
5. POTENCIAL4. DESARROLLO 6. CONCLUSIONES
![Page 3: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/3.jpg)
3
Cualquier Negocio
Cualquier Lugar
Cualquier Dispositivo
Cualquier Instante
CualquierUsuario
La movilidad se ha convertido en una necesidad empresarial
¿Por qué?
Introducción
![Page 4: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/4.jpg)
4
Introducción
Accesibilidad Global
• En España la evolución en el número de líneas móviles desde el año 2000, ha aumentado un 126%.
• Desde 2006 se ha producido un descenso en el precio del móvil de casi el 50%.
![Page 5: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/5.jpg)
5
Introducción
Soluciones Móviles SAP
SAP BusinessObjects Mobile
SAP Sales Manager
SAP Work Manager
SAP Customer Briefing
Otras
SAP Store VS. SAPUi5
SAPFiori
Otras
![Page 6: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/6.jpg)
6
1. INTRODUCCIÓN A LA MOVILIDAD
2. SAP FIORI
Índice
3. SAP Ui5
5. POTENCIAL4. DESARROLLO 6. CONCLUSIONES
![Page 7: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/7.jpg)
7
¿Que es SAP Fiori?
• SAP Fiori es una colección de aplicaciones que representan el nuevo paradigma de experiencia de usuario de SAP
• Diseño coherente e intuitivo
• Infraestructura técnica común
• Supresión límites tradicionales
• Elementos de interfaz de usuario interactivos y atractivos
• Compatibilidad con todo tipo de dispositivos sin implementaciones adicionales
• Diseño y desarrollo con orientación funcional total
![Page 8: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/8.jpg)
8
¿Cómo funciona SAP Fiori?SA
P Ui5 • Basado en funciones
• Adaptable• Sencillo• Coherente• Valor instantáneo
Librerías SAP.UI Vistas Conjunto
de DatosFIORI
• FIORI APP• Launchpad
![Page 9: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/9.jpg)
Adaptación total
Acceso sencillo a la
información
Nivel de personalización
total
9
¿Por qué SAP Fiori?
• SAP Fiori nace para combatir los principales inconvenientes y obstáculos que presenta SAP ERP para la experiencia habitual del usuario
Elevada rigidez
Acceso complejo
a la información
Nivel de personalización
bajo
![Page 10: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/10.jpg)
10
Beneficios SAP Fiori
• La implantación de movilidad mediante SAP Fiori, permite:
• Mejorar la productividad del usuario mediante la simplificación yautomatización de las tareas del día a día a través de cualquier dispositivo.
• Impulsar la adopción del usuario con un diseño atractivo, adaptado a lastareas y actividades clave.
• Aumentar el cumplimiento y la calidad de los datos, haciendo que sea másfácil introducir la información en el sistema.
• Reducir los costes de capacitación y apoyo con pantallas sencillas, basadasen roles que aceleran la interacción y reducen al mínimo los errores deusuario.
• Ampliar y/o desarrollar fácilmente las aplicaciones, personalizando éstasmediante las herramientas y las tecnologías de desarrollo SAP.
![Page 11: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/11.jpg)
11
Tipos de aplicaciones SAP Fiori
Existen tres tipos de aplicaciones SAP Fiori UX:
![Page 12: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/12.jpg)
12
Tipos de aplicaciones SAP Fiori
Existen tres tipos de aplicaciones SAP Fiori UX:
1‐Transactional ApplicationsLas aplicaciones transaccionales SAP Fiori UX son aplicaciones diseñadas paraempleados, responsables, etc. Cada una de estas aplicaciones transaccionalesrequiere de la instalación de un Add‐On específico en el sistema.
Es el único tipo de aplicación SAP Fiori UX que no está necesariamente ligado a SAP HANA, sino que soporta cualquier otro tipo de Base de Datos en el sistema.
![Page 13: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/13.jpg)
13
Tipos de aplicaciones SAP Fiori
2‐Fact SheetsEste tipo de aplicaciones SAP Fiori UX permite al usuario navegar por la información en diferentes capas. Permite el acceso a información global a un nivel contextual, acceder al detalle y si es necesario, navegar a más bajo nivel de dato y acceder a toda la información relacionada con él.
Requisitos mínimos:‐ SAP HANA‐ SAP Web Dispatcher
![Page 14: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/14.jpg)
14
Tipos de aplicaciones SAP Fiori
3‐Analytical Applications
También llamadas Smart Business Applications.Éstas tienen el objetivo de analizar y evaluar los KPI estratégicos u operativos en tiempo real y desencadenar las tomas de decisiones correcta.
Las aplicaciones analíticas SAP Fiori UX requieren:‐ SAP HANA con una Arquitectura 2‐Tier usandoModelos Virtuales (VDM)‐ Aplicaciones incluidas como paquetes en cada componente de SAP (ERP, CRM…)
![Page 15: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/15.jpg)
15
Aplicaciones SAP Fiori
https://fioriappslibrary.hana.ondemand.com/sap/fix/externalViewer/#
![Page 16: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/16.jpg)
16
Análisis Aplicación‐ SAP Fiori
Margen NetoEsta aplicación muestra el indicador clave de rendimiento (KPI) Margen Neto. Además permite ir al detalle para profundizar y conocer:‐ La tasa neta de margen de beneficios en un período seleccionado del año fiscal
en curso.‐ Comparar dicha tasa con la tasa prevista, así como también respecto el mismo
periodo del año anterior.
![Page 17: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/17.jpg)
17
Análisis Aplicación‐ SAP Fiori
Información para la implementación ‐ Instalación
Net Margin ‐ SAP Fiori APP
![Page 18: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/18.jpg)
18
Análisis Aplicación‐ SAP Fiori
Información para la implementaciónInformación para la implementación ‐ Instalación
![Page 19: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/19.jpg)
19
Análisis Aplicación‐ SAP Fiori
Información para la implementación ‐ Configuración
![Page 20: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/20.jpg)
20
Análisis Aplicación‐ SAP Fiori
Información para la implementación ‐ Configuración
![Page 21: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/21.jpg)
21
Launchpad‐ SAP Fiori
SAP Fiori Launchpad es un escritorio que aloja aplicaciones SAP Fiori y proporciona a las aplicaciones servicios como la navegación, personalización, soporte y configuración de la aplicación.
El Launchpad es el punto de acceso a las aplicaciones de SAP Fiori aplicaciones desde los dispositivos móviles y/o PC’s.
![Page 22: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/22.jpg)
22
SAP Fiori ‐ Adaptaciones
Codificar
Publicar
Crear/Modificar
Diseñar
![Page 23: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/23.jpg)
23
1. INTRODUCCIÓN A LA MOVILIDAD
2. SAP FIORI
Índice
3. SAP Ui5
5. POTENCIAL4. DESARROLLO 6. CONCLUSIONES
![Page 24: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/24.jpg)
24
SAP UI5 ‐ ¿Qué es?
SAPUI5 es un conjunto de libreríasJavascript para el desarrollo ydiseño de aplicaciones de negocioSAP basadas en HTML5.
Características Básicas
Diseñado para patrón MVC
Responsive
Bindeo bidireccional
Tematizable
Más de 200 controles UI (extensibles)
![Page 25: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/25.jpg)
25
SAP UI5 vs OpenUI5
• OpenUI5 es la versión gratuita disponible bajo lalicencia de código abierto Apache 2.0
• Todo el núcleo de OpenUI5 y SAPUI5 (que contienetoda la funcionalidad central) es idéntico.
• La diferencia está en algunas bibliotecas de controlmás exótica que todavía no se han publicado bajo lalicencia de código abierto.
• Una de las principales diferencias, es que el soporteque SAP ofrece a SAPUI5, que garantiza la correcciónde errores, mientras que en OpenUI5, no existe estagarantía.
![Page 26: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/26.jpg)
26
SAP UI5 – Principios
Es un framework de programación que facilitael desarrollo de aplicaciones web de ladocliente que cumplen los principios de la SAPUser Experience Strategy (UX).
![Page 27: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/27.jpg)
27
SAP UI5 – Principios
1 ‐ Aplicaciones SAPUI5 orientadas a roles
Las aplicaciones SAPUI5 deben estar pensadas para losusuarios que van a utilizarlas. Sólo deben mostrar los datos queun determinado rol de negocio quiere ver y ninguno más.
Se trata de dividir las transacciones que conocemos hastaahora, en pequeñas aplicaciones orientadas a las tareasconcretas del rol que las va a utilizar.
![Page 28: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/28.jpg)
28
SAP UI5 – Principios
2 ‐ Aplicaciones SAPUI5 responsive
Las aplicaciones SAPUI5 deben ofrecer una interfaz deusuario atractiva, a la vez que sencilla e intuitiva que ofrezcauna experiencia de usuario buena y equivalente sea cual sea laplataforma o dispositivo desde la que se acceda,independientemente de versión, sistema operativo, navegador,resolución etc.
![Page 29: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/29.jpg)
29
SAP UI5 – Principios
3 ‐ Aplicaciones SAPUI5 simples
Las aplicaciones SAPUI5 además de estar orientadas a roles,deben ofrecer la funcionalidad de una manera sencillay simple.
En el desarrollo de aplicaciones SAPUI5 se sigue la regla 1‐1‐3:
1 usuario, 1 caso de uso, 3 pantallas como máximo.
Si la aplicación que estamos desarrollando no puede resumirseen 3 o menos pantallas, deberemos rediseñarla o dividirla envarias aplicaciones SAPUI5.
![Page 30: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/30.jpg)
30
SAP UI5 – Principios
4 ‐ Aplicaciones SAPUI5 coherentes
Las aplicaciones SAPUI5 deben hablar el mismo idioma. Esto serefiere a que deben utilizar elementos y estilos comunes demanera que un usuario que sepa utilizar unaaplicación SAPUI5, sepa utilizar cualquiera otra.
Para ello, existen themes y recursos web a disposición delos desarrolladores SAPUI5
![Page 31: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/31.jpg)
31
SAP UI5 – Principios
5 ‐ Aplicaciones SAPUI5 disponibles al instante
Este principio está más relacionado con las aplicaciones SAP Fiori UX enmarcadas en el enfoque estrategia UserExperience de SAP.
Se refiere a la disponibilidad de una de estas aplicaciones Fiori, que también son aplicaciones SAPUI5 ya desarrolladas y puestas a disposición por SAP que pueden instalarse y usarse en poco tiempo.
![Page 32: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/32.jpg)
32
SAP UI5 ‐ Arquitectura
Como ya se ha comentado anteriormente, las aplicacionesSAPUI5 son aplicaciones de lado cliente que ofrecen unainterfaz SAP a través de la que consumir o nutrir de datos aSAP.
Desarrollar una aplicación SAPUI5 significa por tanto, diseñaruna interfaz y definir de dónde se va a obtener los datos que vaa tratar esta interfaz. Para ello, se utiliza elparadigmaMODELO‐VISTA‐CONTROLADOR.
![Page 33: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/33.jpg)
33
SAP UI5 ‐ Arquitectura
Modelo: Serán las fuentes de datos de los que se nutrirá laaplicación, podrán ser SAP o no SAP y podrán estar basados endiferentes formatos como JSON, XML u oData
Vistas: Ficheros en los que se diseñará la estructura y formatode la aplicación SAPUI5 en cuestión: layouts, controles, tablas,etc. Pueden desarrollarse en los siguientes formatos:Javascript, XML, HTML o JSON.
Controlador: Ficheros Javascript en los que se definirá la lógicade negocio de la interfaz, se atenderá a eventos, se realizaránvalidaciones y se crearán modelos con los que establecer larelación entre la aplicación y el backend de donde procedan losdatos a tratar.
![Page 34: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/34.jpg)
Vista
Modelo
JSON, XML, oDATA
Controlador
JavaScript
Modelo Vista Controlador
JavaScript, XMLJSON o HTML
SAP UI5 ‐ Arquitectura
![Page 35: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/35.jpg)
35
SAP UI5 ‐ Desarrollo
A la hora de desarrollar un proyecto SAPUI5 debemos pensarqué tipo de aplicación SAPUI5 queremos desarrollar, quéelementos queremos mostrar en ella y de qué forma.
Por ello, es necesario conocer qué componentes podemosutilizar y qué librerías SAPUI5 tenemos a nuestra disposiciónpara implementar la funcionalidad que requiramos.
![Page 36: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/36.jpg)
36
SAP UI5 – Desarrollo ‐ Librerías
sap.ui.commons
Si la aplicación va a ser preferentemente accedidadesde escritorio, crearemos una interfaz con controlespara páginas web comunes ( siempre asegurando que sise visualiza desde un móvil o una tablet la experienciade usuario también vaya a ser buena),
En librería SAPUI5 sap.ui.commons encontraremostodas las clases y métodos de diversos controles típicosde aplicación web:
‐ botones (sap.ui.commons.Button),‐ campos de entrada de texto (.InputField),‐ listas (sap.ui.commons.ComboBox) .
![Page 37: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/37.jpg)
37
SAP UI5 – Desarrollo ‐ Librerías
sap.m
Si la aplicación va a ser accedida principalmentedesde dispositivos móviles: (teléfonos, tablets, ..)podemos optar por desarrollar una interfazmóvil que no sólo se adapte a la pantalla deldispositivo en cuestión si no que también ofrezcacontroles que se beneficien de su carácter móvil:gestos, interacción táctil etc.
En sap.m encontraremos también numerososcontroles con los que presentar la información deuna manera mucho más parecida a lo que estamosacostumbrados con cualquier app móvil: 3
![Page 38: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/38.jpg)
38
SAP UI5 – Desarrollo ‐ Librerías
sap.ui.coresap.ui.tablesap.ui.ux3sap.me
…
![Page 39: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/39.jpg)
39
SAP UI5 – Desarrollo ‐ Librerías
https://sapui5.hana.ondemand.com/sdk/test-resources/testsuite/testframe.html
![Page 40: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/40.jpg)
40
1. INTRODUCCIÓN A LA MOVILIDAD
2. SAP FIORI
Índice
3. SAP Ui5
5. POTENCIAL4. DESARROLLO 6. CONCLUSIONES
![Page 41: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/41.jpg)
41
SAP UI5 – Desarrollo ‐ Entorno
![Page 42: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/42.jpg)
42
SAP UI5 – Desarrollo ‐ Entorno
Eclipse es una plataforma de desarrollo, diseñada para serextendida de forma indefinida a través de plug‐ins. Fueconcebida desde sus orígenes para convertirse en una plataformade integración de herramientas de desarrollo. No tiene en menteun lenguaje específico, sino que es un IDE (IntegratedDevelopment Environment ) genérico.
Proporciona herramientas para la gestión de espacios de trabajo,escribir, desplegar, ejecutar y depurar aplicaciones.
![Page 43: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/43.jpg)
43
SAP UI5 – Desarrollo ‐ Entorno
https://tools.hana.ondemand.com/#sapui5
![Page 44: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/44.jpg)
44
SAP UI5 – Desarrollo ‐ Entorno
![Page 45: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/45.jpg)
45
SAP UI5 – Desarrollo ‐ Entorno
Sap Gateway es una tecnología que proporciona una manerasencilla de conectar dispositivos.
OData tratar de dar solución a la exposición de orígenes de datos,relacionales o no, a través de un Servicio Web ejecutandooperaciones con un lenguaje “estándar” basandose en:
•La creación de una forma uniforme de representación de datosestructurados a través de Atom oJSON (JavaScript Object Notation)•La utilización de convenciones URL uniformes tanto para lanavegación, filtrado, orden y paginación de datos (entre otros)•La creación de operaciones uniformes dirigidas por direcciónmediante las acciones GET, POST,PUT y DELETE.
![Page 46: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/46.jpg)
46
SAP Fiori ‐ Adaptaciones
Codificar
Publicar
Crear/Modificar
Diseñar
![Page 47: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/47.jpg)
47
SAP UI5 – Desarrollo ‐ Aplicaciones
Transacción /UI5/UI5_REPOSITORY_LOAD
![Page 48: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/48.jpg)
48
SAP UI5 – Desarrollo ‐ Gateway
Transacción SEGW
![Page 49: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/49.jpg)
49
SAP UI5 – Desarrollo ‐ LaunchPad
Transacción LPD_CUST
![Page 50: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/50.jpg)
50
SAP UI5 – Desarrollo ‐ Aplicaciones
![Page 51: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/51.jpg)
51
SAP UI5 – Desarrollo ‐ Perfiles
Perfil Funcional
AnálisisRequerimientos
Perfil ABAP/Basis
Desarrollo ABAPDefiniciones Odata
Perfil Web
Desarrollo HTML5Desarrollo JavaScriptDesarrollo Eclipse
¿Es necesario contar con nuevos perfiles en nuestra organización?
![Page 52: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/52.jpg)
52
SAP UI5
![Page 53: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/53.jpg)
53
1. INTRODUCCIÓN A LA MOVILIDAD
2. SAP FIORI
Índice
3. SAP Ui5
5. POTENCIAL4. DESARROLLO 6. CONCLUSIONES
![Page 54: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/54.jpg)
54
Potencial
El potencial es ilimitado, pero que pasaría si…
• Queremos tener funcionalidades Offline.• Queremos crear APPs Nativas.• Queremos gestionar el despliegue de
actualizaciones.• Queremos funcionalidades PUSH• …
![Page 55: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/55.jpg)
55
SAP UI5 – SMP 3.0
![Page 56: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/56.jpg)
12/09/2013 © 2013, Bussap Consulting, S.L. All rights reserved 56
![Page 57: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/57.jpg)
57
1. INTRODUCCIÓN A LA MOVILIDAD
2. SAP FIORI
Índice
3. SAP Ui5
5. POTENCIAL4. DESARROLLO 6. CONCLUSIONES
![Page 58: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/58.jpg)
58
Conclusiones
• Desarrollo personalizado de las aplicaciones• Mejora de la productividad.• Diseño atractivo, adaptado a las tareas y actividades clave.• Interacción sencilla del usuario con el sistema.• Baja gestión del cambio• Entorno de desarrollo de fácil uso
Todo un mundo posibilidades a nuestro alcance
![Page 59: SAP FIORI SAPUI5 - ausape.esausape.es/ausape/.../Deleg_Baleares/20151014_BussapUI5Fiori.pdf · 2 1. introducciÓn a la movilidad 2. sap fiori Índice 3. sap ui5 4. desarrollo 5. potencial](https://reader030.fdocumento.com/reader030/viewer/2022013113/5a8455697f8b9a87368bde0b/html5/thumbnails/59.jpg)
59
Gracias por su atención