taller overview sap fiori

Capacitación dictada por

Tecnología HANA

Overview

Sergio Fabian CannelliConsultor Senior SAP K5

Master Software Developer [email protected]@gmail.com

http://sergiofabiancannel.wix.com/sergio-cannelli

mailto:[email protected]

mailto:[email protected]

http://sergiofabiancannel.wix.com/sergio-cannelli

Agenda

3

Introducción y overview

SAP HANA y ABAP

HANA y sus hermanas….

SAP Hana Cloud

SAP S/4

SAP FIORI

Perfiles

1

2

3

4

5

6

6.1

7

Concepto

6.2 Metodología

6.3 Desarrollo

6.4 Ejercicio

6.2.1 SAP Splash

Introduccion y overview

Ing. Sergio Fabian Cannelli Consultor SAP

Tendencias

En 2020, al menos el 70% del desarrollo de nueva aplicaciones será en Cloud.

Los desarrolladores colaboraran más en Cloud basada en infraestructura.

Los programadores profesionales son fundamentales para el desarrollo de aplicaciones complejas. Se espera esto para ofrecer aplicaciones más rápidas, con menos costo y menos necesidad de una infraestructura compleja.

Los usuarios de negocios tiene que ser capaz de crear aplicaciones de software personalizado que antes requerían la asistencia de programadores profesionales

© 2015 SAP SE or an SAP affiliate company. All rights reserved. 5Ing. Sergio Fabian Cannelli Consultor SAP

A partir de hoy la visión


Vision

Deploying ExtensionesPrototipado Desarrollo Testeo Empaquetado

© 2015 SAP SE or an SAP affiliate company. All rights reserved. 7

Es una herramienta de desarrollo basada en web diseñada para apoyar el ciclo de vida end-to-end ,para aplicaciones basadas en SAPUI5


Que es SAP HANA?


Que es SAP HANA?


Primero, base de datos, después, plataforma, ahora SAP Business Suite 4 SAP HANA (SAP S/4HANA).

• SAP HANA se presenta en 2011 como una base de datos• En 2013 se desarrolla SAP HANA como plataforma

SAP HANA es una plataforma creada por SAP en conjunto con sus clientes y socios comerciales, con la finalidad de brindar soporte a la nueva generación de aplicaciones en tiempo real, esta innovadora plataforma ha sido construida siguiendo la nueva tendencia tecnológica para el tratamiento de enormes paquetes de información llamada "procesamiento inmemory". Las siglas "HANA" provienen de High Performance ANalytic Appliance, o sea Aplicación analítica de alta performance. SAP HANA es un producto integrado de Hardware y Software ya que el procesamiento in-memory requiere la utilización de un servidor especializado en HANA, el cual se debe encontrar correctamente configurado y certificado para el software en cuestión, incluso en ocasiones se trata de servidores que se entregan al cliente con SAP HANA software preinstalado en ellos.


¿Para qué sirve SAP HANA? ¿Donde es factible aplicar SAP HANA?


Inicialmente SAP HANA se desempeñó en aplicaciones analíticas como lo son las aplicaciones Business Intelligence ya que sus tareas son las que más recursos de procesamiento requieren por necesitar manejar grandes volúmenes de datos, que a veces implican horas o hasta días de procesamiento, por ello el Business Intelligence presentó el nicho de mercado óptimo e inicial donde SAP HANA se implementó en sus primeras instancias, es en BI sobre SAP HANA.


Introducción al procesamiento inmemory


Si vamos a hablar sobre SAP HANA tenemos que hablar del procesamiento in-memory que es el "corazón" de esta plataforma, aunque en realidad se parece más al motor de un fórmula 1 que a un corazón... ya que le otorga velocidades de procesamiento miles de veces más eficientes que las actuales, lo que permite que las aplicaciones del "SAP Business Suite" manejar miles de millones de registros simultáneamente y ejecutar su trabajo prácticamente de manera instantánea o mejor dicho "en tiempo real". La arquitectura de la plataforma SAP HANA está compuesta principalmente de 4 componentes:


Introducción al procesamiento inmemory


SAP HANA APPLIANCE: Es el componente de hardware de SAP HANA ya que cómo se lo mencionamos anteriormente, la plataforma SAP HANA se trata de un producto estrechamente ligado entre el Software y el Hardware.

SAP HANA DB: Es la nueva tecnología que se encarga de manejar todo lo referente a base de datos.

SAP HANA CLOUD PLATFORM: Es el componente de SAP HANA que permite a los clientes y desarrolladores construir, ampliar y ejecutar aplicaciones en SAP HANA desarrolladas para internet.

SAP Business Suite: Es el componente de Software mediante el cual SAP S/4 HANA brinda soporte a las aplicaciones de gestión de recursos empresariales (ERP) que el cliente necesita utilizar.


Introducción al procesamiento in-memory


SAP S/4 contiene en esta nueva suite las evoluciones enfocada en la simplificación de procesos para los módulos FI, CO, MM, SD, HCM, PM,PORTAL, etc... en lo que SAP denomina:

Modelado de Datos Simplificado Finanzas Simplificadas(Sfin) Experiencia de usuario Simplificada Soluciones de Inteligencia Empresarial Simplificada Logística simplificada(Slog)

El principal objetivo de SAP S/4 HANA como lo ve es simplificar los procesos y elmodelo de negocios .


ABAP EN SAP HANA

Optimizacion de codigos para HANA

Agenda

Enfoque General

Paso 1 : Migración

Paso 2 : Prepararación

Preparación ambiente abap

Paso 3 : Optimización

Paso 3-1 : Acelerar

Optimizacion sin usar View/procedimientos SAP HANA

Paso 3-2: Extender

Optimizacion usando View/Procedimientos SAP HANA

Paso 3-3: Innovar

Considerar nuevos casos de uso

Preparar Código cliente para SAP HANA

Mi código ABAP debe ser cambiado para evitar posibles problemas funcionales

En general se ejecuta sin problemas en SAP HANA como antes

Sólo si código ABAP se basa en detalles técnicos de la base de datos antigua, cambios en el código ABAP quizá sea necesarios

Enfoque generalConsiderando nivel de optimizacion

Migrar SAP ECC 6.0 a SAP HANA


Correcciones funcionales para Código ABAP

Cambios técnicos Detalles y ejemplos – efecto sobre DB específico de ABAP

Migración de DB Cada DB tiene características específicas y único comportamiento técnico. Se puede confiar en el código específico y en estas características de la base de datos utilizada.

Arquitectura HANA Arquitectura basado en Columna - como consecuencia los índices secundario son menos importantes. puede confiar en el código específico y en el existencia y el uso de ciertos índices de DB.

Depooling/Declustering Durante la migración a SAP HANA el pool y clúster son transformado a tablas transparentes (depooling/desclusterización) para que las tablas se pueden utilizar en escenarios analíticos.

Upgrade

Migrate

Upgrade

Migrar

Upgrade

Migrar

© 2013 SAP AG or an SAP affiliate company. All rights reserved.

42

Cualquier DB

Usar ABAP Test Cockpit para garantizar calidad en general

Usar SQL Monitor en SAP HANA ( + SWLT en el sistema de desarrollo)

Produccion

SAPHANA DB

ECC 6.0

Migración SAP

HANA

Cualquier DB

Desarrollo / Test System

SAPHANA DB

ECC 6.0

Preparar

migración SAP

HANA

Cualquier DB

Usar ABAP Test Cockpit para corregir potenciales issues

funcionales en el código (“old” system or sandbox system)

Usar SQL Monitor en el „old“ system ( + SWLT en el

sistema de desarrollo) para corregir issues SQL .

Sandbox

SAPHANA DB

ECC 6.0

Eliminar código no usado para reducir esfuerzo de

migración. Definir su Principal proceso de negocios

para testear y hacer tunning en el sandbox systemPlan

migración SAP HANA

Usar ABAP Test Cockpit para corregir potenciales issues

funcionales en el código (“old” system or sandbox system)

Usar SQL Monitor en el „old“ system ( + SWLT en el

sistema de desarrollo) para corregir issues SQL .

Uso de herramientas


Niveles de optimizacionCuanto debe optimizarse el codigo ABAP ?

aplicaciones

mejorar

Innovar

Nuevo procesos

Nuevas

Nuevo canal

Extender

Direccionar mas usuarios

