Skip to Content
Product Information
Author's profile photo Conrad Bernal

Getting up to speed with SAP Fiori tools: Guided Development Overview

Since the release of SAP Fiori tools last year, the SAP UX Engineering team has been hard at work listening to your feedback in order to help you accelerate your SAP Fiori development. Thanks to your ideas via the SAP Community, email, social media, and the SAP Fiori elements and SAP Fiori tools Roundtable, we’ve been able to better understand how we can help you build SAP Fiori apps faster. Speaking on behalf of the Guided Development team, the extension has benefited greatly from your suggestions, both in the content of the guides and how to make using them easier. To help sum up these exciting new exciting new updates, my co-product owner Conny Kinateder and I have prepared an update on the latest in SAP Fiori tools Guided Development!

As you can imagine, there’s been a lot going on since the release of our Introducing SAP Fiori tools video series last August! In order to get you caught up on what’s new with all of the extensions in SAP Fiori tools, this Getting up to speed with SAP Fiori tools series will feature updates directly from the product owners of SAP Fiori tools. They’ll briefly reintroduce their extensions, share what’s new, as well provide some tips and tricks for getting the most out of your time with the tools.

What is SAP Fiori tools Guided Development?

Guided Development is an SAP Fiori tools extension intended to streamline SAP Fiori development and make it more accessible to a wider range of users. The extension, available for both SAP Business Application Studio and Visual Studio Code, provides step-by-step guides for implementing functionality in your SAP Fiori development projects. For example, you can use it to add new columns to a table, insert charts in your application, create cards for your overview pages, and more. There are guides available for every SAP Fiori elements floorplan.

A%20typical%20guide.%20Here%20the%20user%20is%20using%20Guided%20Development%20to%20add%20a%20new%20filter%20for%20ProductCategory%20without%20writing%20a%20single%20line%20of%20code.

A typical guide. Here the user is using Guided Development to add a new filter for ProductCategory without writing a single line of code.

The guides serve as an interactive form of SAP Fiori tools documentation with the added ability to make changes to your SAP Fiori project. Open the guide you would like to implement, set the relevant parameters, and press Insert Snippet to add the required code snippet(s) into your project files. Because you set the parameters, the given code snippets are specific to your project – there’s typically no need to go in and modify placeholders.

Newer SAP Fiori developers will appreciate the wizard-like functionality, helping them implement features and actions they may not have had experience with previously. More experienced developers will benefit from streamlined development, driven by the automatically generated and updated code snippets.

If you haven’t had the opportunity to try out Guided Development yet, I highly recommend you take a look at the SAP Fiori tools tutorial we rolled out last year: Create a List Report Object Page App with SAP Fiori Tools. You’ll get hands-on time with the various tools, using them to build out an application using an OData V2 service.

What’s new with SAP Fiori tools Guided Development?

Over the past few major releases, we’ve added a variety of enhancements to streamline the experience of using Guided Development. Here’s a quick glimpse at some of the ones we are most proud of:

Delivering a project-focused experience

The guides featured in Guided Development are always evolving, expanding to meet the needs of users working with different page types and OData versions. We’ve heard from some of you in the past that this has led to an occasional challenge – for example, when trying to apply a guide initially written for an OData V2 project to an OData V4 project.

To help prevent this and deliver the code snippets that are relevant to what you are working on, the Guided Development team has created a project-focused experience for our users. Now when you open Guided Development, you’ll only be served guides that are relevant to the page type and OData version for your selected project.

Guided%20Development%20uses%20the%20Project%20Guides%20view%20by%20default.%20Users%20can%20switch%20to%20the%20All%20Guides%20view%20at%20any%20time.

Guided Development uses the Project Guides view by default. Users can switch to the All Guides view at any time.

Of course, if you would simply like to browse through all the guides and guide variants available in Guided Development, you are free to use our All Guides view. Even then, we’re looking out for you: the appropriate guide variant will be automatically selected when opening the guide. Selecting other variants or guides not intended for the page type of your currently selected project will indicate that you might want to try something else.

