Confronto SAP Fiori e SAP GUI

Confronto SAP Fiori e SAP GUI. Abbiamo già parlato nel nostro blog sia di SAP Fiori che di SAP GUI.

Nel corso degli anni SAP ha apportato molte modifiche alla sua interfaccia utente.

Per molto tempo, SAP ha avuto l’immagine di non fornire interfacce utente aggiornate per il suo software di pianificazione delle risorse aziendali (ERP). L’interfaccia grafica SAP (SAP GUI), spesso ingombrante ma consolidata tra i clienti SAP e amata dai power user, non era più lo stato dell’arte per molti casi d’uso. La GUI di SAP era l’interfaccia utente standard per le soluzioni SAP classiche, come SAP R/3. Spesso gli utenti SAP dicevano che le interfacce utente erano funzionali ma non attraenti. In molti casi, le applicazioni SAP GUI sono dotate di funzionalità per gruppi di utenti molto diversi tra loro e quindi spesso appaiono disordinate e non sono intuitive da usare. Le app SAP GUI sono accessibili tramite SAP Logon. Si tratta di un’applicazione che deve essere installata sul computer dell’utente finale.

La SAP GUI esiste anche nei sistemi SAP S/4HANA. A questo punto, SAP ha fatto il suo dovere anche per quanto riguarda i temi e ha fornito temi simili allo stile di SAP Fiori (es. Belize Theme o Blue Crystal Theme).

Nelle sezioni che seguono, illustreremo come la tecnologia Web è stata utilizzata da SAP nella storia e perché è alla base delle applicazioni SAPUI5, SAP Fiori e SAP Fiori elements di nuova generazione.

L’emergere delle interfacce Web 1 (Confronto SAP Fiori e SAP GUI)
Con il boom delle dotcom, iniziato alla fine degli anni ’90, molti fornitori di soluzioni software as a service (SaaS) sono entrati in scena e sono diventati seri concorrenti nell’ambiente del software aziendale. Questi fornitori e operatori di software cloud si sono concentrati su interfacce utente semplificate e basate sul Web. Rispetto a SAP, i concorrenti hanno potuto iniziare in condizioni completamente diverse. Le loro interfacce utente non erano né storicamente cresciute né utilizzate da centinaia di migliaia di clienti aziendali. Una nuova release del software SAP che non fosse retrocompatibile, invece, avrebbe portato a un gran pasticcio. Quando si sviluppa un software da zero, invece, il requisito della retrocompatibilità non si applica. In questo contesto, si può affermare che SAP è quasi sempre riuscita a trovare un equilibrio tra innovazione e retrocompatibilità, riuscendo così a soddisfare la maggior parte dei clienti SAP.

Anche prima dell’introduzione di SAPUI5 e SAP Fiori, SAP stava perseguendo i propri approcci per le interfacce utente basate sul Web. Con Web Dynpro Java e Web Dynpro ABAP, l’azienda disponeva già di tecnologie valide da offrire a metà degli anni Novanta.

Che cos’è Web Dynpro? Web Dynpro è un modello di programmazione indipendente dal client per lo sviluppo di interfacce utente per applicazioni aziendali. Si basa sul modello architettonico Model View Controller (MVC), che garantisce la separazione della logica aziendale di un’applicazione dal livello di archiviazione dei dati e dalla logica di presentazione. Web Dynpro viene eseguito sulla piattaforma tecnologica SAP NetWeaver ed è stato introdotto per SAP NetWeaver Application Server for Java nel 2004 e per SAP NetWeaver Application Server for ABAP nel 2006. Le applicazioni Web Dynpro vengono create nei linguaggi di programmazione Java o ABAP. La conoscenza di JavaScript e HTML non è obbligatoria per lo sviluppo, il che ha favorito l’accettazione da parte degli sviluppatori SAP.

