{"id":5334,"date":"2018-04-24T11:30:01","date_gmt":"2018-04-24T09:30:01","guid":{"rendered":"https:\/\/sii.pl\/blog\/?p=5334"},"modified":"2025-05-07T12:19:36","modified_gmt":"2025-05-07T10:19:36","slug":"srodowisko-uzytkownika-fiori","status":"publish","type":"post","link":"https:\/\/sii.pl\/blog\/srodowisko-uzytkownika-fiori\/","title":{"rendered":"\u015arodowisko u\u017cytkownika SAP Fiori"},"content":{"rendered":"\n<p>SAP Fiori to najnowsza wersja interfejsu u\u017cytkownika od SAP zapewniaj\u0105ca jednolite do\u015bwiadczenia u\u017cytkownika podczas korzystania z rozwi\u0105za\u0144 lokalnych i chmurowych.<br>Po ponad 20 latach od premiery pierwszej graficznej wersji SAP GUI dla Windows 3.1, SAP dostosowa\u0142 si\u0119 do wsp\u00f3\u0142czesnych standard\u00f3w i w ca\u0142o\u015bci przeprojektowa\u0142 nie tylko interfejs u\u017cytkownika, ale r\u00f3wnie\u017c zmieni\u0142 spos\u00f3b, w jaki u\u017cytkownik z niego korzysta.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Podstawy<\/h2>\n\n\n\n<p>Filozofia, kt\u00f3ra przy\u015bwieca\u0142a tworzeniu nowego wra\u017cenia dla u\u017cytkownika to Design Thinking \u2013 projektowanie aplikacji maj\u0105c na celu przede wszystkim jako\u015b\u0107 i komfort u\u017cytkowania aplikacji, patrz\u0105c z perspektywy u\u017cytkownika biznesowego. Ta zmiana w podej\u015bciu do procesu tworzenia rozwi\u0105za\u0144 powoduje, \u017ce u\u017cytkownik otrzymuje sp\u00f3jne, responsywne i intuicyjne \u015brodowisko do wykonywania codziennych zada\u0144. Poprzez przej\u015bcie na interfejs wy\u015bwietlany w przegl\u0105darce i zastosowanie adaptacyjnego interfejsu u\u017cytkownika otrzymujemy swobodny dost\u0119p do danych bez wzgl\u0119du na zastosowane urz\u0105dzenie.<br>Podstawowe filary projektowania, na kt\u00f3rych opiera si\u0119 nowa filozofia interfejsu u\u017cytkownika (UI) to:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Oparty na rolach (Role-based) \u2013 w zale\u017cno\u015bci od kontekstu u\u017cytkownika i jego obowi\u0105zk\u00f3w, ka\u017cdy u\u017cytkownik otrzymuje spersonalizowane \u015brodowisko dostosowane do jego potrzeb.<br>Przyk\u0142adowy widok dla handlowca:<\/li><\/ul>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-handlowiec-e1524213881565-1.png\"><img decoding=\"async\" width=\"840\" height=\"428\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-handlowiec-e1524213881565-1.png\" alt=\"fiori kokpit sprzedawcy\" class=\"wp-image-19025\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-handlowiec-e1524213881565-1.png 840w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-handlowiec-e1524213881565-1-300x153.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-handlowiec-e1524213881565-1-768x391.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>Zawiera najwa\u017cniejsze informacje z jego perspektywy i jest zupe\u0142nie odmienny ni\u017c na przyk\u0142ad ekran analityka finansowego:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-analityka-finansowego-e1524213873355-1.png\"><img decoding=\"async\" width=\"840\" height=\"330\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-analityka-finansowego-e1524213873355-1.png\" alt=\"fiori widok ksiegowego\" class=\"wp-image-19023\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-analityka-finansowego-e1524213873355-1.png 840w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-analityka-finansowego-e1524213873355-1-300x118.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-widok-analityka-finansowego-e1524213873355-1-768x302.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><\/figure><\/div>\n\n\n\n<div style=\"height:10px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<ul class=\"wp-block-list\"><li>Wspania\u0142e, czaruj\u0105ce (delightful) \u2013 poniewa\u017c to UI tak naprawd\u0119 jest odpowiedzialny za interakcj\u0119 z u\u017cytkownikiem, to by\u0107 jak najbardziej przyjemny i komfortowy w czasie pracy.<\/li><li>Sp\u00f3jne (coherent) \u2013 niezale\u017cnie od roli i wykonywanych zada\u0144, mamy do czynienia z jednym \u201ej\u0119zykiem designu\u201d. To co wydaje si\u0119 teraz oczywiste, w przypadku wcze\u015bniejszego GUI nie do ko\u0144ca mia\u0142o miejsce.<\/li><li>Proste (simple)&nbsp;\u2013 z punktu widzenia osoby pracuj\u0105cej z systemem, tutaj wida\u0107 jedn\u0105 z najwi\u0119kszych zmian. Koniec z dziesi\u0105tkami zak\u0142adek, setkami p\u00f3l i chaosem na ekranie. Koncentrujemy si\u0119 na tym, co najwa\u017cniejsze.<\/li><li>Responsywne (adaptive)\u2013 niezale\u017cnie od urz\u0105dzenia i miejsca, umo\u017cliwia prac\u0119 z podobnym, sp\u00f3jnym \u015brodowiskiem.<\/li><\/ul>\n\n\n\n<p>Technicznie nowy interfejs opiera si\u0119 na bibliotece SAPUI5. Umo\u017cliwia ona budowanie produkcyjnych aplikacji internetowych przy u\u017cyciu HTML5. Biblioteka wspiera \u0142\u0105czenie danych z wieloma modelami (JSON, XML i OData). R\u00f3wnolegle SAP rozwija otwart\u0105 wersj\u0119 OpenUI5 dost\u0119pn\u0105 do darmowego u\u017cytku.<\/p>\n\n\n\n<p>W zwi\u0105zku z faktem, \u017ce Fiori jest nowym domy\u015blnym interfejsem u\u017cytkownika dla systemu S\/4 HANA nie ka\u017cdy wie, \u017ce mo\u017ce zosta\u0107 uruchomiony r\u00f3wnie\u017c w starszych wersjach tego systemu, zaczynaj\u0105c od wersji SAP NetWeaver 7.31 SPS 5.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Konfiguracja<\/strong><\/h2>\n\n\n\n<p>Ze wzgl\u0119du na drobne r\u00f3\u017cnice w konfiguracji w zale\u017cno\u015bci od systemu, postaram skupi\u0107 si\u0119 na g\u0142\u00f3wnych krokach prowadz\u0105cych do udanego uruchomienia Fiori Launchpada (FLP).<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Wyb\u00f3r architektury systemowej (Frontend server deployment options).<\/li><\/ol>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-architektura-e1524213854636-1.png\"><img decoding=\"async\" width=\"840\" height=\"245\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-architektura-e1524213854636-1.png\" alt=\"fiori implementacja\" class=\"wp-image-19019\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-architektura-e1524213854636-1.png 840w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-architektura-e1524213854636-1-300x88.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-architektura-e1524213854636-1-768x224.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>Scenariuszem zalecanym do zastosowa\u0144 produkcyjnych przez SAP jest wdro\u017cenie Fiori w modelu Central Hub. Scenariusz ten obejmuje uruchomienie SAP Gateway na osobnej maszynie. Opr\u00f3cz zwi\u0119kszonej elastyczno\u015bci i skalowalno\u015bci, rozwi\u0105zanie ma r\u00f3wnie\u017c wad\u0119 polegaj\u0105c\u0105 na konieczno\u015bci utrzymywania dodatkowego systemu. Do cel\u00f3w testowych i niekt\u00f3rych produkcyjnych mo\u017cna u\u017cywa\u0107 scenariusza Embedded, w kt\u00f3rym to Gateway jest uruchomiony na jednej maszynie z SAP Business Suite.<\/p>\n\n\n\n<ol class=\"wp-block-list\" start=\"2\"><li>Instalacja komponent\u00f3w.<\/li><\/ol>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-wymagania-e1524213889148-1.png\"><img decoding=\"async\" width=\"840\" height=\"276\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-wymagania-e1524213889148-1.png\" alt=\"fiori wymagania\" class=\"wp-image-19027\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-wymagania-e1524213889148-1.png 840w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-wymagania-e1524213889148-1-300x99.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-wymagania-e1524213889148-1-768x252.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>W przypadku kiedy dysponujemy systemem SAP NetWeaver w wersji 7.40 lub wy\u017cszej, NW Gateway jest jego integraln\u0105 cz\u0119\u015bci\u0105. W ni\u017cszych wersjach w celu uruchomienia Fiori i Gatewaya nale\u017cy zainstalowa\u0107 nast\u0119puj\u0105ce sk\u0142adniki: GW_CORE, IW_BEP, IW_FND.<\/p>\n\n\n\n<ol class=\"wp-block-list\" start=\"3\"><li>Konfiguracja Fiori przy u\u017cyciu Listy zada\u0144:<\/li><\/ol>\n\n\n\n<p>W celu u\u0142atwienia konfiguracji SAP opracowa\u0142 listy zada\u0144 administracyjnych potrzebnych do uruchomienia. Lista mo\u017ce r\u00f3\u017cni\u0107 si\u0119 w zale\u017cno\u015bci od wybranej architektury systemowej, jak r\u00f3wnie\u017c wersji systemu.<\/p>\n\n\n\n<ol class=\"wp-block-list\" start=\"4\"><li>Uruchomienie Fiori Launchpad.<\/li><\/ol>\n\n\n\n<p>Pomy\u015blne zrealizowanie powy\u017cszych zada\u0144 powinno skutkowa\u0107 dzia\u0142aj\u0105cym FLP. W zale\u017cno\u015bci od systemu SAP mo\u017cemy uruchomi\u0107 Fiori Launchpad korzystaj\u0105c z transakcji \/UI2\/FLP lub uruchamiaj\u0105c w przegl\u0105darce nast\u0119puj\u0105cy URL:<\/p>\n\n\n\n<p><strong>http:\/\/&lt;host>.&lt;domena>:&lt;port>\/sap\/bc\/ui5_ui5\/ui2\/ushell\/shells\/abap\/Fiorilaunchpad.html?sap-client=&lt;client>&amp;sap-language=EN<\/strong><\/p>\n\n\n\n<ol class=\"wp-block-list\" start=\"5\"><li>Pierwsze rozczarowanie.<\/li><\/ol>\n\n\n\n<p>Osoby spodziewaj\u0105ce si\u0119 ciesz\u0105cych oko kafelk\u00f3w musz\u0119 w tym momencie rozczarowa\u0107. Domy\u015blnie skonfigurowany Launchpad wygl\u0105da tak:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-full\"><a href=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-poczatkowy-e1524213864841-1.png\"><img decoding=\"async\" width=\"840\" height=\"374\" src=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-poczatkowy-e1524213864841-1.png\" alt=\"fiori widok pocz\u0105tkowy\" class=\"wp-image-19021\" srcset=\"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-poczatkowy-e1524213864841-1.png 840w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-poczatkowy-e1524213864841-1-300x134.png 300w, https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/Fiori-poczatkowy-e1524213864841-1-768x342.png 768w\" sizes=\"(max-width: 840px) 100vw, 840px\" \/><\/a><\/figure><\/div>\n\n\n\n<p>Jak doda\u0107 pierwsze kafelki, co to s\u0105 Fiori Waves i gdzie mo\u017cemy znale\u017a\u0107 nowe aplikacje wyja\u015bnimy w kolejnym wpisie.<\/p>\n\n\n\n<p>Chcesz dowiedzie\u0107 si\u0119&nbsp;<a href=\"https:\/\/sii.pl\/oferta\/sap\/\">wi\u0119cej o ofercie Sii<\/a>&nbsp;w obszarze oprogramowania SAP dla przedsi\u0119biorstw?&nbsp;<a href=\"https:\/\/sii.pl\/kontakt\/\">Skontaktuj si\u0119 z nami<\/a>&nbsp;i poznaj korzy\u015bci p\u0142yn\u0105ce z wdro\u017cenia nowoczesnych rozwi\u0105za\u0144 dla biznesu w Twojej firmie.<\/p>\n\n\n<div class=\"kk-star-ratings kksr-auto kksr-align-left kksr-valign-bottom\"\n    data-payload='{&quot;align&quot;:&quot;left&quot;,&quot;id&quot;:&quot;5334&quot;,&quot;slug&quot;:&quot;default&quot;,&quot;valign&quot;:&quot;bottom&quot;,&quot;ignore&quot;:&quot;&quot;,&quot;reference&quot;:&quot;auto&quot;,&quot;class&quot;:&quot;&quot;,&quot;count&quot;:&quot;13&quot;,&quot;legendonly&quot;:&quot;&quot;,&quot;readonly&quot;:&quot;&quot;,&quot;score&quot;:&quot;4.8&quot;,&quot;starsonly&quot;:&quot;&quot;,&quot;best&quot;:&quot;5&quot;,&quot;gap&quot;:&quot;11&quot;,&quot;greet&quot;:&quot;&quot;,&quot;legend&quot;:&quot;4.8\\\/5 ( votes: 13)&quot;,&quot;size&quot;:&quot;18&quot;,&quot;title&quot;:&quot;\u015arodowisko u\u017cytkownika SAP Fiori&quot;,&quot;width&quot;:&quot;133.7&quot;,&quot;_legend&quot;:&quot;{score}\\\/{best} ( {votes}: {count})&quot;,&quot;font_factor&quot;:&quot;1.25&quot;}'>\n            \n<div class=\"kksr-stars\">\n    \n<div class=\"kksr-stars-inactive\">\n            <div class=\"kksr-star\" data-star=\"1\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"2\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"3\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"4\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" data-star=\"5\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n    <\/div>\n    \n<div class=\"kksr-stars-active\" style=\"width: 133.7px;\">\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n            <div class=\"kksr-star\" style=\"padding-right: 11px\">\n            \n\n<div class=\"kksr-icon\" style=\"width: 18px; height: 18px;\"><\/div>\n        <\/div>\n    <\/div>\n<\/div>\n                \n\n<div class=\"kksr-legend\" style=\"font-size: 14.4px;\">\n            4.8\/5 ( votes: 13)    <\/div>\n    <\/div>\n","protected":false},"excerpt":{"rendered":"<p>SAP Fiori to najnowsza wersja interfejsu u\u017cytkownika od SAP zapewniaj\u0105ca jednolite do\u015bwiadczenia u\u017cytkownika podczas korzystania z rozwi\u0105za\u0144 lokalnych i chmurowych.Po &hellip; <a class=\"continued-btn\" href=\"https:\/\/sii.pl\/blog\/srodowisko-uzytkownika-fiori\/\">Continued<\/a><\/p>\n","protected":false},"author":157,"featured_media":15253,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_editorskit_title_hidden":false,"_editorskit_reading_time":0,"_editorskit_is_block_options_detached":false,"_editorskit_block_options_position":"{}","inline_featured_image":false,"footnotes":""},"categories":[1316],"tags":[548,551,702,550],"class_list":["post-5334","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-development-na-miekko","tag-sap","tag-konfiguracja","tag-sap-fiori","tag-ui"],"acf":[],"aioseo_notices":[],"republish_history":[],"featured_media_url":"https:\/\/sii.pl\/blog\/wp-content\/uploads\/2018\/04\/unnamed-file.jpg","category_names":["Development na mi\u0119kko"],"_links":{"self":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/5334"}],"collection":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/users\/157"}],"replies":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/comments?post=5334"}],"version-history":[{"count":2,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/5334\/revisions"}],"predecessor-version":[{"id":19029,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/posts\/5334\/revisions\/19029"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media\/15253"}],"wp:attachment":[{"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/media?parent=5334"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/categories?post=5334"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sii.pl\/blog\/wp-json\/wp\/v2\/tags?post=5334"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}