The%20warnings%20displayed%20by%20Guided%20Development%20when%20a%20user%20selects%20a%20guide%20variant%20not%20intended%20for%20their%20project

The warnings displayed by Guided Development when a user selects a guide variant not intended for their project

Introducing collections of parameters

The Add a New Column to a Table guide continues to be one of our most commonly used guides. With the selection of a handful of parameters, developers can provide additional valuable information to their end-users. While we’re happy that you like it, we’re even happier to take your feedback to make it even better. That’s why, when users spoke out about wanting to be able to add multiple columns at the same time, we listened. Developers can now use the guide to create a group (or collection) of parameters that define multiple different columns. The newly added columns can also be rearranged to best suit the order your end-users need.

An%20example%20of%20a%20collection%20of%20parameters%20in%20Guided%20Development.%20The%20user%20is%20adding%20three%20columns%20simultaneously%3A%20Depth%2C%20Height%2C%20and%20Width.

An example of a collection of parameters in Guided Development. The user is adding three columns simultaneously: Depth, Height, and Width.

Of course, the use cases for this sort of functionality go beyond the ability to add columns to a table. In the future, we’re looking to see where else this paradigm can be applied in order to further streamline your development with Guided Development. Please note: SAP reserves the right to change development priorities at any time.

Building on our content; 9 new guides in 6 months

As you might imagine, increasing the number of guides available to help meet our users’ needs is also a priority for the Guided Development team. Over the past six months, we’ve added nine new guides across a variety of page types:

Recently added guides by floorplan

List Report – Object Page Object Page Analytical List Page Overview Page

Add Custom Columns to the Table Using Extensions

 

Extend Forms in Sections

 

Create annotations for Key Performance Indicator (KPI) Tags

 

Add a Static Link List Card to an Overview Page

 

Enable Draft Toggle Buttons

 

Enable a Show Related Apps Button

 

Enable condensed table layout

Enable Inline Creation of Table Entries

 

Extend Object Page Headers Using Extensions

 

We’ve also made revisions and improvements to three of our guides for creating cards for overview pages, driven by user feedback.

Our goal is to help simplify and accelerate SAP Fiori development and your feedback helps us to do exactly that. If you can’t find a guide that you’d like to see in Guided Development, we highly encourage you to use our Request a New Guide form at the bottom of the guide list. Just fill out your contact info, desired functionality, page type, and OData version; and then press Submit!

The%20Request%20a%20New%20Guide%20form%20allows%20users%20to%20send%20suggestions%20for%20new%20guides%20or%20guide%20variants%20they%20would%20like%20to%20see%20in%20Guided%20Development

The Request a New Guide form allows users to send suggestions for new guides or guide variants they would like to see in Guided Development

Your request will be forwarded directly to the product owners for Guided Development – myself and Conny Kinateder – and then placed into our backlog for guide requests. From there, we’ll compare it against previous submissions, looking for clusters of similar requests. These clusters help us to understand where functionality can be best added to Guided Development. Of course, as mentioned previously, SAP reserves the right to change its development priorities at any time.

What’s Next

If you are new to SAP Fiori tools and Guided Development, I hope this blog provided an informative overview of the extension and how user feedback plays an active role in its continued development. If you’d like to learn more about SAP Fiori tools, I’d highly encourage you to stay tuned for the other blog posts in this series where my fellow product owners from SAP Fiori tools will be sharing similar overviews of their extensions. You may also be interested in the following:

If you already have some experience with SAP Fiori tools, I would also encourage you to stay tuned for later entries in this blog series, as we’ll be sharing tips and tricks for getting the most out of the extensions. If you haven’t already signed up, we’d also like to invite you to participate in the SAP Fiori elements and SAP Fiori tools Roundtable, where you can share your experiences with the development team and other SAP Fiori development experts.

For the SAP UX Engineering team,
Conrad Bernal and Conny Kinateder
Co-product owners, SAP Fiori tools Guided Development

Assigned tags

      Be the first to leave a comment
      You must be Logged on to comment or reply to a post.