Tuttavia, la crescente diffusione di smartphone e tablet e il loro utilizzo come dispositivi finali mobili per le app aziendali ha evidenziato i limiti di questa tecnologia. Sempre più utenti di software aziendali erano abituati a lavorare esclusivamente con applicazioni basate sul web o native, adattate in modo ottimale ai sistemi operativi dei loro dispositivi mobili. Questo ha cambiato anche le aspettative per le app in ambiente aziendale. Prendiamo ad esempio i social network come Facebook o LinkedIn, i motori di ricerca come Google o le offerte di e-commerce come Amazon, Alibaba o Zalando. Riconoscerete subito un punto in comune: tutte queste piattaforme sono basate sul web e sono integrate da applicazioni mobili native, ove opportuno. Le soluzioni SAP, invece, in questo periodo utilizzavano in gran parte tecnologie proprietarie. La richiesta da parte degli utenti di interfacce utente moderne, come quelle offerte anche nel mondo consumer, cioè nel settore privato, ha spinto SAP a investire in quest’area e a fornire una soluzione adeguata con SAPUI5.

Le tecnologie proprietarie non sono sempre svantaggiose, ma in molti casi comportano un vendor lock-in. Inoltre, rispetto alle tecnologie e agli standard aperti, tali soluzioni si rivolgono di solito solo a un gruppo più ristretto di potenziali sviluppatori. Nel settore delle app native per dispositivi mobili, il dominio di Apple con il suo sistema operativo iOS e di Google con il suo sistema operativo Android significa che siamo in parte anche nel regno delle tecnologie proprietarie, ma questo è compensato dal fatto che molti sviluppatori di app native sono spesso diventati milionari da un giorno all’altro grazie all’ecosistema associato. Non mancano quindi i ritardatari che vogliono fare lo stesso e che hanno familiarizzato con le tecnologie corrispondenti. SAP sta cercando di implementare un concetto simile a quello degli app store di Google e Apple in SAP BTP con il SAP Store. Gli sviluppatori possono utilizzare lo store per fornire alle aziende partner di SAP le proprie app per i clienti SAP. In questo modo, SAP vuole attirare una comunità di sviluppatori più ampia sulla propria piattaforma.

Continua esistenza di soluzioni proprietarie SAP (Confronto SAP Fiori e SAP GUI)

Sebbene SAP si stia affidando sempre più a tecnologie aperte, va detto che i concetti fondamentali del sistema SAP, come il dizionario ABAP (DDIC) o addirittura il sistema di trasporto, sono ancora ineguagliati anche al 50° compleanno di SAP, nell’aprile 2022. Questi concetti sono ancora così brillanti che è impossibile immaginare lo sviluppo ABAP moderno senza di essi. Il solo fatto che si possano ancora utilizzare i testi e le traduzioni del DDIC, magari i brevi testi creati dallo stesso Hasso Plattner, per sviluppare applicazioni SAP Fiori secondo gli attuali modelli di programmazione ABAP è impressionante.

Implementazione di SAPUI5 e SAP Fiori (Confronto SAP Fiori e SAP GUI)
L’introduzione di HTML5 come standard per le app basate sul web ha dato il via a una rivoluzione anche in SAP. Sebbene le specifiche ufficiali di HTML5 del World Wide Web Consortium (W3C) siano state ritardate fino alla loro adozione definitiva nel 2014, SAP è salita sul carro prima e ha lavorato su una nuova e moderna tecnologia UI su questa base. Il nome in codice di questo progetto era Phoenix. In seguito, la nuova tecnologia è diventata nota come SAPUI5 (abbreviazione di UI Development Toolkit for HTML5).

A questo punto, SAP decise che i designer dell’esperienza utente (UX) sarebbero stati coinvolti nel progetto fin dall’inizio. Fin dall’inizio, quindi, è stata posta molta enfasi su un buon design.

