Skip to Content
Author's profile photo Nitin Mahajan

What in the world FIORI really is…and UI5…What’s that???

Have been asked several times over the years what is special about FIORI? What is good about SAPs venture into open UI space with UI5? I have been giving the similar answers to pretty much everyone, with a different flavor depending on their knowledge. However, i think it might be good to just sum this up

What is FIORI

A Guideline? A Trend? A Technology? an App? set of apps or just a Flower. Well Yes, it is a flower and that is why the name.

FIORI is a set of Design Principles and / or Guidelines (some even say design language that i will avoid using). These principles and guidelines derives the User Experience for designing an app. (Visit SAP Experience to learn more about it). It define do’s and don’ts of a user interaction. And for once in Capital case…It is NOT a development technology. Have had a lot many ask me, I want to develop in FIORI.

Now having said what FIORI is, SAP has gone a step ahead and implemented this User Experience in 1100+ apps available at Apps Library. All apps following these design guidelines are FIORI like apps. The apps are that are lean, are device and browser agnostic (responsive) and work “out of the box” with SAP and / or HANA DB.

FIORI is not a replacement for standard SAPGUI. Being lean the apps are built primarily for non-technical, business, executives, mobile end users, business uers. User base that is not very technical and do not need to see 200 fields when they need only 5 to approve a request, or fill a form or see a list. Day to day technical SAP users / data entry would still use SAP GUI/NWBC.

SAP has enabled a public domain to make business users fall in Love with FIORI. Get on it FIORI Trial, break it wreck it do as you please.

To enable the user experience community, there is Splash app. create a login and design some FIORI like Apps at Splash App. You can have upto 5 free projects, ask questions in community, design some apps, use existing templates to help you kick start. Good Luck!!!.

What is UI5

Well FIORI is a flower, someone had to convert that into a usable application, that is where the UI5 comes in. UI5 is what add the stem, the petals and colors to the flower but the design of the flower lies in FIORI.

UI5 is the underlined technology for application development. Has two flavors OpenUI5 and SAPUI5. See the APIs at SAPUI5 SDK and OpenUI5 SDK.

SAP is constantly building not just the APIs but also providing Pre-built, ready to use UI elements, icons, fonts, examples etc (available on same link as above).

  • 200+ UI elements with different variations that are responsive by design, are device and browser agnostic. have both compact and cozy behaviors. It is like going to a third party and paying thousands of $s to build a tool for you.
  • The ready elements saves tonnes on the development time thus reducing the time to market and cost of development and maintenance. Check Elements Explored
  • 600+ Icons in SAP Font library that can be used without having to worry about IP issues. Combine those with different colors and developers won’t have to run behind UX designers to provide icons and images
  • Icons being part of SAP font can be sized and color based on the need of the project and customer. Check Icon Explorer
  • Demo apps to help understand how things work. Demo Apps
  • Tonnes of Tutorials Developer guides help material backed by very robust and proven sap developer network community.

Now having given some gyan about the basics, do not think SAPUI5 is limited to catering to only FIORI experience or for building applications for just SAP as a backend. At the end of the day, UI5 a derived technology built on the modern frameworks. Frameworks that work. Frameworks that are based on state of the art opensources.

  • uses JQuery that we can use directly while building in SAPUI5.
  • uses CSS framework LESS.
  • uses datajs for cross browser interaction
  • uses HTML5 based browser features
  • uses oData and JSON protocols

As the common notion might be one needs SAP to use UI5, it is not the case. The technology can be used as any other opensource technology in the market. To break the notion, SAP has taken a step further. UI5 now comes in two flavors (been there for a while now); OpenUI5 and SAPUI5. Though they look like two twin sisters just that one is groomed to be more for Enterprise and another more for liberalized open source. However, they are similar in underlying principles and framework. Thus either can be used for projects.

To put in a perspective. UI5 is Modern, its cool, its trendy and can be used to build SAP or non SAP specific user interfaces and above all…its here to Stay!!!

PS: I am editing to state that Information provided might look basic and easily available to some experts in the community. This is my shot and answering the questions from businesses who are thinking of adopting UI5 and / or FIORI space and have questions on Why, What and Where FIORI fits and add values along with UI5.

Assigned Tags

      6 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Jeremy Good
      Jeremy Good

      Hi Nitin - I see you've been an SCN member for quite some time, and it sounds like you have had some interesting SAP UI5 / SAP Fiori project experiences.  I would love to see some customer or project stories as blogs and I can only imagine that the community would also enjoy them 🙂

      We haven't had any recent contributions to the #myfioristory collection in the wiki, but I would happily add your stories to the list!

      Best Regards,
      Jeremy Good

      Author's profile photo Nitin Mahajan
      Nitin Mahajan
      Blog Post Author

      Hello Jeremy, Thanks for taking time to read through. It sure has been a fairly long association with SAP UI space. Thanks for sharing the link will try to add something but have to run through the customer approval. Sort of becomes a political game trying to get approval. Will try.

      Regards,
      Nitiin

      Author's profile photo Jeremy Good
      Jeremy Good

       

      The project lessons learned and personal experiences gained can be kept anonymous and don't have to reveal the customer.  Politics and approvals don't need to get involved this way, and in all reality the abstracted learnings should be more easily applied or leveraged by fellow community members reading your story than something very customer specific.

      Author's profile photo Nitin Mahajan
      Nitin Mahajan
      Blog Post Author

      Sure, will give it a shot.

      Author's profile photo Ravindra Tanguturi
      Ravindra Tanguturi

      Hi,
      Level of information provided with is basic and primitive, would have been good blog maybe 2 years back, world has moved from flowers to garlands long back. Still good attempt and articulation!
      Regards
      Ravindra Tanguturi

      Author's profile photo Nitin Mahajan
      Nitin Mahajan
      Blog Post Author

      Hello Ravindra, you are right. This is not a technical blog. The type of information is something that we the developer community had an idea about since early 2013. We knew how good it is. Where we sinned as a developer community is worrying only about our technical space. We do not worry about what value does it bring to the businesses and how businesses can benefit from that.

      What is Basic and Primitive for you and I is gold mine for the people I meet to sell this FIORI and UI5 space. What is missing from our thousands of blogs is the why part. Why should I use UI5 or why should I implement FIORI apps? What value does FIORI brings? How is this combination of FIORI and UI5 stand out from rest that is available in market.

      I meet people including those who are closely associated with SAP functional who still do not know how good this space is. Businesses who have these questions that we developers have not answered or do not care about what they want to hear.

      This is just a shot at answering some of those questions collectively.

      Regards,
      Nitin