De background jobs a

interactive UIs

Adicionar mejoras y

usabilidad

Acelerar

Reducir ventana

de tiempo para

batch jobs

Mejorar Tiempo

de respuesta para

end- users

Posible Optimizacion Usando HANA

Optimizacion código ABAP – Preparado para HANA

Calculo

“Data to Code” “Code to Data”

Calculo

© 2013 SAP AG or an SAP affiliate company. All rights reserved. 43

SAP HANA Database

AS ABAP

ABAP es uno de los clients HANA

Una vista HANA puede ser muy compleja.

A Una vista HANAbien diseñada puede ser consumida en cualquier aplicacion

Código pushdown significa delegar ,por ejemplo, cálculos intensos de datos a la capa de base de datos usando Open SQL avanzado, ABAP con vistas avanzadas y Script SQL

VelocidadGestionar grandes volúmenes de datos a gran velocidad

NubeSubir a una de las plataformas en nube más avanzadas del mundo

AgilidadPermite interacciones en tiempo real en toda la cadena de valor

InnovaciónImplementar la plataforma esencial para la innovación en la

empresa

Cualquier tipo de datosObtener información a partir de datos estructurados y no

estructurados

SencillezGestionar menos capas y un entorno más sencillopara reducir costes

InformaciónDescubrir nueva información con análisis complejos y predictivos

ValorInnovar sin interrupción y añada valor a las inversiones anteriores

AplicacionesEjecutar aplicaciones de la próxima generación

Capacidad de elecciónTrabajar con los partners que prefiera en cada capa

105

94

83

72

6110 ventajas

HANA y sus hermanas…




En el mundo SAP el cambio de nombres por razones comerciales o de evolución no es una novedad. Pero

utilizar la misma palabra en la plataforma, la solución cloud y el nuevo ERP puede resultar confuso ya que en el

universo IT se necesita contar con definiciones claras.

A raíz de esta situación los diferentes conceptos a los que se aplica “HANA”: SAP HANA, SAP Hana Cloud

Platform (HCP) y S/4 HANA.

Como introducción, buscaremos tener un primer concepto para luego profundizar en cada uno de ellos.

SAP HANA es una plataforma hardware y software de procesamiento in-memory con servicios de aplicaciones

(Fiori), servicios de procesamiento (Streaming), servicios de integración (Virtualización), y servicios de base

datos (OLTP y OLAP).

SAP HANA CLOUD PLATFORM (HCP) es la plataforma para desarrollar, implementar y administrar

aplicaciones en la nube, utilizando la tecnología de SAP HANA.

S/4 HANA es la nueva Suite de negocios de SAP montada exclusivamente sobre SAP HANA, evolución de la

Business Suite de SAP (SAP ECC, CRM, SRM, etc.).

Teniendo una primera aproximación, describiremos un poco más el concepto de cada uno de ellos.




Si bien el concepto SAP HANA está fuertemente asociado a “solución de Base de Datos”, (su origen estuvo

pensado para aplicaciones analíticas de BI), actualmente vemos que se trata de un concepto mucho más

amplio con ofertas de virtualización, ELT, SAP Fiori (soluciones mobile y web), web server y análisis

predictivo, entre otros.

Una característica que no debe pasar inadvertida es la posibilidad que ofrece de ser ON-PREMISE, CLOUD

o HÍBRIDO.

Para precisar aún más el término HANA (sí, dentro de SAP HANA hay más HANA), definiremos el concepto

de SAP HANA DB y SAP HANA APPLIANCE. El primero refiere a la tecnología que se encarga de

administrar todo lo concerniente a base de datos (tecnología por columna, replicación, volcado a RAM),

mientras que el segundo es la certificación que deben poseer servidores y componentes en los cuales se

utilizará SAP HANA.


SAP HANA CLOUD,CONCEPTOS Y MAS





SAP HANA CLOUD PLATFORM llamada por sus siglas HCP es el componente de SAP HANA que permite a las empresas y a los desarrolladores construir,implementar y administrar aplicaciones en SAP HANA desarrolladas para internet, las cuales estarán accesibles tanto en plataformas de escritorio como también desde medios móviles como lo son las tablets o los celulares.SAP HANA CLOUD PLATFORM aporta la infraestructura para que las empresas puedan aprovechar la tendencia del IoT (Internet en las cosas), que implica millones de dispositivos conectados a la red, simplificando los consumos móviles a través de una experiencia de usuario de calidad superior y un servicio suplementado de flujo de notificaciones. La tecnología SAP HANA CLOUD PLATFORM utiliza la potencia y la rapidez delprocesamiento in-memory que es un clásico de HANA.


HTML5,SAPUI5,OpenUi5 es lo mismo?


Pues, básicamente, sí, pero intentaremos concretar un poco:

HTML5, es la 5ta revisión de HMTL. SAPUI5 , es un conjunto de herramientas para el desarrollo de aplicación

basados en HTML5 y otras tecnologías y protocolos como JavaScript,CSS3,Odata ,Entre otros.

OpenUi5 ,es casi lo mismo que SAPUI5 pero en Open source.

¿Y qué tiene SAPUI5 que no tenga OpenUI5? Pues, aparte de algunas librerías específicas y soporte por parte de SAP, la verdad es que tienen lo mismo. Así que, si quieres ponerte a desarrollar con estas herramientas, no tienes nada más que bajarte el SDK y empezar a trastear: SDK OpenUI5.




SAP HANA CLOUD PLATFORM incluye un amplio conjunto de servicios para la integración, movilidad empresarial, colaboración y análisis, utilizando SAP HANA Cloud Platform podremos:

Desarrollar nuevas aplicaciones en la nube Creando nuevas aplicaciones empresarias a partir de cero, desarrollos que incluso podrán tener su propia marca y como empresa podrá llegar al cliente final con impactantes e innovadores un productos empresariales .

Desarrollar extensiones en instalaciones Usando los servicios "Connectivity Service" and "Cloud Connector" usted podrá crear nuevas extensiones al sistema en la nube e integrarlos a la perfección con los componentes de las instalaciones locales del cliente y de esta manera reducir también los costos en infraestructura IT de la empresa.

Desarrollar extensiones en la nube En SAP HANA Cloud Platform, también se puede desarrollar extensiones a otros productos en la nube, como SAP SuccessFactors.

Al momento de que HANA se estableció como plataforma existen diversas funcionalidades y perfiles dependiendo de la implementación ,estos perfiles pueden ser técnicos donde los profesionales ABAP pueden migrar a HANA en diferentes niveles .




Aunque la plataforma esté orientada a servicios Cloud, no debemos dejar de lado las posibilidades de extensión que nos ofrece para on-premise.


SAP S/4



SAP S/4


S/4 HANA

Es la Suite de negocios de última generación, donde SIMPLE es su concepto clave

Se trata de la evolución del SAP ERP, prometiendo ser un salto mayor de lo que fue el R/2 al

R/3. S/4 HANA se encuentra totalmente integrado a la plataforma SAP HANA y ha sido

desarrollado con un exhaustivo enfoque en la experiencia del usuario (SAP Fiori®). Existe

la posibilidad de una instalación Cloud, On-premise o híbrida.

Si bien hace unos años ya hemos oído hablar de Simple Finance y Simple Logistic, hoy estos

conceptos están integrados en la solución S/4 HANA - Enterprise Management.

Ahora sí, podemos hablar de un reemplazo completo de nuestra Business Suite y ERP. Simple

Finance continuará existiendo de forma independiente como una posibilidad de añadirlo a

nuestro SAP ERP montado en SAP HANA. Pero dejemos en claro la confusión del 2015: SAP

S/4 HANA no es Simple Financial + Simple Logisitic.


SAP S/4


¿Cómo se integra SAP HANA, HCP Y S/4 HANA?


El siguiente esquema nos clarifica una evolución natural

de lo que es un posible camino hacia S/4 HANA. Al

involucrar los tres conceptos mencionados, queda en

claro el rol que puede jugar cada uno en el conjunto.

Pensemos en una clásica instalación de Business Suite

de SAP, con un ERP y BW, y su fortaleza de ejecutarse

sobre cualquier Base de Datos.

El crecimiento del negocio requirió mayores velocidades

de procesamiento y capacidad de exponer la información

de forma mobile: aparece SAP HANA con su BD in-