Uno dei primi libri sulla progettazione dell’interfaccia utente è Don’t Make Me Think. Usabilità web e mobile: The Intuitive Web di Steve Krug (mitp, 2014). Il titolo è ormai un classico in questo campo. Già quando è uscita la prima edizione di questo libro, quasi 20 anni fa, Amazon e Google avevano stabilito il punto di riferimento per il buon design. La ricetta del successo era un’usabilità semplice e intuitiva, unita a tempi di risposta brevi. Se vi approcciate alla implementazione di un’applicazione SAPUI5 nel 2012, vi renderete subito conto che SAP ha implementato molte delle raccomandazioni di Steve Krug con SAPUI5. Il principio guida di SAP era la coerenza. Hanno riconosciuto che l’implementazione coerente dell’interfaccia utente tra i controlli e le interazioni rende le app più facili da usare e meno soggette a errori. Questo si traduceva in tempi di implementazione più brevi da un lato e in minori sforzi di manutenzione dall’altro. SAP ha attribuito un valore elevato alla tipografia, ai colori e alla presentazione visiva, che si è riflesso in un alto livello di accettazione da parte degli utenti. L’attenzione di SAP per l’aspetto visivo è evidente nell’aspetto coerente dei controlli dell’interfaccia utente. Tutto sembra essere stato ricavato da un unico stampo, mentre il design degli elementi dell’interfaccia utente cattura lo spirito del tempo e ha un aspetto moderno.

In questa sezione discuteremo di come questo approccio abbia influenzato i requisiti degli sviluppatori moderni. Parleremo anche di SAP Fiori e di come interagisce con il framework SAPUI5.

Requisiti modificati per gli sviluppatori moderni (Confronto SAP Fiori e SAP GUI)
Con l’introduzione di SAPUI5, SAP ha creato le fondamenta su cui si baseranno in futuro le UI di tutti i prodotti SAP, gli sviluppi dei clienti e i miglioramenti. Tuttavia, SAPUI5 pone anche alcune nuove esigenze agli sviluppatori che in precedenza svolgevano un ruolo limitato o nullo nel contesto SAP. Nel processo di sviluppo, JavaScript, in combinazione con HTML5 e CSS3, sta diventando sempre più importante. Per creare le interfacce web, gli sviluppatori non lavorano più nell’ABAP Workbench come facevano quando sviluppavano le schermate classiche, ma con Eclipse e strumenti di sviluppo simili basati sul web. Gli sviluppatori devono quindi aggiornare le loro conoscenze di queste tecnologie e ambienti di sviluppo e, in casi estremi, imparare un linguaggio di programmazione completamente nuovo.

In molti casi, c’è una separazione dei compiti tra sviluppo backend e frontend:

Sviluppo backend: Assicura che i dati e i metadati aziendali richiesti siano esposti e forniti agli utenti tramite le interfacce di programmazione delle applicazioni (API) OData. Le viste Core Data Services (viste CDS) sono utilizzate per implementare la logica ABAP nel backend. CDS è un linguaggio specifico per il dominio (DSL), che ha lo scopo di semplificare la modellazione dell’accesso alle tabelle del database. Le viste CDS sono state rese disponibili con SAP NetWeaver 7.4.
Sviluppo del frontend: Assicura che l’interfaccia utente sia sviluppata e resa disponibile agli utenti finali. Al di fuori del mondo SAP, vengono utilizzati framework come Angular.js, Vue.js o React in combinazione con varie librerie UI. Nell’ambiente SAP si utilizza Web Dynpro for ABAP o SAPUI5.
Questa separazione delle responsabilità comporta un corrispondente sforzo di coordinamento. Un prerequisito obbligatorio è la comprensione comune delle tecnologie utilizzate. Lo sviluppatore backend deve capire come funzionano le applicazioni web e le API OData e che le vecchie tecnologie SAP, come i blocchi degli oggetti, possono causare problemi significativi nelle applicazioni web. Lo sviluppatore frontend, invece, deve capire come accedere alle API OData in modo performante e anche come è strutturato e funziona il modello di dati sottostante nel backend.

