It’s easy to adopt SAP Fiori and integrate onto your existing SAP landscape. Speed up SAP Fiori adoption and ensure a successful implementation – Enjoy a whole new user experience that is personalized, responsive, and simple and achieve a faster time-to-value This blog emphasizes on how SAP Fiori can simplify the lives of business users and IT staff and how to improve productivity. Here are 6 simple steps that allows you to kick start your SAP Fiori journey.
The existing standard SAP Fiori apps are not created just like any other native apps, the user experience designers have followed a certain design principles and guidelines to make it a successful UX product. So, as a developer you have to concentrate on this part primarily and stick fast to the responsive design that allows users to experience the apps across all device types irrespective of its screen size. You can study the contents from this website SAP Fiori Design Guidelines. These guidelines provide you an overview of basics of Fiori, different types of templates used, design patterns and user interface (UI) elements and controls. SAP Fiori Implementation and Development, When you understand these concepts, you can start designing Fiori apps on your own by downloading design stencils and SAP icon fonts
Now you know what UI elements and controls are used to develop SAP Fiori apps. SAP Fiori applications are built with SAPUI5 controls using “sap.m” and “sap.ui.layout” libraries. The only difference is SAP Fiori apps follow consistent design patterns and assure high level of quality. You can learn about this library at sap.m library. As a developer, SAP Fiori Implementation and Development you have to know few coding techniques to customize your app according to the end user needs. There are 4 important technical concepts you will need to focus on to develop SAP Fiori apps. Here is the list
Before you start developing your own SAP Fiori apps, it is always better to study the existing ones. Go to the link Fiori app library. Here, you can see more than 900+ SAP Fiori standard apps along with the app details. These apps are separated based on the application types – Transactional, Analytical, Factsheet, Web Dynpro and Design Studio Study each and every app – Try to Understand the Fiori app design with the screenshot provided and also see what components are required to deploy the app to launchpad. You can also refer to the ready-to-use templates available with SAP Web IDE which gives you complete picture on
Study each and every app – Try to Understand the Fiori app design with the screenshot provided and also see what components are required to deploy the app to launchpad. You can also refer to the ready-to-use templates available with SAP Web IDE which gives you complete picture on master-detail app, full-screen view app and other types used in Fiori.
Try to understand standard Fiori app code and use it if required. You can download the standard sap Fiori app code from SAP GUI and save it to your local system. Open the downloaded app and look how Fiori developers have coded without violating the design principles. You maynot understand some code, but don’t be worried, its just a start and you will understand it sooner when you code it either the same way or choose to another way
The best way to learn is practising. When you can understand how the Fiori apps are structured, you have to focus on deploying the standard Fiori apps to SAP Fiori Launchpad. To do this, you have to
learn the following topics in detail:
Once you have learned how to deploy standard Fiori apps, you can now jump on to developing custom Fiori apps. You can develop custom Fiori apps by using the developing environment Eclipse IDE or SAP Web IDE.
With Eclipse IDE, you can develop your custom app by importing the downloaded standard code and make changes as per end user’s requirements. You can run the app on web browser and see if changes are reflected just like UI5 application. Once you are done with changes, you can deploy the customized Fiori app to the launchpad.
Use this link and follow the steps to deploy the Fiori app – How to deploy UI5 app/customized Fiori app to launchpad?
SAP Web IDE provides you with standard ready-to-use templates which reduces your work in designing the app from the scratch. With SAP Web IDE, you can also import the app from ABAP repository or local system and make changes using layout editor or code editor. You can preview the app and deploy it. Refer to this video an Creating and customizing an SAP Fiori app.
I suggest you to use SAP Web IDE instead of eclipse IDE, because SAP Web IDE has lot of things like ready-to-use templates and mock data in it. To a starter, this would be a comfortable environment to get a good practice in implementation and deployment of Fiori application.
When you are developing apps, you must also know some troubleshooting techniques to face the challenges during development and bring the output. If you are using “Google chrome” as web browser, then you can use the “Developer Tools” or “Ctrl+Shift+I” to know where the issue persists exactly. Go to the console tab to see the logs displayed when the app is running and if the app stops somewhere, the log displays the error message. With this, you can identify what is missing in coding and you can edit the app later. If the error is related to gateway, you can check in SAP GUI. Open the t-code /n/IWFND/ERROR_LOG and check the “Error log” screen and try to rectify it.
To learn all the techniques related to troubleshooting SAP Fiori Apps, refer to this link Troubleshooting SAP Fiori Apps.
After reading through the above steps, you will get an overview on SAP Fiori and how enterprises leverage Fiori to achieve maximum benefit out of it. I hope the above article helps you to connect. You can also learn about the configuration steps in Fiori Launchpad here, this will help you to add or manage groups, catalogs, maintain specific tiles for your users.
Feel free to follow up or raise any doubts regarding SAP Fiori functional or technical aspects. You can also read more about Mobolutions, SAP Partner, at https://www.mobolutions.com/ where we specialize in Fiori implementation and deployment of standard and custom Fiori apps. You can also connect with us on LinkedIn