{"id":55308,"date":"2019-01-23T08:00:12","date_gmt":"2019-01-23T07:00:12","guid":{"rendered":"https:\/\/e3magpmp.greatsolution.dev\/?p=55308"},"modified":"2022-05-01T10:33:13","modified_gmt":"2022-05-01T08:33:13","slug":"sap-build-und-web-ide-zwei-wege-nach-fiori","status":"publish","type":"post","link":"https:\/\/e3magpmp.greatsolution.dev\/de\/sap-build-und-web-ide-zwei-wege-nach-fiori\/","title":{"rendered":"SAP Build und Web IDE &#8211; Zwei Wege nach Fiori"},"content":{"rendered":"<p>Fiori ist in erster Linie ein User-Expe\u00adrience-Konzept. Fiori-Apps werden haupts\u00e4chlich mit SAP UI5 implementiert und sind darum nicht nur f\u00fcr S\/4-Hana-Kunden interessant.<\/p>\n<p>Viele Fiori-Apps stehen f\u00fcr die Business Suite bereit oder k\u00f6nnen f\u00fcr diese entwickelt werden. Dies ist f\u00fcr SAP-Kunden von gro\u00dfer Bedeutung, die Anwendungen anpassen, entwickeln oder andere Produkte einsetzen.<\/p><div class=\"great-fullsize-content-es\" style=\"margin-left: auto;margin-right: auto;text-align: center;\" id=\"great-2531083476\"><a href=\"https:\/\/e3magpmp.greatsolution.dev\/es\/kit-de-medios\/\" target=\"_blank\" aria-label=\"nl_werbung_800x100_es\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es.jpg\" alt=\"\"  srcset=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es.jpg 800w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-400x50.jpg 400w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-768x96.jpg 768w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-100x13.jpg 100w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-480x60.jpg 480w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-640x80.jpg 640w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-720x90.jpg 720w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-18x2.jpg 18w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100_es-600x75.jpg 600w\" sizes=\"(max-width: 800px) 100vw, 800px\" width=\"1000\" height=\"100\"   \/><\/a><\/div><div class=\"great-fullsize-content-en\" id=\"great-369099414\"><a href=\"https:\/\/e3magpmp.greatsolution.dev\/en\/media-kit\/\" target=\"_blank\" aria-label=\"nl_werbung_800x100\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100.jpg\" alt=\"\"  srcset=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100.jpg 800w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-400x50.jpg 400w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-768x96.jpg 768w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-100x13.jpg 100w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-480x60.jpg 480w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-640x80.jpg 640w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-720x90.jpg 720w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-18x2.jpg 18w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2024\/08\/nl_werbung_800x100-600x75.jpg 600w\" sizes=\"(max-width: 800px) 100vw, 800px\" width=\"1000\" height=\"100\"   \/><\/a><\/div><div class=\"great-fullsize-content-de\" style=\"margin-bottom: 20px;margin-left: auto;margin-right: auto;text-align: center;\" id=\"great-1136192474\"><a href=\"https:\/\/e3magpmp.greatsolution.dev\/steampunk-summit\/\" target=\"_blank\" aria-label=\"steampunk_2024_1_800x100\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-scaled.jpg\" alt=\"\"  srcset=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-scaled.jpg 1920w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-400x50.jpg 400w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-1200x150.jpg 1200w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-768x96.jpg 768w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-100x13.jpg 100w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-480x60.jpg 480w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-640x80.jpg 640w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-720x90.jpg 720w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-960x120.jpg 960w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-1168x146.jpg 1168w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-1440x180.jpg 1440w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-1536x192.jpg 1536w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-18x2.jpg 18w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2023\/12\/steampunk_2024_1_800x100-600x75.jpg 600w\" sizes=\"(max-width: 1920px) 100vw, 1920px\" width=\"2560\" height=\"320\"   \/><\/a><\/div>\n<p>Damit es keinen Bruch in der UX f\u00fcr den Benutzer gibt, wenn er zu Fiori wechselt, sollten neue Apps die Fiori- UX-Richtlinien befolgen. Somit stellt sich die Frage: Wie kann die Fiori UX eingef\u00fchrt werden, damit Anwendungen heute schon zukunftssicher aufgestellt sind?<\/p>\n<p>Bei der Realisierung von Fiori-Projekten kommt der designgetriebene Entwicklungsprozess zur Anwendung. Die von SAP bereitgestellten Werkzeuge sind Build und Web IDE.<\/p>\n<h3><img loading=\"lazy\" decoding=\"async\" title=\"Sap build und web ide &#8211; zwei wege nach fiori\" class=\"aligncenter size-full wp-image-55309\" src=\"http:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann.jpg\" alt=\"tobias-hofmann\" width=\"800\" height=\"800\" srcset=\"https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann.jpg 800w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-150x150.jpg 150w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-768x768.jpg 768w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-100x100.jpg 100w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-480x480.jpg 480w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-640x640.jpg 640w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-720x720.jpg 720w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-24x24.jpg 24w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-48x48.jpg 48w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-96x96.jpg 96w, https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/tobias-hofmann-300x300.jpg 300w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/h3>\n<h3>Prototypen erstellen mit SAP Build<\/h3>\n<p>Beim Prototyp wird durch das Einf\u00fcgen von Skizzen eine erste Evaluierung der darzustellenden Informationen erreicht. Speziell in Workshops kann so das Ergebnis maximiert werden. Bei einem detaillierten Prototyp werden die Seiten mit UI5-Elementen erstellt.<\/p>\n<p>Dabei sind keine speziellen UI5- Kenntnisse notwendig, da die Elemente \u00fcber Drag-&amp;-drop verwaltet werden. Der Prototyp kann in Excel erstellte Testdaten verwenden. F\u00fcr die Validierung k\u00f6nnen Studien angelegt und von ausgew\u00e4hlten Benutzern getestet werden.<\/p>\n<p>Statt den in der Designphase erstellten Prototyp zu verwerfen, kann der komplette Prototyp in die Web IDE importiert werden und dient direkt als fundierte Grundlage f\u00fcr die weitere Entwicklung. Nebenbei wird auf diese Weise automatisch sichergestellt, dass die App in UI5 realisiert werden kann.<\/p>\n<p>SAP Build ist f\u00fcr Fiori-Apps und somit UI5 ausgelegt. Folgerichtig wird das Design mit anderen Technologien nicht angeboten. Die in der Fiori App Library aufgelisteten Apps sind leider nicht als Vorlagen verf\u00fcgbar.<\/p>\n<h3>UI5-Apps entwickeln mit der SAP Web IDE<\/h3>\n<p>Die Web IDE wird f\u00fcr die Fortf\u00fchrung des Prototyps hin zur App eingesetzt. Nach dem Import sind noch wichtige Anpassungen wie die Anbindung des Back-Ends vorzunehmen.<\/p>\n<p>F\u00fcr die Fiori-Entwicklung in S\/4 Hana gibt es die M\u00f6glichkeit, Fiori Elements zu verwenden. Die Web IDE bietet die Funktionalit\u00e4t, \u00fcber Extension Points Standard Fiori-Apps zu erweitern.<\/p>\n<p>Viele Empfehlungen f\u00fcr die UI5-Entwicklung sind integriert: Validierung der Syntax, Simulieren von Back-End-Diensten, Git oder die Vorbereitung f\u00fcr den produktiven Einsatz.<\/p>\n<p>F\u00fcr neue Entwickler stellt die Web IDE auch einen UI Editor bereit, \u00fcber den eine Seite mit Drag-&amp;-drop von UI-Elementen erstellt werden kann. Erfahrene Entwickler werden eher direkt mit dem Quellcode arbeiten. Mit der Bereitstellung in der produktiven Umgebung endet der designgetriebene Entwicklungsprozess nicht.<\/p>\n<p>Die bereitgestellte Version ist der Startpunkt f\u00fcr den n\u00e4chsten Prototyp. Hier ist speziell der Fachbereich gefragt, die Anwendung nicht als einmaliges Projekt zu sehen.<\/p>\n<h3>Fazit<\/h3>\n<p>Fiori hilft, viele Probleme, die bei der Verwendung der klassischen SAP-Transaktionen aufkommen, zu vermeiden. Gleichzeitig stellt dies Kunden vor Fragen, was ihre eigenen Anwendungen angeht.<\/p>\n<p>Mit Build und Web IDE stellt SAP zwei Werkzeuge bereit, die bei der Entwicklung helfen. Durch die Verzahnung mit dem designgetriebenen Entwicklungsprozess er\u00f6ffnen beide neue M\u00f6glichkeiten, effektiv und effizient Fiori-Apps zu erstellen.<\/p>\n<p>Sie bieten einen Mehrwert, aber ebenso braucht es die richtigen Leute, um diesen auch nutzen zu k\u00f6nnen. Ein Designer wird mit Build Fiori-Apps erstellen k\u00f6nnen, aber es wird auch ein erfahrener UI5-Entwickler f\u00fcr die Realisierung ben\u00f6tigt.<\/p>\n<p>Da der Fokus auf Fiori liegt, ist die Verwendung mehrerer Tools absehbar. Mit SAP Screen Personas k\u00f6nnen Transaktionen gem\u00e4\u00df den Fiori-Konzepten angepasst werden. Eine Integration von SAP Build und Web IDE f\u00fcr die Flavor-Erstellung w\u00e4re w\u00fcnschenswert.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>SAP pr\u00e4sentierte 2013 auf der Sapphire Now 25 Anwendungen, die eine neue User Experience einleiten sollten: Fiori. Dies ist eine Abkehr von den bew\u00e4hrten Transaktionen. SAP-Kunden stehen vor der Herausforderung, wie die Fiori UX f\u00fcr eigene Anwendungen eingesetzt werden kann.<\/p>\n","protected":false},"author":1623,"featured_media":55315,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_lock_modified_date":false,"footnotes":""},"categories":[5,26129],"tags":[1507,19701,1392,8603],"coauthors":[26691],"class_list":["post-55308","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-infrastruktur","category-mag-1811","tag-fiori","tag-s-4-hana","tag-sap-ui5","tag-ui5"],"featured_image_urls_v2":{"full":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"thumbnail":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-150x150.jpg",150,150,true],"medium":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",400,180,false],"medium_large":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-768x346.jpg",768,346,true],"large":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"image-100":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-100x45.jpg",100,45,true],"image-480":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-480x216.jpg",480,216,true],"image-640":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-640x288.jpg",640,288,true],"image-720":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-720x324.jpg",720,324,true],"image-960":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-960x432.jpg",960,432,true],"image-1168":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"image-1440":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"image-1920":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"1536x1536":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"2048x2048":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"trp-custom-language-flag":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",18,8,false],"bricks_large_16x9":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"bricks_large":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"bricks_large_square":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",1000,450,false],"bricks_medium":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",600,270,false],"bricks_medium_square":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601.jpg",600,270,false],"profile_24":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-24x24.jpg",24,24,true],"profile_48":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-48x48.jpg",48,48,true],"profile_96":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-96x96.jpg",96,96,true],"profile_150":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-150x150.jpg",150,150,true],"profile_300":["https:\/\/e3magpmp.greatsolution.dev\/wp-content\/uploads\/2018\/10\/shutterstock_1051585601-300x300.jpg",300,300,true]},"post_excerpt_stackable_v2":"<p>SAP pr\u00e4sentierte 2013 auf der Sapphire Now 25 Anwendungen, die eine neue User Experience einleiten sollten: Fiori. Dies ist eine Abkehr von den bew\u00e4hrten Transaktionen. SAP-Kunden stehen vor der Herausforderung, wie die Fiori UX f\u00fcr eigene Anwendungen eingesetzt werden kann.<\/p>\n","category_list_v2":"<a href=\"https:\/\/e3magpmp.greatsolution.dev\/de\/category\/infrastruktur\/\" rel=\"category tag\">IT Management<\/a>, <a href=\"https:\/\/e3magpmp.greatsolution.dev\/de\/category\/mag-1811\/\" rel=\"category tag\">MAG 18-11<\/a>","author_info_v2":{"name":"Tobias Hofmann, BridgingIT","url":"https:\/\/e3magpmp.greatsolution.dev\/de\/author\/tobias-hofmann\/"},"comments_num_v2":"0 comments","acf":[],"_links":{"self":[{"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/posts\/55308","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/users\/1623"}],"replies":[{"embeddable":true,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/comments?post=55308"}],"version-history":[{"count":0,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/posts\/55308\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/media\/55315"}],"wp:attachment":[{"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/media?parent=55308"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/categories?post=55308"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/tags?post=55308"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/e3magpmp.greatsolution.dev\/de\/wp-json\/wp\/v2\/coauthors?post=55308"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}