SAP ha gettato le basi per le moderne interfacce utente basate sul Web con SAPUI5 nel 2009. Con SAPUI5, SAP si è posta l’obiettivo di rendere le app disponibili su tutti i dispositivi finali, indipendentemente dal fattore di forma. SAPUI5 offre agli sviluppatori una grande libertà, con il risultato che le app di sviluppatori diversi hanno di solito un aspetto completamente diverso. Con l’introduzione di SAP Fiori, l’aspetto delle app è diventato più regolamentato.

SAP Fiori (Confronto SAP Fiori e SAP GUI)
Il design di SAP Fiori è integrato nel framework SAPUI5. Si tratta di un framework che fornisce più di 170 controlli e numerosi tipi di layout. Questo framework assicura che il layout, il comportamento dei controlli e il design visivo siano coerenti in tutte le applicazioni SAP Fiori. Tuttavia, questo da solo non garantisce una UX piacevole. Le app devono essere progettate tenendo conto dei requisiti dell’utente.

Anche se i team di sviluppo sono in grado di padroneggiare le nuove tecnologie e di implementare applicazioni basate su di esse, le aziende devono affrontare nuove sfide: Come garantire che le app offrano una UX coerente per i diversi casi d’uso? Come possiamo seguire modelli di interazione coerenti e consolidati che tengano conto dei requisiti di ciascun caso d’uso? In una grande azienda di software come SAP, questi principi e modelli devono essere applicati e implementati da innumerevoli team di sviluppo delle app che lavorano in modo distribuito a livello globale. Gli ingegneri e i designer di SAP hanno tenuto conto anche di questo aspetto.

Le linee guida per la progettazione di SAP Fiori forniscono ai team di sviluppo una linea guida su come devono essere costruite le app. Le linee guida vanno ben oltre i principi e i paradigmi generali. Forniscono indicazioni concrete su come implementare un approccio incentrato sull’utente. Spiegano non solo come applicare i vari layout e pattern, ma anche come non applicarli. Le linee guida per la progettazione di SAP Fiori forniscono il quadro generale della UX di SAP Fiori e collocano le caratteristiche tecniche in questo contesto. Vi aiutano a stabilire un collegamento tra le considerazioni di progettazione e i controlli SAPUI5 corrispondenti. A tal fine, si definisce un vocabolario comune per i team di sviluppo e progettazione che li aiuta a discutere le modifiche iterative apportate alle applicazioni. Quando tutte le parti interessate parlano la stessa lingua, è possibile aumentare l’efficienza dello sviluppo delle app.

Scrum: Nel paragrafo precedente, avete letto bene: “modifiche iterative”. Con le moderne interfacce utente basate sul web, un approccio agile chiamato Scrum ha trovato spazio anche nei progetti di sviluppo SAP. Scrum è una metodologia che implementa idee di gestione agile dei progetti. L’obiettivo è sviluppare, consegnare e sostenere prodotti complessi attraverso la collaborazione, responsabilità chiaramente definite e progressi iterativi. Scrum incoraggia il processo decisionale collaborativo e il feedback costruttivo, in modo da fornire prodotti di valore superiore. Un team di gestione del progetto Scrum è composto da tre ruoli: proprietario del prodotto, team di sviluppo e Scrum master. Questi ruoli sono progettati in modo trasversale per aumentare la flessibilità, la creatività e la produttività. I team si organizzano da soli.

L’interazione tra SAPUI5 e le linee guida di progettazione di SAP Fiori può essere illustrata utilizzando un’analogia della vita quotidiana. SAPUI5 fornisce i materiali e gli strumenti per costruire una casa. Naturalmente si potrebbe anche usare per costruire una casa al volo, ma un progetto del genere non sarebbe coordinato e il risultato sarebbe prevedibile e riproducibile solo in misura limitata. Le linee guida per la progettazione di SAP Fiori forniscono il progetto che aiuta a realizzare il progetto di costruzione in modo efficiente e standardizzato.