memory y su posibilidad de Apps (SAP Fiori).

Además, surge la necesidad de simplificar los procesos

de negocio, con una inserción de diferentes actores sin

complicaciones y largos procesos: S/4 HANA es la

respuesta ¿S/4 HANA on-premise o Cloud? En el caso de

optar por una estrategia Cloud, SAP HCP será una

fortaleza en nuestra arquitectura

Evolución Arquitectura


SAP FIORI


Concepto


SAP Fiori es una colección de aplicaciones que representan el nuevo

paradigma de experiencia de usuario de SAP. Estas aplicaciones

parecen ser aplicaciones de diseño coherente y hacer uso de una

infraestructura técnica común . Eliminando los límites tradicionales de las

PC y el uso de elementos de interfaz de usuario interactivas y atractivas,

que proporcionan una experiencia consistente de usuario de punta a punta,

se pueden utilizar en todos los tipos de dispositivos sin crear esfuerzos de

implementación adicional. Las aplicaciones Fiori se centran en las

actividades más importantes y comunes, están diseñados en torno a cómo trabaja la gente.


C:/Users/sergiocannelli/Desktop/Accesos/TALLER FIORI/ux-sap/ux-sap-jt4z4xp5558c1576/Prezi.exe

C:/Users/sergiocannelli/Desktop/Accesos/TALLER FIORI/ux-sap/ux-sap-jt4z4xp5558c1576/Prezi.exe

Concepto


Basada en funciones : Las aplicaciones Fiori descomponen aplicaciones complejas en una

experiencia basada en tareas, esto quiere decir que tendrán un solo punto de entrada central para cada usuario.

Adaptable : las SAP Fiori apps pueden adaptarse a todos los tamaños , los dispositivos, las versiones y los diferentes canales para proporcionar una experiencia de usuario común en cada uno de ellos.

Sencillo: Fiori aplicaciones busca seguir la experiencia conocida como 1-1-3 ( 1 usuario, 1 escenario, 3 pantallas ) . Ellos saben y proporcionan el contexto adecuado y la integración de datos significativa.

Coherente : experiencia del usuario con aplicaciones que hablan el mismo lenguaje de diseño . Esto implica la coherencia de las actividades comunes, así como la coherencia de su marca .

Valor instantáneo: con una baja barrera de adopción, permite a los clientes adaptarse y los usuarios personalizar las mismas .

SAP nos propone un catálogo más que interesante para ver cuáles de estas aplicaciones se adaptan a nosotros:

Concepto - OData


Es un protocolo de comunicación definido por Microsoft basado en XML y JSON que posteriormente ha sido adoptado como estándar abierto.

Es un protocolo que no está limitado a la consulta de datos, sino que también permite la actualización de datos en servidor.

Netweaver Gateway

Plataforma que proporciona una capa de comunicación con las aplicaciones de SAP mediante protocolos estándar. Contempla entre otros el protocolo OData


Concepto - Fiori


Es un conjunto de aplicaciones desarrolladas por SAP en tecnología UI5 que se conectan a los backend mediante Gateway utilizando el protocolo OData .

Hay ya +190 aplicaciones publicadas por SAP de diversos módulos, incluyendoaplicaciones de HCM.


Concepto – Tipo de aplicaciones




Transactional Applications

Las aplicaciones transaccionales SAP Fiori UX son aplicaciones para los empleados,

para los responsables, etc. Cada una de estas aplicaciones transaccionales requiere 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 otrotipo de Base de Datos en la que tengamos nuestro sistema.

Fact Sheets

Este tipo de aplicaciones SAP Fiori UX permite al usuario, tal y como dice SAP, navegar por

la información en diferentes capas. Podemos quedarnos en información global a un nivel

contextual, luego acceder a unos pocos detalles y si lo queremos, navegar hasta lo más

profundo del dato y acceder a toda la información relacionada con él.




Analytical Applications

A veces llamadas Smart Business Applications, por lo que la documentación de

SAP a veces puede llegar a ser confusa en este aspecto ya que se refieren con

estos dos nombres indistintamente a lo mismo.

Las aplicaciones analíticas SAP Fiori UX requieren SAP HANA con una

Arquitectura 2-Tier usando Modelos Virtuales (VDM) y las aplicaciones vienen

incluidas como paquetes en cada componente de SAP (ERP, CRM…)

Así que ya sabemos, tenemos que familiarizarnos con los diferentes tipos de

aplicaciones SAP Fiori UX: Transactional Applications, Fact Sheets y Analitical

Applications


Concepto – Arquitectura


Concepto – Arquitectura Nivel medio


Concepto – Ejecución de las aplicaciones




Transactional Apps ( AT 1 ) – Ultima Versión Business Suite / Enhancement Package

En escenarios transaccionales liberados para ejecutarse con el último paquete de mejoras .P. ej. SAP ERP 6.0 EhP7, SAP CRM 7.0 EhP3, SAP SRM 7.0 EHP 3 ...

Las APPs se despliegan por ABAP UI add-ons

Las aplicaciones se conectan a través de los servicios OData

Servicios OData se envían a través de ABAP Support Packages sobre el Bussines Suite disponible P.ej. SAP ERP 6.0 EhP7, SAP CRM 7.0 EhP3, SAP SRM 7.0 EHP 3 ...

Hana y cualquier base de datos son compatibles, existe restricciones para las aplicaciones de planificación de necesidades




Transactional Apps ( AT 1 ) – Antiguo Versión Business Suite / Enhancement Package

Es un conjunto de escenarios transaccionales Generados por SAP para Ejecutar en los Release anteriores de mejora .P.ej. SAP ERP 6.0 EhP6 e inferior, SAP CRM 7.0 EhP2 e inferior

Las APPs se despliegan por ABAP UI add-ons

Las aplicaciones se conectan a través de los servicios OData

Los servicios OData se envían a través add-on para laintegración de OData los cuales no se modifican y estandisponible para las versiones estables de antiguos BusinessSuite

Hana y cualquier base de datos son compatibles.



Analytical Apps (AT2)

Escenarios puramente analíticoSe ejecuta en HANA, ejecutado en XS EngineConectado a través de los servicios ODataHANA live (2 niveles) de la arquitecturaEl uso de modelos basados HANA Virtual

Data Models (VDM)Framework Smart Business KPI




Analytical Apps (AT2). Detallado

Reverse Proxy / Web Dispatcher ,requerida para mitigar la políticas de permisos.

Frontend Server

• KPI Tiles, KPI y KPI Drill Down, Deployment de KPI Modeler App en Fiori server

• Launchpad de indicadores HANA para ver rendimiento a través de integración de catálogo remoto.

• Semántica objetos para Tiles-2-Drill Down y Drill Down -2.

HANA (2-tier) – Maximo code push down

• Catálogo KPI en HANA• Lógica back-end adicional implementado en xsjs KPI

Modeler.• Lógica de negocio Analytical encapsulado en modelos

de datos virtuales. Expuesto a través de OData.• El acceso de usuarios HANA a Hana.• privilegios HANA utilizados con fines de autorización /

restricción.• Envío a través de HANA LiveIng. Sergio Fabian Cannelli Consultor SAP


© 2015 SAP SE or an SAP affiliate company. All rights reserved.

Fact Sheets Apps (AT3)

Búsqueda

Estado-of-the-art experiencia de búsqueda Intuitivo resumen de objetos del Overview Alto rendimiento impulsado por HANA Abarca todo el Business Suite

Fact Sheet Navigation

Potente navegación contextual navegando por la web relacionado con las entidades de negocios.

Completa visión de 360 ° de entidades de negocios

Concepto – Ejecución de las aplicacionesFact Sheets Apps (AT3) detallado

Características principales

Búsqueda de texto libre a través de Suite de Business Objects, todas las aplicaciones y Tiles KPI

Launch Fiori y transacciones de back-end de Fact Sheets

Desarrollo basado de modelos Fact Sheets FIORI

Modelos de búsqueda son expuestos a través de OData Las FACT SHEETS se modelan con la herramienta propia

como Odata Annotations. Generic UI hace FACT SHEET basado en File annotations y

Odata Service. Habilidades UI5 no son necesarios para construir FACT

SHEET ABAP EXIT disponibles para los escenarios break-out

Ejecuta solo en HANA

Diseño ABAP (Enterprise Search); Runtime ABAP / HANA


