SAP BOBJ Design Studio 101

Author: 
Jim Sun

Released in 2012, Design Studio is a new dashboard application design tool in SAP BO. Being highly promoted by SAP, Design Studio has become more and more popular in data visualization market and more and more companies are seeking for resources for Design Studio. In this post, we will take a quick look at Design Studio and find out its capabilities in application design. Compared to SAP’s previous dashboard product, Xcelsius, Design Studio has a main advantage: can execute on mobile devices. Because Xcelsius is based on Adobe Flash, which is not supported on mobile devices. After BI 4.0 SP 5, some of the components in Xcelsius can be exported to HTML5 format so that it could be used by mobile devices, but there are still limitations on some of the components. But in Design Studio, there is not such limitation on mobile device capability.

There are 3 types of logon modes to use Design Studio: Local Mode, BI Platform mode and Netweaver BW mode. You can choose either way in the preference tab. Now Design Studio can consume either SAP or non-SAP data sources, the user can connect to HANA analytic/calculation views, BW BEx queries/query views and Universe in BI Platform, which means that now Design Studio can consume not only SAP data, but also non-SAP data through Universe.

To use Universe data, we need to firstly login to BI Platform:

design_studio_1

The main design interface

design_studio_2

In the initial page, you can see all the components are categorized into 3 groups on the left side, charts and filters are in “analytic components”, buttons and other interactive components are in “basic component” and containers such as page book and panel are in “container components”. The properties panel on the right side can help make changes on either the application or the components. In there you could either do small changes such as text, font, component size or write scripts to create some interactivities. Also you can include data source for the application in this area.

Edit data source

design_studio_3

After connecting to the data source, the user will need to design the data source 1 step further in the query-designer-like interface. Similar to many other BOBJ client tool query design screen, user needs to drag and drop fields/hierarchies to rows and columns to design this query. After finished, hit OK and then you can use this data source directly in application.

Screenshot of a sample dashboard

In the above sample, we created a column chart that displays sales revenue based on states. Also we added a filter on the year for users to select from and check out data based on different years.

To publish your finished works, you can either save it locally or publish to BIP or BW. And of course, one of the main advantages of Design Studio, you can also publish your application to your mobile server.

design_studio_4

In this post, we went through some basic knowledge about Design Studio, including the background knowledge, interface and basic development process. Do you want to learn more about Design Studio? You can click on the below button and download the introduction of Scripting of Design Studio.