Adottare le linee guida di sviluppo: Si consiglia di studiare le linee guida di progettazione di SAP Fiori prima di iniziare il progetto di sviluppo e di incorporare le sezioni pertinenti nelle proprie linee guida per gli sviluppatori. Idealmente, dovrete anche definire i criteri per l’accettazione degli sviluppi basati su queste linee guida.

Modelli per i requisiti ricorrenti (Confronto SAP Fiori e SAP GUI)
Con SAPUI5 e SAP Fiori, abbiamo a disposizione gli strumenti e i modelli per realizzare app moderne in modo efficiente. Dopo aver sviluppato alcune applicazioni, ci renderemo conto che ci sono requisiti che ricorrono ripetutamente, come la visualizzazione di dati in tabelle, la manipolazione di dati in moduli o la visualizzazione di dati sotto forma di grafici. Creeremo codice di programma simile più volte. Dopo alcuni progetti, probabilmente avremo definito i nostri modelli di codice o le nostre librerie da cui copiare. Quanto sarebbe semplice e geniale, a questo punto, utilizzare i metadati per controllare che tabelle, moduli di input o grafici siano costruiti automaticamente dal framework? Si potrebbe risparmiare molto tempo nello sviluppo e anche la manutenzione delle applicazioni diventerebbe più semplice. Anche i team di sviluppo di SAP hanno avuto questa idea.

In questa sezione verranno illustrati i controlli intelligenti di SAPUI5, il modo in cui possono essere controllati utilizzando le annotazioni dell’interfaccia utente e il motivo per cui gli elementi di SAP Fiori sono stati il passo logico successivo per trasformare parzialmente SAPUI5 in un approccio di sviluppo low-code.

Controlli intelligenti (Confronto SAP Fiori e SAP GUI)
Con la versione 1.30 del framework SAPUI5 sono stati introdotti i controlli intelligenti. Questi controlli consentono di controllare la struttura e il comportamento di tabelle, moduli e grafici completamente tramite metadati, senza dover scrivere una sola riga di JavaScript. I controlli intelligenti interpretano i metadati OData a questo scopo. In alcuni casi, i controlli intelligenti mantengono la versione personalizzata dell’interfaccia utente.

Sviluppo con gli Smart Controls: In teoria, la conoscenza di JavaScript non è più necessaria per questo tipo di sviluppo. Tuttavia, si consiglia di familiarizzare con le basi di JavaScript.

Annotazioni dell’interfaccia utente
I metadati sono forniti sotto forma di annotazioni. Un’annotazione è un’informazione aggiuntiva che arricchisce un’entità o un attributo di un’entità. Le annotazioni vengono interpretate in fase di esecuzione dal framework SAPUI5 e controllano la visualizzazione dei dati. Le annotazioni possono essere fornite sia tramite l’origine dati che localmente all’interno dell’applicazione. L’origine dati è esclusivamente OData. Lo sviluppo dell’applicazione e di altre funzioni al di fuori di tabelle, moduli e grafici, che sono implementati utilizzando i controlli intelligenti, continua a essere fatto in JavaScript. Se prendiamo l’analogia della costruzione di una casa, possiamo pensare agli smart control come a un seminterrato prefabbricato, mentre il resto della casa continua a essere costruito in modo convenzionale. Nel framework SAPUI5 sono disponibili i seguenti controlli intelligenti:

• Campo intelligente, compreso l’aiuto valore
• Modulo intelligente
• Tabella intelligente, compresa la barra dei filtri intelligenti
• Grafico intelligente (ad esempio: mentre accede al modello di dati specifico dell’applicazione, l’implementazione grafica del grafico a barre è automatizzata sulla base di un modello).

SAP Fiori Elements
Il passo evolutivo successivo per semplificare il processo di sviluppo è stato SAP Fiori elements, la casa prefabbricata nella nostra analogia di costruzione di case, per così dire. Con questo framework è possibile creare le proprie app senza alcuna conoscenza di JavaScript. Il prerequisito è che i casi d’uso siano standardizzati.