Concepto – Fiori Launchpad Overview

Fiori Launchpad proporciona a los usuarios finales un punto de entrada para aplicaciones de Fiori basado en Roles, usando Tiles consistentes y fáciles de usar.

Los Tiles muestran información dinámica / live / aplicación

en tiempo real (como el estado, indicadores de rendimiento) en la página principal.

Contenido predefinido y alto grado de personalización

Los Tiles pueden ser seleccionados de catálogos y dispuestos en grupos.

Búsquedas integradas.


Concepto – Fiori Launchpad Overview

Las aplicaciones FIORI deben ser implementados como componentes UI5 autónomo que puede ser incorporado en diferentes launchpages

noShellIndex.html:local, Test aislado dentro de shell services

Fiori Sandbox.html: local, Test integrado con Mock Shell services

FioriLaunchpad.html: uso productivo


Concepto – Fiori Launchpad Content Model

© 2015 SAP SE or an SAP affiliate company. All rights reserved.

Transacción PFCG Asignar grupos y catálogos de roles

Asignar roles a usuarios

Fiori Launchpad Designer (FLPD) Contenido que puede ser configurado en el sistema

(configuracion) o cliente especifico (customizing):

Mapeo: mapeos para navegar con intención para

concretar

Tile: usado para lanzar una aplicación

Catalogo: Set de aplicaciones

Grupo: set de tiles predefinidos que un usuario puede

ver

Transacción LPD_CUST Inicio de la aplicación lógica, entradas desacoplada de la

implementación técnica

Opcional: define y renombra reglas para parámetros

de entrada

Concepto – Fiori Launchpad Content ModelLos artefactos entregados en el contenido (Imagen simplificada)


Metodología Fiori Design Thinking


Design Thinking

Las premisas del proceso creativo

Enfócate en valores humanos:

Tener empatía por las personas para las cuales estás

diseñando y la retroalimentación de estos usuarios

es fundamental para lograr un buen diseño.

No lo Digas, Muéstralo:

Comunica tu visión de una manera significativa

e impactante creando experiencias ,usando visualesilustrativas y contando buenas historias.

Colaboración Radical:

Junta equipos de personas de variadas

disciplinas y puntos de vista. La

diversidadpermite salir a la luz ideas radicales.

Estar Consciente Del Proceso:

Tener claro el proceso de diseño y saberqué métodos se utilizan en cada fase.

Cultura de Prototipos:

Hacer prototipos no es simplemente una

manera de validar las ideas; es una parteintegral del proceso de innovación

Incita a la acción:

No nos confundamos con el nombre ya

que no se trata de pensar sino que dehacer. Del pensar a la acción.

Design Thinking

Cinco pasos elementales

EMPATÍA (Comprender)

DEFINIR

IDEAR

PROTOTIPAR

EVALUAR (Probar)


Design Thinking


“Para crear innovaciones significativasnecesitas conocer a tus usuarios y

preocuparte de sus vidas”

EMPATIZAR

EMPATIZAREMPATIZAR

Empatía es la base del proceso de diseño que está centrado en las personas y los usuarios. Lo

básico para ser empático es:

Observar: Mira a los usuarios y sus comportamientos en el contexto de sus vidas. Debemos siempre tratar de observar desde el exterior sinentrometerse, las mejores ideas vienen en estas situaciones así.

Involúcrate: Generar una conversación, esta puede ser desde una pregunta de pasillo, breve una conversación más estructurada. Prepara

algunas preguntas para ir manejando la conversación siempre manteniendo levemente estructurada.

Lo importante es siempre preguntar “¿Por qué?” ya que eso descubre nuevos significados, preguntar una y dos veces si es necesario…¿Por

qué? ¿Por qué?

Mira y Escucha: Lo mejor siempre es combinar estas dos, la conversación y el engagement. Pídele también que te explique como hace

algunas cosas y que vaya vocalizando lo que pasa por su mente cuando esté en su trabajo. Ten una conversación mientras trabaja y esté en su

contexto.

Como Diseñador, los problemas que tratas de resolver no son los tuyos, son problemas de otras personas. Para diseñar para estas personas debes adquirir la empatía por lo que ellos son como personas y lo que es importante para ellos.

La empatía que es el elemento esencial del proceso de diseño. Entonces entras en un modo, en

un estado de observación que es el modo empatía. Que es básicamente el trabajo que haces para entender a los usuarios dentro del contexto

del cual estás diseñando. Es el esfuerzo por comprender las cosas que hacen y porqué, sus necesidades físicas y emocionales, como conciben

el mundo y que es significativo para ellos. Son las personas en acción las que inspiran al diseñador y direcci nan una idea una idea en

particular. Aesta etapa se le llama “immerse” ya que el diseñador debe hundirse en un mar de aprendizaje.


Design Thinking


“Enmarcando el problema adecuadoes la única manera de crear la solución correcta.”

DEFINIR

Este modo “definición” es todo sobre traer claridad y enfoque al espacio de diseño en que se

definen y redefinen los conceptos. Es preciso determinar bien el desafío del proyecto basado en

lo aprendido del usuario y su contexto. Después de transformarse en un experto instantáneo del

problema adquiriendo una empatía invaluable por la persona de la cual estás diseñando, esta etapa

es sobre crear coherencia sobre la variada información que se ha reunido.

El modo definición es crítico para el proceso de diseño ya que la meta de esta etapa es

maquetear un “Point of View” (POV) que significa crear una declaración de problema viable y

significativo y que será guía para enfocarse de mejor manera a un usuario en particular. Los

insights no aparecen de la nada y repentinamente como por arte de magia. Estos insights nacen al

pro-cesar y sintetizar la información y enfrentando el problema para hacer conexiones y descubrir

patrones racionales.

Esta debe cumplir con ciertos criterios para que funcione bien:

• Enmarcar un problema con un enfoque directo.

• Que sea inspirador para el equipo.

• Que genere criterios para evaluar ideas y contrarrestarlas.

• Que capture las mentes y corazones de las personas que has estudiado.

• Que ayude a resolver el problema imposible de desarrollar conceptos que sirven para todo y

para todos.

Design Thinking


IDEAR

“No es sobre tener la idea correcta,es sobre el crear la mayor cantidad de

posibilidades.”

Aquí empieza el proceso de diseño y la generación de múltiples ideas. Esta etapa se entrega los conceptos y

los recursos para hacer prototipos y crear soluciones innovadoras. Todas las ideas son válidas y se combina

todo desde el pensamiento inconsciente y consciente, pensamientos racionales y la imaginación.

Es un espacio para desarrollar brainstorms y construir ideas sobre previas ideas. En esta etapa se

conciben una gran cantidad de ideas que dan muchas alternativas de donde elegir como posibles soluciones en

vez de encontrar una sola mejor solución. También se puede trabajar con métodos como croquis, mindmaps,

prototipos y stroryboards para explicar la idea de la mejor manera.

Pero el utilizar todas no significa éxito e incluso puede ser peor. A su vez, es necesario también

separar el área de generación de ideas con el área de evaluación de ideas.

La creación de múltiples ideas permite atacar distintos focos

• Pensar sobre soluciones que son obvias y por lo tanto aumenta el potencial de innovación del

• set de posibilidades

• Aprovechar de mejor manera las distintas visiones de cada equipo de trabajo y el trabajo colectivo

• Descubrir áreas inesperadas de exploración creando mayor volumen y mayores opciones para innovar.


Design Thinking


IDEAR

“Construye para pensar y evalúapara aprender.”

PROTOTIPAR

El modo Prototipos es la generación de elementos informativos como dibujos, artefactos y obje-tos con la intención de responder preguntas que nos acerquen a la solución final.O sea no necesariamente debe ser un objeto sino cualquier cosa con que se pueda interactuar. Puedeser un post-it, un cartón doblado o una actividad e incluso un storyboard. Idealmente debe ser algocon que el usuario pueda trabajar y experimentar. Es un proceso de mejora o sea en las fases iniciales de cada proyecto puede ser un poco amplio y el prototipado debe ser de manera rápida y barata dehacer pero que puedan entregar tema para debatir y recibir feedback de usuarios y colegas. Esteproceso se va refinando mientras el proyecto avanza y los prototipos van mostrando más características como funcionales, formales y de uso.

Por que hacer prototipos?

• Para inventar y construir para pensar en resolver el problema

