Iconography in SAP UI5

Discussion Forum Design & UX Iconography in SAP UI5
Viewing 6 posts - 1 through 6 (of 6 total)

Icons_SAP

Icons play a vibrant role in deciding the aesthetic part of the design.

A Great set of icons , do :

  • Improves the user experience by
  • Making the user, grasp the content of any particular module or page or UI Element Quicker and easier.
  • Reduces the cognitive load in any particular page and makes the content more intuitive.

The Icon sets in SAP UI5 , needs to be revisited above all the other improvements and enhancements in the fiori or UI5 versions.

Suggestions for new sets of icons :

 

The Icons can have three categories.

To use three different style of same icon , the user can be advised to install three different font file.

  • Stroke Icons
  • Filled Icons
  • Simple Icons ( Existing )

Why we need these icons ? 

Icons we have currently are not intuitively crafted to the accurate geometric points.

For Example, Consider two different Icons just for comparison

Lets say, cart and location

size 12 of cart icon,  is equal to size -14 of the any other icon. The icons of same font sizes are not properly falling into same pixels.

(40X40) or (50×50) and so on. Every typeface is of different pixels. That makes the design and the alignment of any SAP UI5 Application a little crappy.

This is one major thing that has to be improved when visual design as well is concerned, which improves the user experience indirectly.

Give your thoughts on the same.

Visual Designer
SAP SE

Hi Prabhakaran Palanisamy,

 

We are absolutely delighted to hear your feedback on the icons because ALL of your concerns are reflected also by ourselves. In the past the icon font was a collection of requests from many applications with many people adding to the list. However the Sap icon font has now been redesigned with a lot of your concerns already in mind.

We have redesigned each and every icon with the help and feedback of the design teams and the visual designers for UI5 framework.

The icons will now be displayed in a lighter style and all of them are created with pixel perfect detail using a simple geometric grid system as you have also commented on.
The grid system allows us to ensure accuracy and consistent alignment.

In regards to several icon styles.

I really like the idea of having several styles of icons. In some use-cases it is necessary to load both a filled and stroke style in the same UI so this is something we should think more in detail about for the future of the icons.

Flexibility to use other icon sets or create your own.

SAP UI5 also gives more freedom with the ability to replace the existing icons with different sets or even custom icons that you could create and maintain yourself.
You can read more about custom icons on the UI5 open source developer guide page here:

https://sapui5.netweaver.ondemand.com/sdk/#docs/guide/21ea0ea94614480d9a910b2e93431291.html

 

Kindest Regards

Gerry

Hi Jerry,

Happy to read your quick reply and thoughts on this !

I am so glad that SAP’s user experience and the visual design aspects are improving gradually. I am absolutely looking forward to see the next set of versions of icons. to make the design more simple and intuitive. Also, thanks for ‘Flexibility to use other icon sets or create your own’ part. I like the concept of customization, but as a UXDesigner and a user, in order to strive for consistency through out all the SAPUI5/fiori applications. It would be great if we see the future of icons in few months from here.

 

Best Regards,

Prabha

Visual Designer
SAP SE

You are very welcome Prabha,

The icon redesign is evolving and being improved with each release based on user testing and feedback like yours. The new style appears in the next UI5 releases so you do not have to wait long.

All the very best and thanks again.

Kindest regards

Gerry

 

That sounds Great ! Happy to hear that !

 

Thank a lot Gerry 🙂

 

Best Regards,

Prabha

Iconography is a very pleasant way to guide your user about your site functionality and content. It should be simple and recognized at first place.

I have read a stunning article about Iconography. This is the proper guide about Do’s and Don’ts about Iconography. Here is the guide

https://uxtitan.com/the-dos-and-donts-of-iconography-in-digital-design/

Viewing 6 posts - 1 through 6 (of 6 total)
 

You must be logged in to reply to this topic.