Esempio di architettura di un’applicazione SAP Fiori creata con SAP Fiori elements: l’app SAP Fiori viene eseguita nel launchpad SAP Fiori. I dati da visualizzare sono ottenuti tramite un servizio OData. La configurazione dell’app sotto forma di annotazioni viene effettuata tramite una configurazione separata dell’app o tramite i metadati del servizio OData.

Il framework SAP Fiori elements fornisce piani, ovvero modelli per i tipi di app più comunemente utilizzati. Il framework fornisce i seguenti schemi:

• Rapporto elenco
• Elenco di lavoro
• Pagina degli oggetti
• Pagina di panoramica
• Pagina dell’elenco analitico

La pagina degli oggetti consente agli utenti di creare, visualizzare, modificare ed eliminare gli oggetti, nonché di salvare le bozze. È adatta sia per oggetti semplici che per oggetti più complessi e multistrato. La pagina degli oggetti offre un supporto ottimale per i diversi fattori di forma dei dispositivi finali.

SAP Fiori elements è stato progettato per accelerare in modo significativo lo sviluppo, garantendo al contempo una UX coerente in tutte le applicazioni. Il framework offre tuttavia un elevato grado di flessibilità per quanto riguarda l’uso che se ne vuole fare:

• La configurazione dell’applicazione è obbligatoria in tutti i casi.
• Le annotazioni necessarie possono essere create nel backend o all’interno dell’applicazione.
• L’applicazione può anche essere estesa utilizzando le tecnologie standard di SAP.

Ciò consente, ad esempio, di creare un’applicazione di base globale e di coprire i requisiti diversi per specifici Paesi o aree aziendali in applicazioni separate. Nella programmazione orientata agli oggetti (OOP), a questo punto si parlerebbe di ereditarietà, definendo una classe principale con attributi e metodi generici e classi figlie che implementano deviazioni e miglioramenti della classe principale.

Come sviluppatori, godrete anche di un elevato grado di flessibilità nel backend. È possibile creare annotazioni per un servizio OData direttamente nel backend. Ciò consente di controllare il comportamento e l’aspetto delle applicazioni direttamente dal backend, senza interferire con lo sviluppo frontend dell’applicazione SAP Fiori. Gli elementi SAP Fiori supportano OData V2 e V4, ma ci sono differenze e caratteristiche speciali in entrambe le versioni.

A questo punto, probabilmente vi starete chiedendo perché dovreste affidarvi a SAP Fiori elements e se l’approccio prefabbricato soddisferà davvero le vostre esigenze. A queste domande si può rispondere in modo semplice. SAP non pretende nemmeno di fornire la soluzione perfetta e unica per tutte le esigenze con gli elementi SAP Fiori. Secondo la nostra esperienza, i piani coprono circa l’80% degli scenari di sviluppo dell’interfaccia utente. SAP Fiori elements è quindi adatto a quattro applicazioni pianificate su cinque. Forse viene in mente il principio di Pareto, secondo il quale l’80% dei requisiti può essere implementato con il 20% dello sforzo, mentre il restante 20% dei requisiti richiede l’80% dello sforzo. Con gli elementi di SAP Fiori, la situazione è simile: gran parte dei requisiti saranno coperti da questo framework, con grandi vantaggi in termini di efficienza rispetto allo sviluppo manuale. Tuttavia, ci sono anche requisiti che possono essere implementati solo in misura limitata o per nulla con gli elementi SAP Fiori. Ad esempio, se si desidera visualizzare i dati nel grafico di rete, un controllo standard della libreria SAPUI5, ciò sarà possibile solo con uno sviluppo freestyle più complesso.

(fonte)

Innovaformazione, scuola informatica specialistica promuove i sistemi ERP come SAP. Nell’offerta formativa trovate formazione per utenti, analisti funzionali e sviluppatori. Trovate l’elenco QUI.

INFO: info@innovaformazione.net / tel. 3471012275 (Dario Carrassi)