• Para comunicar. Si una imagen vale mil palabras, un prototipo vale mil imágenes• Para empezar conversaciones. Las conversaciones con los usuarios son más eficientes cuando

están concentradas sobre algo con que conversar como un objeto

• Para cometer errores antes y de manera barata• Para evaluar las alternativas. Ayuda a desarrollar bien distintas ideas sin tener que

comprometerse con una demasiado temprano

• Para controlar el proceso de la creación de soluciones. Ayuda a identificar distintas variables

• para poder descomponer grandes problemas que se puedan evaluar y arreglar de mejor forma.

Design Thinking


IDEAR

“Construye para pensar y evalúapara aprender.”

PROTOTIPAREVALUAR

Este paso consiste en solicitar feedback y opiniones sobre los prototipos que se han creado de los mismos usuarios y colegas ademásde ser otra oportunidad para ganar empatía por las personas de las cuales estas diseñando de otra manera. Una buena regla essiempre hacer un prototipo creyendo que estamos en lo correcto pero debemos evaluar pensando que estamos equivocados.Esta es la oportunidad para refinar las soluciones y poder mejorarlas. Idealmente se debe evaluar y testear en el contexto mismo delusuario.

Por que Evaluar?

Para refinar prototipos y soluciones. Informa los siguientes pasos y ayuda a iterar, lo que algunas veces significa volver a la mesa dedibujo.

• Para aprender más sobre el usuario. Es otra oportunidad para crear empatía a través de observaciones y engagement. Muchasveces entrega inesperados insights

• Para refinar el POV. Algunas veces la evaluación revela que no solo nos equivocamos en la solución pero también enenmarcar bien el problema.

Como evaluar?

No lo digas, muéstralo: Dale a los usuarios tus prototipos sin explicar nada. Deja que la persona interprete el objeto y observa tanto

el uso como el mal uso de lo que le entregas y cómo interactúan con él, posteriormente escucha todo lo que tengan que decir al

respecto y responde las preguntas que tengan.

• Crea Experiencias: No es suficiente solo entregarles el objeto, lo ideal es crear el ambiente y recrear la experiencia para tener una visión más acabada del contexto.

• Pídele al usuario que compare: Esto es, entregarle distintos prototipos para probar dándole al usuario una base para poder

comparar, esto revela necesidades potenciales.


Metodología Fiori SPLASH


Design Thinking

SPLASH

IDEARPROTOTIPAREVALUAR

Recientemente SAP publicó Splash como la nueva herramienta para el prototipado de

SAP Fiori-like Apps y queremos compartir cómo hemos logrado introducir

satisfactoriamente su uso logrando una serie de beneficios que con otras herramientas de prototipado no fue posible.

Básicamente el objetivo de un prototipo, es mostrar como podría ser un producto

final pero sin desarrollar por completo su funcionalidad o la integración con otros sistemas.

De este modo, un usuario puede hacerse a la idea de cómo se cubren los

requerimientos mediante el nuevo producto software sin necesidad de tener que disponer

del producto software final. Precisamente esto último, es lo que sucede en los proyectos

con metodologías tradicionales donde la implementación de un nuevo módulo funcional

requiere de muchísimos cambios en su etapa final y esto provoca triplicar el esfuerzo del equipo ya que es mucho más simple modificar un prototipo.


Design Thinking

SPLASH

IDEARPROTOTIPAREVALUAR

Las principales características que cabe destacar son:

Creación de prototipos directamente con tecnología

SAPUI5. Desde cero o desde un template tipo Fiori

existente en Splash. Esto simplifica crear el prototipo ya

que con otras herramientas existentes en el mercado no

es tan simple prototipar con los mismos componentes que

ofrece SAPUI5. Además, el usuario final puede percibir un

prototipo sesgado respecto al producto software final.

Design Thinking

SPLASH


Revisión online por parte del equipo. Donde el equipo

de prototipado podrá revisar y validar el prototipo

Design Thinking

SPLASH


Composición UI- permite a los usuarios no técnicos para generar aplicaciones mediante la creación de interfaces de usuario con componentes reutilizables, las interacciones y las reglas sin escribir una sola línea de código. (Esta es una característica prevista.)


Design Thinking

SPLASH


El modelado de datos - facilita el enlace de datos y el modelado. Puede ser utilizado para la práctica tradicional de desarrollo de aplicaciones de abajo hacia arriba, donde el usuario puede utilizar un modelo de datos nueva o existente. BUILD genera la interfaz de usuario basada en el modelado de datos. Además, el modelado de datos es compatible con plantillas predefinidas de SAP. (Esta es una característica prevista.)

Design Thinking

SPLASH


Colaboración- proporciona herramientas de colaboración que permiten a los usuarios compartir información e ideas y de forma rápida y eficiente proporcionan retroalimentación entre sí en el contexto de la tarea en cuestión. (Esta es una característica prevista.)

Independencia de la tecnología - diseñado para facilitar el taponamiento en las bibliotecas de control de interfaz de usuario desde diferentes marcos de interfaz de usuario, tales como OpenUI5, Widgets angular, de controles HTML personalizada, y así sucesivamente. (Esta es una característica prevista.)

Extensibilidad- con arquitectura para permitir la creación de nuevos componentes reutilizables, compartirlos con otros usuarios ,definiendo bibliotecas de interfaz de usuario personalizados. (Esta es una característica prevista.)

Directrices de interfaz de usuario y reglas - ayuda a los usuarios a crear aplicaciones compatibles de acuerdo con las directrices de interfaz de usuario predefinidos, teniendo en cuenta las actuales estadísticas de contexto y uso. (Esta es unacaracterística prevista.)

Administración- permite a los usuarios con permiso de administrador para configurar y personalizar la plataforma, por ejemplo, mediante la especificación de las bibliotecas de interfaz compatibles, la conexión a los sistemas de back-end, gestión de usuarios, y así sucesivamente. (Esta es una característica prevista.)

Design Thinking

SPLASH


Gestión de proyectos - permite a los propietarios de los proyectos para configurar sus usuarios, gestión de equipos, crear proyectos, y gestionar los activos compartidos en un nivel de proyecto. (Esta es una característica prevista.)

Jumpstart desarrollo- importar su código de prototipo en WebIde. Después de que el prototipo es completado y revisado, puede ser utilizado como una especificación. (Esta es una característica prevista.)

DeploymentComo producto en la nube, BUILD pronto estará disponible en SAP HANA Cloud Platform (HCP) donde estará disponible para los clientes integrados con otras herramientas de desarrollo (como WebIDE). Se va a construir un proyecto de código abierto, y seremos capaz de clonar nuestro prototipo y personalizarlo a nuestras necesidades.


Desarrollo


Que es SAP Web IDE?

SAP WEBIDE es una poderosa herramienta de desarrollo integrado basado en Web para apoyar el ciclo de vida de desarrollo de aplicaciones end-to-end para la biblioteca SAPUI5

• Herramienta disponible en SAP HANA Cloud Platform Un entorno de desarrollo integrado a:

Crear nuevas SAP FIORI App SAPUI5/HTML5

Extender Apps SAPUI5 y SAP Fiori

Desarrollar prototipos muy rápido, test, package, and deployaplicaciones. Soporte the end-to-end para el ciclo de vida de una aplicación.

Potenciar templates existentes y apps de ejemplo para acelerar desarrollo móvil.

Deploy apps al ABAP Repository o HCP

Ampliación en SAP Web IDE con plug-ins

adicionles.


A que usuario esta dirigido?

Cualquiera que busque un IDE seguro y moderno. Los usuarios que quieren que su código en línea y

accesible desde cualquier lugar para que funcionen de manera más eficiente.

Los usuarios que quieran diseñar, construir, probar y desplegar aplicaciones SAPUI5 y Fiori en HANA o servicios Gateway Odata.

Desarrolladores de aplicaciones

Expertos de negocios

UI Designers


Beneficios

Desarrollar una vez, desplegar todas en partes y funcionar en cualquier dispositivo de escritorio, tableta, Smartphone.

Reduce el costo, la complejidad y el esfuerzo a través de instalación cero basado en la nube.

Aumenta la productividad de los desarrolladores con plantillas de código y las mejores prácticas de SAP

Mejorar la productividad del equipo con la capacidad de codificar y colaborar en cualquier lugar


