As we all knows, Fiori is SAP’s new UX strategy. Fiori compliments to SAP’s strategy to be ‘The Cloud Company’. This uses the unified approach for experiencing the cloud. The main focus of the Fiori UX is on the end users, means the UI should remain consistent regardless of the platform i.e. laptop, tablet, desktop or mobile. Design thinking methodology is used to create the solutions using Fiori. Design thinking means, before actually going to development of object the design thinking should be done keeping in mind end users opinions. Here in this blog I would like to focus more on the design shift of Fiori applications. This design shift is happened with any type of web designs and graphic designs today. Skeuomorphism designs were very heavily used beforehand.
What’s skeuomorphism really?
‘Skeuomorphism’ seems very long word to pronounce..!! Right? Skeuomorphism refers to the design concept for making items represented resembles their real-world counterparts. Skeuomorphism is commonly used in many design fields, including user interface (UI) and Web design, architecture, ceramics and interior design, where much of the design has traditionally aimed to recall the real world - such as the use of folder and files images for computer filing systems, or a letter symbol for email - probably to make computers feel more familiar to users. However, this approach is increasingly being criticized for its lack of ingenuity and its failure to pioneer designs that truly harness a computer's superior capabilities, rather than forcing it to merely mimic the behavior of a physical object.
Let me show you what skeuomorphism design is exactly. Below image represents the skeuomorphism.
By having looked at it, what we understand is skeuomorphism tries to mimic the real world objects. Now we are actually moving from this kind of design. It is not that this design is bad, but there are some points which make the flat design even better than this. Below are the points:
- We actually need to invest in for lots of resources like graphic card. Graphic card should be capable to render all fine details needed for skeuomorphism.
- For rendering this design on screen, it takes too much time
- For creating this kind of representation, we actually have to invest lot of time. Because it’s not easy to create.
- Skeuomorphism relies on images rather than pure CSS.
- Main problem with skeuomorphism is that some objects are culture and locality specific. For example the phone screens representation, calendar representation, day planners, address books, camera representation dial screen of phone or clock representation.
Because of all above factors, all are trying to move away from this three dimensional design to flat design.
We can consider the latest and biggest example in recent days which shows shift from skeuomorphism to flat design is iOS 6 to iOS 7, Apple phone operating system. iOS 6 was designed with keeping in mind the skeuomorphism design. See below image which shows difference in design for iOS6 and 7.
As skeuomorphic designs are very resource-intensive, it takes time to load, also takes more battery. That is why iOS shifted to simple design.
We can also check the calculator application in newly released mobiles, which are totally following flat designs. No more 3D designs.
Image
We can say Flat design is the newest trend in web design and UI designs. For creating the flat design we have to follow some principles:
- No effects
Effects are something which demands more of the system resources, and they need better hardware to run. These effects can become distraction to users. Because of the above reason flat design does not bolster effects.
2.Simple Elements
SAP provides library of simple icon that you can use to define any activity in a very fine way. These linear icons are very much easy to use and which makes design extremely simple and intuitive. End user can understand what they see and it will not distract their minds on thinking what exactly the object is trying to mimic?
Fig. Simple Icons
You can use icons while designing the UI from below link:
https://openui5.hana.ondemand.com/iconExplorer.html
3.Typography
As we are not going to use any effects, then one questions comes in your mind is: How can we make things interesting to user then? The answer is typography. You can play with the various fonts and sizes of fonts which are simple to understand, the colors of font, spacing, positioning.
4.Use of Colors
Colors are important while designing the UI, but we have to careful while selecting the colors. We should not use gaudy colors. SAP application is best example when it comes to colors, in it very few colors are used. Try to use light colors for designing the business applications.
5. Minimalistic
You should not add many objects on the screen. The best example of minimalistic design is Google home page. It contains only one logo which uses the typography and colors and one simple input field.
Fig. Google home page
6. Attention Span
Attention span is time that it takes user to lose attention on the application. The time is very less i.e. 8 seconds. Users don’t want to dig too much for finding out information they want, so attention span should be considered while designing the UI.
A great example of flat design is Windows 8 – Microsoft was one of the first to apply flat design to its interface.
Fig. Windows 8
Keep in mind all the above principles while working on Fiori UX.
Some of the people still like the skeuomorphic design. There is still a debate going on this. According to me flat designs are better to use considering the development.
- SAP Managed Tags:
