Once the SAP Analytics Cloud has been technically implemented, users trained, and the first stories created, it often becomes apparent that a consistent design language is missing within the stories. Not every user has a keen eye for the design of a story. But even if basic guidelines are followed, it is often difficult to maintain a consistent concept across many stories with different creators. The severity of the differences can generally be categorised into four scenarios.
Scenario |
User behaviour |
Result |
No specification |
Users create stories according to their own preferences |
|
Corporate identity |
Users try to adhere to the familiar corporate identity |
|
Design guidelines |
Users try to adhere to the design guidelines |
|
Story Guide for creators |
Users are trained and effortlessly create consistent and structured stories using SAC resources |
|
Of course, the fourth scenario is desirable and achievable because the SAC has functions to create a unified design. Themes and Templates make it easier for the users to to create dashboards.
Themes and templates are predefined design and structure templates that enable a uniform appearance and a consistent user interface across different stories, thereby standardising the creative design process to a large extent. Therefore, the first and actually indispensable step is to create a design concept. Depending on which of the above-mentioned scenarios you are in, this may be more or less complex. If well-structured design guidelines that can be applied to the SAC are available, a design concept can be derived relatively easily. If corporate identity guidelines are available, the effort is significantly greater, but also allows more leeway. If no specifications exist, you start from a ‘green field’. This is of course the most work, but it also offers the designer the greatest freedom.
This is where we come to the keyword ‘designer’. In the frontend, this term is often equated with the developer or creator. For the creation of a design concept, it is worthwhile to work with professional designers. This brings a breath of fresh air, as well as new ideas, and thus leads to a better end result. Working with a designer is worthwhile in almost all scenarios, whether a complete concept is to be created or an existing one is to be rethought.
As soon as the design concept is in place, the first theme should be created. This can be done very easily via the menu of any story.
A quick tip at this point: it is possible to customise the standard SAC theme. However, the best way is to create your own and then set it as the standard. If you really want to work reliably with themes in the long term, you should also create a dedicated theme story with the most important widgets visualised as an example. This is, of course, additional work, but it pays off in the long term.
The theme is then edited in a separate editor. In this editor, the design of all widgets can be changed and the range of functions is almost the same as that of the designer during the development of the story.
At this point, it must be noted that all settings in the theme editor only specify the default design. The story creator can still independently adjust the appearance of all widgets and does not have to adhere to the specifications.
Themes also support CSS, but do not have their own CSS editor. The CSS is always loaded from the active story. This is another reason to configure the themes using a specially created story for that purpose. Using CSS in themes has advantages and disadvantages, as well as some special features that should be noted.
Advantages |
Disadvantages |
More and more refined design customisations (compared to the editor) |
CSS customisations are not visually visible in the theme editor |
Can contain CSS code that is not directly applied (CSS library) |
CSS always overwrites the default settings in the theme editor |
Designs that have been defined cannot be changed by the user |
CSS applied in the theme cannot be changed in the design settings |
Special features of CSS defined in the theme:
CSS in the theme can be a double-edged sword and should be used with care. Widgets whose design should not be changeable by the user, or design adjustments that cannot be made in the editor, are suitable as content for the global CSS class. In addition, CSS classes should be stored for the most frequently used designs, for example panel borders or shadows. These are deliberately used and not attached to every panel, but of course they should also be used consistently.
In addition to themes, templates are also part of the toolbox for good story design. Templates are created from a story and can then be loaded into stories or opened directly as a template for a new story. Like stories, templates are stored in the SAC folder structure or can be selected directly from the story panel.
In principle, a template can be created from any story, but it makes sense to create a dedicated story for each template. This story is then structured and designed, preferably with an example of data. Don't worry, these data sources are automatically removed and replaced with a placeholder when the template is created. The created template then looks like this:
The template always opens as a new story and can immediately be provided with data sources. Via the layouts menu, it is possible to customise the template per page or to apply several templates to different pages.
Of course, it will not be possible to provide each scenario with a template 1:1. This is not necessary either, since the template serves as a structure and the story can still be customised. So in the above case, it would be possible to simply replace the table with another chart or insert a third panel below the existing ones.
Themes and templates are important tools in SAC for implementing a consistent design. They are indispensable in a self-service approach with many users creating stories. But even if the stories are created centrally by a few developers, themes and templates help to implement a consistent design in the long term. However, the design concept always remains the central point. It forms the basis and contains all the important specifications that are implemented using themes and templates. Even if the design concept adapts and changes over time, it is easy to implement these changes in the SAC using themes and templates.
Do you have questions about SAP Analytics Cloud or other topics? Are you trying to build up the necessary expertise in your department or do you need support with a specific issue? Simply get in touch with us - we look forward to exchanging ideas with you!