Las características clave 1/2

Ambiente de desarrollo

Editor de código fuente con autocompletado de código ,específica SAPUI5.

Editor WYSIWYG(What You See Is What You Get)

Preview instantánea en el Browser Soporta Mock data para test

El deploy esta integrado en plataformas

SAP HANA (Cloud Platform y el repositorio ABAP)

mecanismos de extensión de la aplicación interactiva de fácil uso

Posibilidades de extensión via plugins

Desarrollo colaborativo y persistencia de proyectos

Soporte hybrid Mobile


Las características clave 2/2

Templates para crear proyectos Proyecto básico SAPUI5, SAP Fiori

Extensiones SAP Fiori

SAP Hybrid Mobile

Plugin para desarrollo

Ejemplos de aplicaciones Aplicaciones de referencias SAP

Fiori

Aplicaciones Ramp-up Fiori Se pueden

desarrollar fácilmente listas para ser

auditados y para su gestión end-to-end se

generan muestras como referencia


Crear nuestro template


Overview proceso desarrollo Crear Desarrollar Preview Deploy

Crear Preview DeployDesarrollar

Nuevo / Importar

14

Integracion Git

Extensibilidad Visual

Cuando Ejecuta el SAPUI5/Fiori appseleccionar un elemento y aplicar la extensión, modificación o reemplazo

DesdeGit

Repository

Proyecto Extension

HCP

WYSIWYG Diseño de UI en el Layout EditorDesde HCPEjemplo

(Aplicación

Referencia)

TemplatesGuía al usuario paso a paso en el proceso ,automáticamente para generar archivos y código.

DesdeSAPUI5

ABAP repository

Proyecto desde

Template

SAPUI5

ABAP

repository

Codificando

Editor con autocompletado de código

De ArchivoInicio con

Layout


Pantalla Bienvenida


• Links externos

• Recursos Externos

• Rápido y fácil

acceso a las

acciones de

creación más

comunes

• Versión Actual

• Notificación en cada momento si hay algo nuevo.

• Los usuarios pueden leer algo nuevo

Perspectivas:

• Home

• Dearrollo

• Preferencias

Usuario


Overview ambiente desarrollo


Toolbar

MenuBúsqueda

Repositorio

Buscar un archivo

(nombre o contenido)

Git

Manejo de objeto en

Git repository

Git History

Tag, seleccionar,Revertir,commit

Editor

SAPUI5 code editor

Autocompletado

API Reference

Context sensitive

Soporte dinamico

Outline

Crear Desarrollar Preview Deploy


Crear Crear Desarrollar Preview Deploy

Varias opciones para desarrollar nuevos proyectos

1 File > New

• Crear nuevo proyecto

• Desde un template

• Desde una aplicación de ejemplo

• Inicio Rápido con el Layout Editor

• Crear nueva extension de proyecto,

e.g. for SAPUI5 or SAP Fiori

extensibility

File > Import

• Crear un proyecto por importing

desde:

• EL file system (file, ZIP archive, etc.)

• ABAP repository

• HCP

File > Git

• Crear un proyecto existente en

Git repository

1

2

2

3

3


Comenzar con Layout Editor

Con un clic comenzar una aplicación

Proyecto “QuickStartApplication” segeneró.

Modelo se crea con tres tipos de

entidades simples.

JSON files con mock data son

generados.

View son creadas.

Layout Editor es lanzado con VIEW. 19


Templates Crear Desarrollar Preview Deploy

El asistente de plantilla guía al usuario a traves de la definición de una aplicación,

generando el código.

Standard templates que son provistos

Proyectos SAPUI5

–

–

–

Aplicaciones SAPUI5

SAPUI5 Master-Detail

SAPUI5 Worklist

Proyecto vacio

Ejemplos de aplicaciones

Fácil Ejemplos ramp up Fiori ready- to-run end to

end

Plantillas adicionales de cualquier tipo pueden ser creado, agregado y gestionado


Se puede elegir la

versión SAP UI


Template library

En esta sección se muestran los templates disponibles


Tools > Template Library



Layout Editor (WYSIWYG)

Se diseña la vista gráficamente en el Layout Editor y muestra el contenido en la vista XML

Clic con el botón derecho en la vista XML se abre el Layout Editor

Diseñar la vista en la pantalla gráfica (canvas).

Drag & drop en los controles SAPUI5 desde el Palette alCanvas.

Configurar las propiedades de los controles.

Bind los campos de datos a el OData service entity sets.




Layout Editor (WYSIWYG)

del canvas


Smartphone

Tablet

DesktopCanvas

Contiene la XML view

Graphical display

Icono para abrir Outlinepane

Propiedades y Data pane

Muestras propiedades y datos

Del control seleccionado

Entity sets y propiedades de

OData service

OData binding

Palette

ControlesSAPUI5

Controles drag & drop



Codificacion (desarrollo asistido)

Autocompletado de código

Para JavaScript y XML

Context sensitive

El editor completa palabras, fragmentos de código o bloque enteros

Fragmentos de archivos JavaScript y XML

Navegación de archivos cruzados

Tipos embebidos definidos en JSdoc

Validadores

Validador FIORI, configurable

Linting (JavaScript, XML)

Niveles de chequeo de código puede ser definido (All, Error, Error and Warning, Disable)

Embellecimiento (JavaScript, XML, CSS)

Autocompletado Metadata desde schemas

Contexto de menú

Panel Referencia API

Auto-save



Nuevo Proyecto Extensibilidad Crear Desarrollar Preview Deploy

2 opciones. Puede también:

La herramienta crea el proyecto de ampliación en workspace y genera los archivos tales como

Component.js

index.html

Etc.

Para Remoto, seleccionar el sourcesystem:HCP o ABAP repository

Opcion para importar la app original

Opcion para abrir la extension en el panel

de.Ext.después de la generación del Proy.


1. Importar la app padre del workspace

2. Acceder a la app padre remotamentey

Al crear una nueva solicitud de extensión está extendiendo proyecto, es necesario identificar la aplicación padre

SAPUI5 o Fiori estándar de SAP.


Extensibilidad

El panel Outline es mostrado después de la app.

Mientras se ejecuta la aplicación, se

puede seleccionar un elemento, ya sea

en el panel Outline o directamente en la

aplicación en el modo de extensibilidad

Opciones de extensión apropiados se

pueden elegir

Mostrar todos los elementos de la

aplicación, o filtrar por elementos

extensibles o extendidas

Cambiar el idioma usando las

características i18n

La aplicación puede obtener datos en línea

del back-end o el uso de Mock Data© 2015 SAP SE or an SAP affiliate company. All rights reserved. 26


Extensibilidad por medio de una plantilla

La plantilla para la ampliación de una resp SAPUI5. Tiene guías de aplicaciones SAP Fiori donde el usuario tiene el paso a paso través de un proceso.Todas las opciones de la extensión del concepto de extensibilidad SAPUI5 / SAP Fiori se proporcionan en la plantilla:

Crear proyecto de extension

Extender controller

Ocultar control

Extender View o Fragmento

Reemplazar View

Reemplazar servicio

Configurar texto de i18n

Implementar un UI controller hook

Adicionar nuevas views en el proyecto

Para añadir una nueva extensión, seleccione el proyecto de ampliación y seleccioneuna de las plantillas disponibles.




Extensibilidad via template:Reemplazar View

Este ejemplo ilustra la secuencia de pantallas




Ejecutar Aplicación Crear Desarrollar Preview Deploy

Hay varias maneras de ejecutar su aplicación :

Ejecutar como

Web Application: Vista previa de la aplicación en el navegador

Unit Test: ejecutar la aplicación como una prueba de la unidad

SAP Fiori Component:Ejecutar en FIORI LAUNCHPAD

Ejecutar configuraciones

Ejecutar con Mock Data

Automatically generated data

Mock data provided in JSON files

Ejecutar en ABAP Server : ejecutar aplicaciones que se

desplegaron en un Servidor de ABAP, por ejemplo, SAP

Gateway

Ejecutar en SAP HANA Cloud:ejecutar aplicaciones que se desplegaron a SAP HANA Cloud Platform


Preview Crear Desarrollar Preview Deploy

Opción para ejecutar con Frame en Configuración del proyecto

rectangulo


Idioma

SI la aplicación soporta

múltiples idiomas (las

propiedades i18n)

