ui innovation with sap netweaver gateway
DESCRIPTION
A sanitized version of slides presented by John Moy at the SAP Australia User Group 2012 for the presentation 'How SAP NetWeaver Gateway can deliver the User Interfaces you've always wanted'TRANSCRIPT
![Page 1: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/1.jpg)
By John Moy SAP Mentor
© September 2012
![Page 2: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/2.jpg)
Thoughts and opinions expressed here represent my own and not those of SAP
All content provided in this presentaCon is for informaConal purposes only. The author makes no representaCons as to the accuracy or completeness of any informaCon in this presentaCon. The author will not be liable for any errors or omissions in this presentaCon nor for the availability of this informaCon.
![Page 3: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/3.jpg)
R/2 Terminal Screens
R/3 SAP GUI
Web Dynpro Java,
SAP Portal
Web Dynpro ABAP, Floorplan Manager, NWBC
ITS, WebGUI, BSP, HTMLB
SAP UI5, Page Builder,
CHIPs
![Page 4: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/4.jpg)
Enterprise Systems
![Page 5: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/5.jpg)
Enterprise
Consumer
Faster user interface innovaCon cycles eg. browsers, iOS, Android etc.
Slower user interface updates, Ced to core upgrade cycles
![Page 6: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/6.jpg)
“Our basic argument is that there isn’t such a thing as a building. A building properly conceived is several layers of longevity of built components”
Frank Duffy, Architect 1994 FoundaCon
Structure
Internal W
alls
Tables, etc
![Page 7: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/7.jpg)
Enterprise Systems ExisCng
UIs, Web UIs
Mobiles & Tablets
TVs, Voice etc…
SAP NetWeaver Gateway as an enabler
![Page 8: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/8.jpg)
Edge Usage
Casual Usage
Pro Usage
ESS / MSS
NWBC / SAPGUI
Websites / Intranet
Tablets
Mobiles
Kiosks &
Other
SAP NetWeaver Gateway as an enabler
![Page 9: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/9.jpg)
Edge Usage
Casual Usage
Pro Usage
Leaders Front Office
Back Office
Field / Mobile Sales
Consumers Business Partners
NOTE: A sample indicaCve allocaCon – will vary for
each organisaCon
![Page 10: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/10.jpg)
Edge Usage
Casual Usage
Pro Usage
ZERO training expectaCon
Simple learning aids
Training
SAP NetWeaver Gateway as an enabler
![Page 11: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/11.jpg)
Edge Usage
Casual Usage
Pro Usage
Mainstream Usage
Edge Usage now is potenCally Mainsteam Usage in future
![Page 12: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/12.jpg)
SAP
1. GET hep://server/sap/myapplicaCon
“ INSIDE OUT “
2. HTML + Data 2.1. CSS 2.2. Javascript 2.3. Images 2.4. ..etc
![Page 13: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/13.jpg)
SAP
1. GET hep://server/sap/myapplicaCon/data
“ OUTSIDE IN “
3. Lightweight Data (OData)
2. NaCve App -‐ iOS -‐ Android -‐ etc. IN
STALLED
NaCve mobile app example
SAP NetWeaver Gateway as an enabler
![Page 14: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/14.jpg)
SAP
1. GET hep://server/sap/myapplicaCon
“ OUTSIDE IN “
3. Lightweight Data (OData)
2. HTML5 Layout -‐ CSS -‐ Javascript -‐ Images CA
CHED
HTML5 example using ‘single-‐page’ web apps
SAP NetWeaver Gateway as an enabler
![Page 15: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/15.jpg)
Stateful UIs Stateless UIs
SAP NetWeaver Gateway as an enabler
![Page 16: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/16.jpg)
SAP
SAP NetWeaver Gateway
Service generaCon tools (eg. Generate from RFC / BAPI without coding )
Service consumpCon libraries • Mobile plakorms • HTML5 libraries (eg. SAPUI5) • Java, PHP, Flash ..etc. • Code generaCon
![Page 17: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/17.jpg)
SAP
SAP NetWeaver Gateway
Architecture for many of SAP’s Mobile Apps
SAP Mob
ile
Plak
orm
• AuthenCcaCon & Security • Secure CommunicaCons • Device registraCon
Relay
Server
(Depending on App) • iOS • Android • Blackberry • Windows
![Page 18: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/18.jpg)
= SAP NetWeaver Gateway as an enabler
Sample list of SAP’s mobile apps (not all-‐inclusive) …
![Page 19: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/19.jpg)
![Page 20: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/20.jpg)
![Page 21: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/21.jpg)
Samples courtesy of and developed by John Paeerson (see blog on SCN
hep://bit.ly/Mh8rC4)
![Page 22: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/22.jpg)
SAP
OUTSIDE IN • Adopt latest consumer UI usability • Empower non-‐SAP UI developers
LIGHTWEIGHT DATA INTERACTION • OpCmise response Cme & usability • Support HTML5 / naCve mobile UIs
LOOSE COUPLING • Support pace layering & service re-‐use
STATELESS • Highly scalable
PRODUCTIVITY AIDS • Quickly expose and consume services
![Page 24: UI innovation with SAP NetWeaver Gateway](https://reader030.vdocuments.net/reader030/viewer/2022020115/554e5a1db4c905b2178b4ed9/html5/thumbnails/24.jpg)
SAP NetWeaver Gateway official SAP Help hep://help.sap.com/nwgateway
SAP NetWeaver Gateway plug-‐in for Eclipse hep://bit.ly/wHwy2B
Installing Trial SAP NetWeaver Gateway on Amazon Web Services (by John Moy) hep://bit.ly/N7JwR3