Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
cancel
Showing results for 
Search instead for 
Did you mean: 
geert-janklaps
Active Contributor
A few years back the introduction of the SAP Icons & Samples for solution diagrams eased our lives as a BTP architects. It was / is great to have all icons available and a set of templates as a basis to start from (although PowerPoint is not the best solution in my personal opinion).

Announcement blog:

Be Visual! Use Official Icons and Samples for SAP Business Technology Platform Solution Diagrams | S...

In the meanwhile, the original Wiki page has already been removed and it's now only possible to download the templates & icons through direct links provided in the comments. Unfortunately, the last update of the SAP BTP Icons dates from somewhere around March 2021.

A few weeks ago, I saw a few new blogs, reusing the same outdated icons for draw.io. Which is an absolutely great alternative compared to the PowerPoint templates.

Create SAP BTP solution diagrams with Draw.io (Diagrams.net) | SAP Blogs (by mauriciolauffer)

Creating architecture diagrams with code | SAP Blogs (by ajmaradiaga)

Edit: The original solution Mauricio mentioned in his blog, does contain updated icons, which I missed while I wrote this blog and created this solution. (See Mauricio's comment below)

So, that got me thinking, how can I make sure I have all latest BTP icons available to use them in my solution / architecture diagrams? I came up with a few requirements I wanted to have available in my solution diagrams:

  1. Latest version of BTP service icon as-is

  2. Latest version of BTP service icon surrounded by a circle (as typically seen in the previous libraries)

  3. Generic SAP Icons (as included in SAP Fiori)


 

Introducing the BTP Diagram Icon generator


The BTP Diagram Icon Generator is a yeoman generator that:

  • Downloads the latest BTP service icons from the SAP Discovery Center

  • Generates a version of the service icon surrounded by a circle

  • Uses the UI5 Web Components to extract the Fiori icons


Icons are generated in two formats, file-based in a folder structure so that they can be used in any diagram designing tool and as a draw.io / diagrams.net library which can easily be imported.

Icons can be organized by category as defined in the SAP Discovery Center or by type.


Generated draw.io / diagrams.net library


 

Using the BTP Diagram Icon Generator


Generating your own BTP diagram icons is a matter of installing Nodejs, yeoman generator and the BTP Diagram Icon Generator itself.

First download and install Nodejs for your OS.

After installing Nodejs open a terminal / command-line and execute following command:
npm install -g yo generator-btp-diagram-icons

Now you're ready to run the generator! In the terminal / command-line, navigate to the folder where you want the icons to be generated and execute following command:
yo btp-diagram-icons


BTP Diagram Icons Generator


After the generator is finished, your folder will contain a set of folders containing the icons and libraries based on the choices made in the generator.


BTP Diagram Icons Generator - Folder Structure




  • btp: BTP service icon files (regular & circled)

  • icons: SAP Fiori icon files

  • libraries: draw.io / diagrams.net libraries


 

Wrap-up


You now have the latest icons available for all your BTP solution diagrams! Whenever a new service is released, it's just a matter of running the generator again and the new service icon will be generated automatically!

Hope you enjoy this new open-source solution and happy diagramming!

 
20 Comments
Labels in this area