Codigo QR

Un código QR es generado por

una URL

Click en el

Orientacion

La orientacion de la pantalla

puede ser alternar entre vista

horizontal y vertical

Refresh

La aplicacion Puede ser

recargada y volver a ejecutar

desde el ambiente de desarrollo

Elegir Simulador

Desktop

Disp. Móviles, e.g. iPad

(medio), iPhone (Pequeño),

Android, etc.

Definir Tamaño

La app. Es responsiva

• Su apariencia será

adaptada al tamaño de la

pantalla

Multiples Tamaño de

pantalla son predefinidos

Frame


Ejecutar configuraciones Crear Desarrollar Preview Deploy

Puede configurar cómo ejecutar las aplicaciones enla configuración del proyecto :

Ruta de archivo de la aplicación en el archivo que se utiliza para ejecutar la App.Ejecutar la aplicación en preview con y sin Frame.

Abrir la aplicación con Mock data

Mapeo de recursos de aplicaciones, i.e. dónde buscar

los recursos de las aplicaciones

Parametros par URL: nombre = valor


Ejecutar una App. Con Mock Data Create Develop Preview Deploy

Puede ejecutar la aplicación con mock data, por ejemplo, en caso

de que sus sistemas back-end no están preparados o no disponible

Hay 2 opciones:

Dejar que el servicio mock genere datos

Proveer datos en un archivo JSON

Seteos:Editar Mock Data permite crear un archivo JSON


Deploy Crear Desarrollar Preview Deploy

Varias opciones están disponibles para el desarrollador para implementar: Deploy de la APP. A SAPUI5 ABAP Repository, e.g. SAP Gateway,

SAP Fiori front-end server

Deploy de la APP a SAP HANACloud Platform (HCP)

Es posible implementar ya sea una nueva aplicación o actualizar una

aplicación existente en el sistema de destino

Opciones Adicionales esta disponibles HCP:

Registrar la app. En SAP Fiori launchpad

– Una vez finalizado el registro, un nuevo Tile se crea en SAP Fiori

Launchpad, asignado a un grupo (opcional), la categoría, y el content

Package

Ver el estatus de la aplicacion

– Verificar si la aplicación ha sido deployed to HCP.

Si no fue asi, podemos hacer el deploy desde aca.

– Checar si nuestra aplicación ha sido registrada en

SAP Fiori launchpad

33Ing. Sergio Fabian Cannelli Consultor SAP

Deploy enSAPUI5 ABAP repository

2

13

34

• Deploy como

nueva App

• Actualizar una

App.Existente

• Si se requiere el transporte,

seleccione una orden de

transporte. El ID de solicitud

se generará automáticamente.



Deploy enHANA Cloud Platform

2

1

3

Estatus App

35

• Una vez que la aplicación se implementa con éxito,

es posible comprobar el estado de la App

• State (started, stopped)

• Version numbers

• Active version

• Ver estatus App. En HCP

• Definir numero versión

• Es posible activar

automáticamente la aplicación de

HCP


Que hay disponible?

Tres lugares específicos hay disponibles


Shop Approve Purchase Orders Manage Products

• App.Transaccionales

• P a t r o n de pantalla completa

Puede navegar por productos y añadirlos a una

cesta de compra

• App.Transaccionales

• P a t r o n e s Master-detail

Puede revisar y aprobar / rechazar las

órdenes de compra

• App. Transaccional con datos

maestros y drafts

• P a t r o n Master-detail

Puede mantener el producto de la tienda


¿Cómo puedo hacer uso de las aplicaciones de ejemplo SAP Fiori ?

En contraste con las plantillas, aplicaciones de referencia SAP Fiori son aplicaciones completas con toda la codificación. Se pueden utilizar como referencia o para copiar y pegar.

• Proporcionan codificación y comentarios integrales

• Mock-server permite ver de inmediato datos . incluso sin un sistema de back-end


SAP Web IDE Plugins

Hybrid Application Toolkit Crea y deploy Apache Cordova hybrid apps

Templates, autocompletado, testing, build and deploy

OData Model Editor

Definir y modificar OData Models

Asistente de código, autocompletado, validacion and visualizador

grafico.

Fact Sheet Editor

Crea fact sheets from scratch

Editar nuevo/existente fact sheets usando drag-and-drop

VizPacker

Creando extensiones visuales para Analytics – Lumira, Design

Studio

SAP Events Management

Crear apps transaccional autodefinida para SAP Event Management

SAP Hana Cloud Portal Facilmente se crea OpenSocial widgets para uso en Cloud Portal


Extensibilidad


SAP Fiori, extensibilidad

SAP Standard Application

Custom Application (extendiendo standard)

42

Ocultar control

Nueva funcion

Nuevo Campo


SAP Fiori ,extensibilidad conceptoUI Extensibilidad

43

Aplicación padre

Component.js

Extension

Component.js

Declarar carga

extend

Extensiones

Modificación libre


SAP Fiori extensibilidad conceptoComponent.js

jQuery.sap.declare("<app name>.Component");

JavaScriptnamespace de customapp

sap.ui.component.load({

name: “<parent app name>",

url: “<parent app url>"

}); carga parent application

<app name>.Component.extend(“<app name>", {metadata:version config:},

{: "1.0",{ extendiendo custom

app

customizing: {

} customization va aqui}

});


SAP Fiori extensibilidad conceptoModel-View-Controller (MVC) & extensiones

Modelos(OData)

data binding implementacion

Views(XML Views)

Controllers(JavaScript)

implementacion

interface

a dView, modificacion

Modificar ciertas propiedades, i.e.

ocultas un control en la standard

view

View ,Extension

Un Custom view contiene un punto

de extensión predefinido del

standard view

View ,Reemplazo

Custom view reemplaza una

standard view

Controller, Extension

En ejecución mezcla standard y custom

controller

Añadir funciones personalizadas del controlador

Sobreescribe las funciones de controlador estándar

• •

b •

c •

45

Extensión OData

NetWeaver Gateway


UI Extensibilidad

https://sapui5.netweaver.ondemand.com/sdk/#docs/guide/Customization.htmlConfiguraciones de Componentes

La personalización se basa en la configuración de los componentes. Un área especial de su configuración se dedica a la personalización de la información. Esta configuración se encuentra en un archivo JavaScript llamado Component.js (or Configuration.js).

Custom extension

Personalización se puede realizar en una aplicación personalizada que extiende una aplicación estándar . La aplicación personalizada se encuentra en un proyecto separado. Ambas aplicaciones contienen el archivo Component.js (o Configuration.js) y la aplicación personalizada contiene todos los cambios.

Libre modificación

La aplicación estándar se mantiene sin cambios y por lo tanto se considera la extensión a ser libre

modificación

Custom application

La aplicación personalizada se convierte start-up-project ,cuando se inicia ,se hace con la configuración personalizada adicional.

46

SAP Fiori extensibilidad concepto

https://sapui5.netweaver.ondemand.com/sdk/#docs/guide/Customization.html

Componentes


Sistema

Alguna SAPUI5 apps SAP Fiori apps

TemplatesExternosPlugins SAP Web IDE

ExternosServicios

52

Hybrid App Toolkit

OData Model Editor

SAP Gateway

(OData services)

VizPackerSAPUI5GitOrion

Fact Sheet EditorSAP HANA XS

(OData services)

SAP HANA Cloud Portal

Templ

Plug-ins


Opciones

Hay múltiples opciones para usar WEBIDE

SAP Web IDE plugins

• Proporcionado por HCP (AppServices)

• Desarrolla en el cloud

• Conecta a su cloud u on-premise

• Deploy apps en el cloud u

on-premise, e.g. SAP

Gateway

••

Desarrollar en una PC

Deploy apps en on-premiseABAP

repository, e.g. SAP Gateway solo

para propósitos trial

• Desarrolla y deploy HANA XSnative HTML5 apps

•

53

ProduccionTrial soloTrial

Produccion

SAP HANA Cloud Platform

(HCP)Instalación Local HANA XS

SAP Web IDE HANA Workbench


Sistema para SAP HANA Cloud Platform

Alguna SAPUI5 apps SAP Fiori apps

Templates

SAP Web IDEPlug-ins

Servicios externosSAP HANA

Cloud Platform

(OData services)

57

SAP GatewaySAPUI5GitOrion

SAP HANA XS

(OData services)

DispatcherCockpit

Templ

Plug-i


loud

H

Overview ,sistemafor SAP HANA Cloud Platform

Desarr/

Diseñad/

Funcional

Especialist

(

Internet / Cloud

Red corporativa / Intranet HTTPS

Windows OS

Linux OS

Mac OS X(all 64-bit)

TTP(S)

Trusted RFC

For more details: SAP Web IDE Developer Guide

58

Business Suite / ERP

SAP Gateway

SAP HANA C Connector

Version( App Projects)


Cockpit

SAP Web IDE

Orion Git SAPUI5

Permanent FileSystem


https://help.hana.ondemand.com/SAP_RDE/frameset.htm?c175c03da2534e4b9b3ea28687f6cb0a.html

Ejecutando Apps HTML5 en SAP HANA Cloud Platform

SAP Web IDE inbrowser

Applicacion

Git

Internet / Cloud

HTTPSRed corporativa / Intranet


59

SAP Gateway

Via Cloud Connector

Trusted RFC


Orion

SAP HANA Cloud Platform account

Deploy HTML5 AppsSAP Web IDE Dispatcher

Push / Fetch

(App Projects) OData

User Workspace

OData



Running HTML5 Apps on SAP Gateway

SAP Web IDE

Git

Internet / Cloud

HTTPSCorporate Network / Intranet

Application


60

SAP Gateway

Via Cloud Connector

Trusted RFC


Orion


SAP Web IDE

Push / Fetch

(App Projects)

OData User Workspace

Deploy



SAP HANA Cloud Connectivity Service

Integracion segura SAP Web IDE <> on-premise systems

Establece túnel SSL segura entre el SAP HANA Cloud y on-premise systems para conectar al backend para: Business data

SAPUI5 Core/Runtime

App deployment

Seguridad

SAP WebIDE se basa en la infraestructura del HANA Cloud Platform para la autenticación y conectividad segura a diferentes sistemas (SAP GATEWAY) u otros componentes (Orion, Git). Como parte de la Plataforma de la nube HANA, SAP Web IDE se adhiere a los términos y condiciones estándar de SAP para los productos cloud relacionados con la protección de datos y privacidad.SAP WEBIDE podría utilizar cualquier proveedor de identidad (IdP) - incluyendo al cliente definido o conexión segura para sistemas on-premise a través cloud connector de SAP .

Internet

© 2014 SAP AG or an SAP affiliate company. All rights reserved. 61

Customer(on-premise) SAP HANA

Cloud Connector

ERP NW Gateway Otros

SAP Web IDE

HANA Destinos

Cloud

Platform


Conectando Cloud Applications con On-Premise Systems

El acceso a los sistemas en las instalaciones de la nube puede ser por 2 caminos

Una red existente puede ser

usadaReverse proxy

On-PremiseConfiguración del servidor de seguridad DMZ es necesario un firewall, los ataques de Internet son posible, no todos los protocolos se soportan

HANA CloudPlatform

Firewall Proxy

DMZ

SAPApplication

FirewallPublicInternet

Uso de SAP HANA Cloud Connector Como un agente on-premise

+ Sistemas en las instalaciones no accesibles desde Internet, de fácil instalación y configuración adicionalon-premise .

HTTPSOn-Premise

HANA CloudPlatform

–SSLVPNSAP Cloud Firewall

ApplicationConnectorProxy

DMZ

Firewall PublicInternet


What is Git?

Git es un sistema de gestión de código fuente con control de versiones y ampliamente utilizado que registra instantáneas de todos sus archivos a través del tiempo.

Control de version

Control de versiones distribuidos

Creado en 2005 para Linux

Permite collaborativeworkflows

66

Git esta disponible en SAP HANA Cloud Platform y soportada por

SAP Web IDE


Git en HANA Cloud Platform usado por SAP Web IDE

El código fuente se almacena en repositorios GitCada desarrollador tiene un clon local en un repositorio remoto central. el clon sólo se ejecuta inicialmente para crear el repositorio Git local. (Si se ejecuta de nuevo el clon, entonces repositorio Git local se sobrescribirá)Un estado especifico de repositorio es controlado dentro del workspace del desarrollador.

Los cambio son recogidos en commits

Git permite hacer branch o mezcla de branch

Repository

CommitFiles

67


Remote

Git

Repository

Clone

Fetch 1 Push

4

Workspace Checkout

2 Local Git

3


SAP Web IDE integración con GIT

IDE Web SAP permite desarollo colaborativa , proporcionando una integración perfecta con su repositorio Git via el plugin cliente Orion Git


Commit, Push, Stash

Panel GIT


Git repository configuration


Ejercicio


Perfiles HANA


69

Posible Perfil técnico en programación

Programacion ABAP, Con SAP NetWeaver Developer Tools for ABAP, SAP planea ofrecer un entorno de desarrollo de última generación, basado en Eclipse, para ABAP. Para los clientes y partners que estén usando SAP HANA, se integrará sin dificultades con SAP HANA Studio y permitirá a los desarrolladores implementar aplicaciones de punta a punta, inmemory, en un entorno unificado.Desarrollo ABAP en cualquiera de los productos montados en HANA ,conectando con HANA a traves de CDS ABAP . Ademas de los nuevos ALV ,llamados ALV IDA(Integrated data Access).


69


Si nos vamos a HANA en si mismo el conocimiento básico debería ser(HANASTUDIO o HANA IN CLOUD

Para FRONTEND

Http/s HTML5/SAPUI5 CLIENT SIDE Javascript(XSJS)

Control Flow Techonologies SAP HANA XS Odata Javascript(XSJS) XMLA

Calculation Logic

SQL/SqlScript Calculation Engine Functions Application Function library

SAP FIORI ,incluyendo la metodología DESIGN THINKING. SAP LUMIRA SLT Git HUB Interation HCI(Hana Cloud Integration) SMP(SAP Mobile Platform)


69


Otro perfil por si solo es Modelado HANA. El conocimiento básico para modelado seria:


69


Otro perfil por si solo es Modelado HANA. El conocimiento básico para modelado seria:

En resumen para el perfil SAP HANA DEVELOPER Conocimiento de la Arquitectura SAP HANA. Uso de SAP HANA Studio Métodos de Extracción de datos con alguna de las siguientes herramientaSLT, SAP Data Services,

Flat File Upload, Direct Extractor Connection. Modelado: Vista de Atributos, Vistas Analíticas, Vistas de Calculo. Manejo de joins. Uso de jerarquías. Uso de variables. Utilización de filtros. Uso de measures restringidos y calculados SQL/SQLSCRIPT Herramientas de front end para SAP HANA


69


Para SAP FIORI Diseño y mapeo de odata services Configuracion OData services y SICF services Configuracion de catalogos Fioris /Tiles y ajuste de roles en Launchpad en

LPD_CUST Redefinicion de UI FLP tiles Uso de WEBIDE usando SAP HANA cloud connector Experiencia en Configuracion de Fiori Apps Setup de Fiori Launchpad Implementacion de tareas en Front End Server

Implementacion de tareas en Back End Server User Management Concept Implementacion para Factsheet y Analytical Apps Extensibilidad de Fiori Applications Extension de UI Layer Hybrid Kapsel Fiori app


69

Los pasos que debe saber un consultor FIORI

Paso 1 : DEFINIRDescribe su objetivo para App. Fiori, clave diferenciadora, Objetivo público y elimpacto en cómo se trabaja en la actualidad.Paso 2 : DESCUBRIRDescubre cómo maximizar la simplificación y la satisfacción del usuario.Construir escenarios de casos de uso. Averiguar si se pueden consideraraplicaciones estándar Fiori: SI: ir a paso 5: deploy. If no, ir paso 3.Paso 3 : DISEÑARCrear wireframes, visual designs, mockups, journey maps. Consultar con losusuarios. Aprovechar las prácticas de usabilidad respecto a navigation & search,forms y user flows. Estas prácticas no son específicos para el diseño deaplicaciones Fiori: que se pueden aplicar en todos sus diseños digitales. Estobásicamente es usar Design Thinking ,Splash&BuildPaso 4 : DESARROLLARDesarrollar la aplicación Fiori e integrarlo con el sistema backend.Paso 5 : DEPLOYHace deploy de nuestra app, sin antes crear una unidad de test e integración.
