Migration To Sap Fiori - The Agile Approach

AUTHOR: Rajeev Adenkar

Contents

Migration to SAP Fiori - The Agile Approach

1 Executive Summary ....................................................................................................... 2 2 Technology Evolution and SAP Fiori .............................................................................. 3 3 Agile Approach for Migration to SAP Fiori..................................................................... 5 4 Conclusion................................................................................................................... 10 5 References .................................................................................................................. 11 About the Author .............................................................................................................. 12 About L&T Infotech........................................................................................................... 13

1 Executive Summary The importance of user experience and designing it correctly is getting serious attention from companies who aim to keep their users happy and productive. Users are demanding enterprise apps to work with simplicity as defined by the consumer grade experience set by the Amazons and Googles of the world. SAP Fiori promotes sophisticated, scalable and highly responsive user interface that seamlessly works across desktops, tablets, or smartphones. The business case for SAP Fiori is robust, as it claims to improve monetary values, including improved productivity, reduced support & training costs, and improved data accuracy, along with human values for improving user satisfaction, improving customer loyalty and increasing the overall solution adoption. Despite these innovations, adoption was a little sluggish and Business and IT organizations were reluctant to go full-throttle, and rather preferred the cautious approach limited to POCs and prototypes. What is causing this slow adoption? Even though 700+ apps are available from SAP, the cost of migration, maturity of the UI technology, and limitations in functionality offered through the standard off-the-shelf apps, were few of the reasons hindering adoption. Clients do want to leverage their SAP investments to their full potential, but the risks of disrupting working systems and cohesiveness of user experience with other UI technologies from SAP were known concerns. Most of these concerns were addressed with the Agile Approach. The most repetitive build tasks for prototyping and building were tackled by automation tools, making the business case much stronger. This White Paper describes the path for Migration to SAP Fiori in an agile manner, and details the approach, considerations & challenges that drive the game-changing UX improvement strategy.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 2 of 13

2 Technology Evolution and SAP Fiori Let’s explore strength and benefits with SAP Fiori as a User Interface Framework in a market typically crowded with myriad other solutions for web application developments. With the advent of HTML5 and CSS3, we observed a shift in approach for interactive web application development, a shift towards clientdriven technologies. AngularJS, Backbone, Ember and multiple other frameworks were already available when SAP introduced SAP Fiori. It is more of a platform rather than just a framework, mainly because of the toolset offered for design & build, UI widgets and pre-built apps offered from SAP, and of course loads of other supporting stuff, including documentation, icons, integration with sap gateway tools, etc. Why is HTML5 a role-changing evolution for Web Applications? HTML5 was defined considering the replace features offered by Flash and SilverLight - the popular choices for rich, intuitive web pages offered by e-Commerce and social web sites. With rich features, including push notifications, canvas for rendering drawings & shapes, new UI elements, and more local data storage than just cookies; were the few drivers for this shift. It became easy to develop great looking apps with CSS3 offerings for animations, filters, shadows, rounded corners and above all, the media commands to make apps responsive to work across desktops and mobiles. These features were harnessed by JavaScript frameworks, further improving performance as the rendering logic moved towards the less loaded end-user browsers. This was also the time when most clients were defining strategies around User Experience and Design Thinking. This is when SAP released SAP Fiori, with some serious efforts on a design to support consumer grade UI in enterprise apps. It was based on design principles such as: Role-based

Understand end-user tasks and speak the language or human tone so as to enable them to perform better.

Responsive

Smart adaptation based on the device, to deliver the best experience a device can provide.

Simple

Focus on the important tasks, and make essential functions obvious and easy to use. Automate wherever possible.

Coherent

Provide one fluid, seamless experience across all platforms, devices and applications.

Delightful

Make an emotional connection to make end-users better at their jobs and go beyond what is expected.

SAP Fiori Strengths Here is a list of few considerations that are in favor of SAP Fiori, when we compare it with other JavaScript Frameworks: 

Off-the-shelf content: To help clients jump-start deployment, SAP has already provided 700+ Fiori apps (transactions, analytics and fact-sheets) based on SAP Business Suite and SAP HANA.



Model-driven Approach: Modularized framework, with clear separation of server side business logic, data model and UI presentation logic. SAP Fiori uses HTML5 components and a thin layer of customized HTML page with two-way data binding. This helps in faster development cycles and easier maintenance.



Easy Development Lifecycle: The Framework includes toolsets from SAP like WEBIDE, as a development environment, BUILD for collaborated design and many other services on their cloud platforms (translations, OData modeler) apart from plugins for Eclipse. WEBIDE provides gallery of template apps and artifacts, API references, method cards, best practices. All of these help the developer community for faster learning and faster deployments.



Integration with SAP Ecosystem: Well integrated with other SAP Business Suite components, SAP Gateway, as well as with SAP Portal & NWBC. SAP Gateway includes Fiori Launchpad to act as a

L&T Infotech Proprietary

Migration to SAP Fiori

Page 3 of 13

common entry point for all apps, Fiori or non Fiori, and Fiori Inbox for unified workflow/task processing. SAP Gateway architecture helps in connecting with other SAP Business Suite components through OData services. 

Widgets and Event Handlers: SAP Fiori/UI5 includes a rich collection of 200+ UI elements, grouped in cross-device (running on phones, tablets and desktops) for building great looking apps. The Framework includes routing and event handling mechanism to track any browser-based events or user interactions. The Library even includes components for charting to support sophisticated analytics applications.



Automated Test Frameworks: Unit testing involves breaking down the logic of Fiori application into small chunks or ‘units’, and verifying each unit of work as desired. In JavaScript apps, “Function” is the smallest unit of code that can be tested; Unit Testing frameworks like QUnit or Selenium, along with Chrome Plug-ins, help developers follow test-driven developments.



Single Page Application: SAP Fiori is a strong SPA framework, supporting features like Routing, Back button support, view composition and dynamic loading of partial views/fragments.



Cross Browser Support: SAP Fiori contains HTML5 and CSS3-based design templates for typography, icons, forms, buttons, navigation and other components. These libraries are compatible with all major browsers’ latest versions.

One of the important strengths for SAP Fiori is its strategic placement in SAP ecosystem as SAP’s preferred choice of UI technology, and minimal prerequisites requirements on architecture. As shown in the diagram, a separate front-end server is recommended for deploying Fiori apps. It is integrated with SAP Business Suite components through OData Services to manage business logic, security roles, and authorizations, etc. The Front-end server contains additional Fiori platform components for Logon, Launchpad, Inbox, Searches, and Notifications. This separates the UI lifecycle and also helps in load balancing for better performance. All Fiori apps have separate security roles to enable role-based access through the Fiori Launchpad.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 4 of 13

3 Agile Approach for Migration to SAP Fiori We live in a world where organizations are under continuous pressure to keep costs low and the key for any successful migration is to break it into stages. The heartbeat of agile development is iteration and this bodes perfectly well for the base requirement herein. Agile execution emphasizes the ability to create working, tested, value-delivered code in a short time-box – with the goal of producing an increment of potentially shippable codes at the end of each iteration. But, one has to also ensure not to abandon usability while chasing after speedy programming. Agile Software Development Agile Software Engineering and Agile UX processes are actually the environments for a team to learn how to be agile, and are based on the following principles: 

People and Communication over Processes and Tools



Working software over comprehensive documentation



Customer collaboration over contract negotiation



Open to changes over following a rigid plan

Applying agile methods to UX leads to working in short sprints of 2-3 weeks, focusing on a small scope and building the solution incrementally. The Scrum works with 3 roles, 3 artifacts and 5 ceremonies as described in the diagram below.

The Product Owner is responsible for release & sprint backlog, features and prioritizing them as per business needs. Based on the principles of lean software development, the product owner needs to ensure minimal waste, or in simple terms, needs to determine what is relevant so that the end-user can perform the tasks effectively. Scrum Master manages the sprint and coordinates with the team on the progress, or helps in addressing any impediments. The Scrum Master would utilize daily scrums or daily stand-ups to discuss what the team members ‘did yesterday’, ‘are doing today’ and ‘impediments blocking the efforts’. The Development Team is responsible for estimation, using story points and development tasks. User Stories are described as ‘As a USER <some role>, I want <some goal>, so that <some reason>’. They also include additional details and an acceptance criterion, which helps in test-driven developments. Estimations are done in terms of story points, based on the efforts required to perform the identified task. In a nutshell, the agile team fosters transparency, identifies issues sooner and delivers features faster. Since there are few stories in an iteration, tracking the status of each is fairly a simple matter, and status L&T Infotech Proprietary

Migration to SAP Fiori

Page 5 of 13

is tracked by hanging visual indicators in a ‘Burndown Chart’, which is the aggregate to continuously monitor current status and also estimate how much work remains. It depicts the sum total of the estimation for all backlog items that are not yet started, and the estimated remaining effort for inprogress backlog items. The sum represents the estimated remaining work to be completed during the iteration. What are the Challenges? The first major challenge would be the delivery of a fully-working (though with limited scope) Fiori app in a short span of 2-3 weeks, especially when this involves multiple activities for building the app and the underlying OData services. Further, agile works well with team in close proximity. So how can one accomplish this in an onsite-offshore model with distributed teams? These are the typical questions when dealing with large Fiori projects, the ones with the release scope of 20+ apps. We approached this with a Scrum of the Scrum model and automation tools for accelerated deployment. Although the initial model was defined considering the following perceptions, it underwent multiple improvements during actual execution. Factors Supporting Agile Approach 

Fiori Design: Fiori apps are based on 1 User, 1 Scenario and not more than 3 Screens Principles. While large Fiori apps can take up to 6 weeks for build, work packets can be split to limit the features or scope that are achievable within short time boxes of 2-3 weeks.



Prototyping: Mockups and prototypes improve clarity on design for product owners and development teams, and help keep things on track. Defining the wireframe and data model upfront also helps in engaging end-users as they are able to visualize things better and provide clear definition of the user story. Easy prototyping tools help build wireframes in a short span of 1-3 days during the design phase. Early prototypes ensure usability is not compromised for the short sprint cycle.



Release and Sprint Backlog: The clarity, with which the user stories are defined, helps in saving valuable time during the actual sprint and reduces rework. Stories also need to include detailed acceptance criteria so that the team can perform ‘test-driven developments’. Clear definition of user stories, epics & themes, upfront prioritizing of backlogs based on business needs and sorting dependencies before the actual sprint starts, facilitates faster execution. Upfront prioritizing and estimating the release backlog to the maximum extent possible, drives individual teams to function independently. Such committed teams are self-motivated and deliver without a scrum master.



Estimation with Story-Points and Velocity: With agile, estimation is done based on story-points and development teams vote with their estimation cards to arrive at a consensus on efforts. A typical Fiori app build covers multiple development tasks around UI, Services and Data. A checklist with various build activities enabled better estimates. Typical tasks envisaged include: –

Data Dictionary or Data Model Changes

–

Analyze existing Applications

–

Security Profile/Role Changes

–

Fiori Launchpad Integration

–

Testing Requirements and Use Cases

–

Dependencies on other stories/tasks

–

SAP Functional Configuration

–

Fiori UI Development Tasks

–

OData Service Development Tasks

–

Search Helps or Value Helps

–

Document Management (Document uploads from app)

L&T Infotech Proprietary

Migration to SAP Fiori

Page 6 of 13

–

Workflow Task/Event Management

–

Internationalization of requirements, including languages, to maintain translations.

The team estimates efforts using Fibonacci numbers 1,2,3,5,8,13 & 21. Stories with estimations beyond 21 are split to ensure completion within the short sprint duration. Agile promotes adaptive planning, evolutionary development, early delivery and continuous improvement, and encourages rapid and flexible response to change. The Methodology enables improvement in velocity through iterations, and typical improvements of around 200% are achievable with 3-4 sprints. In fact, we observed these improvements to be 400% (from 50 to 200 per team), mainly attributed to automation tools to cover repetitive tasks and doing things in an efficient manner. 

Team Skill Mix: Fiori App build demands UI5 (front-end or UI), ABAP (back-end OData services), SAP security and specific SAP functional skills (configuration & testing). These distinct skills and dedicated team resources enable parallel simultaneous efforts. The typical recommended team size per agile development standard is from 5 to 8. Larger Fiori projects however need multiple squads (or teams) that are anticipated to be independently delivering. Concepts like parallel programming do help in improving throughput and it is advisable to have at least 2 developers per key skill such as UI5 or ABAP in this case. Agile execution demands development team working in close proximity with the client, and preferably in the same time-zone, as this boosts informal communication and collaboration. This is a major challenge in an onsite-offshore delivery model. The Diagram shows the model followed with ‘scrumming the scrum’ approach. Each offshore squad has a dedicated Scrum Master and a proxy Product Owner, both of whom are closely associated with the onsite squad. The entire team, team members on both onsite and offshore, need to part of common daily scrum meeting. It is recommended to have some overlap between work hours to facilitate coordination. All teams working on a release need to work within the same time box. All agile teams are eventually expected to turnout as self-motivating and independently operating without scrum master as the delivery process matures through iterations.



Automation Tools: Agile teams become more proficient in executing the development as they progress through the sprints. As the team realizes the repetitive tasks and process inefficiencies, it tends to improvise accordingly. Automation tools are typically able to crunch time and are an outcome of this process maturity. Multiple tasks in the Fiori app build, including Definition of data meta-model, OData service modeling and UI template pattern, are candidates for automation and we established tools to expedite things as were needed for agile delivery. The UIRenewal tool helps in extracting data model, views & controller code from existing Web Dynpro applications, and migrating to Ui5 (JavaScript and XML). The tool enables easy and risk-free transformation. The Simply5 tool helps in quickly defining metadata model, which is the foundation for UI5 application and the underlying OData service. The tool provides starter code and saves about 30-40% of developer efforts. It generates basic Fiori application and OData service, with the necessary ABAP methods and mock data.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 7 of 13



Off-the-shelf SAP Content: There is a plethora of SAP-delivered Fiori apps (700+) available from SAP to help developers jumpstart the development process. It is very rare that a developer needs to start a Fiori project from scratch. In most cases, it is either the standard off-the-shelf SAP app that can be extended, or there is a bootstrap or sample application available, which can be cloned. These code snippets are already based on best practices and distinct extension points to ensure clear separation of custom code from the standard SAP-delivered code, thus ensuring support for future app upgrades.

Known Challenges and Watch-outs 

Mix of Waterfall and Agile Methodologies – Most client projects prefer blended methodology for various reasons. Issues observed are around status reporting or basically with the team mindset. Agile sprints are slow at the beginning, but do pickup speed as the team becomes mature to curb inefficiencies and improve velocity. This often negatively impacts the status reporting, particularly when being confused with the waterfall methodology. We need to create awareness so that the entire team believes in the process and sticks to the plan.



Early Backlog Prioritization & Refinement – A clear backlog, with detailed user stories, reduce team dependency of product owners and helps teams operate independently.



Sprint Retrospect – Needs to be performed with the utmost sanctity to clearly identify the impediments or course corrections. People have to accept and address what went wrong.



Sprint UAT – As per the standard agile methodology, sprint outcome is a fully tested product. In SAP ecosystem, the transport and setting-up of the UAT data takes time. We recommend following a separate sprint for testing, rather than accomplishing all this in a single sprint. This becomes specifically challenging in case of onsite-offshore operations. Moreover, testing teams (business

L&T Infotech Proprietary

Migration to SAP Fiori

Page 8 of 13

users) also need to have a clear mindset or to limit testing for relevant features only, in current sprint scope. 

Happy Teams Deliver More – Scrum Masters need to use different tactics to keep the teams motivated and self-delivering.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 9 of 13

4 Conclusion SAP Fiori is promising the enterprises to embrace the Design Thinking approach to delight endusers, and improve productivity and reduce costs. It is the preferred UI technology choice within the SAP ecosystem for great looking, responsive enterprise applications. Easy and risk-free migration to SAP Fiori is possible with the agile software development approach. SAP enhancement projects, revolving around SAP Fiori, benefit from the iterative approach. Automation tools help deliver rapid deployment of new technology, or renewal of the existing UI technology, in record time and at low costs.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 10 of 13

5 References Agile manifesto from ScrumInc.com

L&T Infotech Proprietary

Migration to SAP Fiori

Page 11 of 13

About the Author Rajeev Adenkar has extensive knowledge and experience in User Experience & SAP User Interface (UI) technologies, and Business Process & Digital Platforms, thus delivering solutions that define roadmaps and new technology evaluations for large multinational companies. In his recent engagement, Rajeev is leading the technology stream of Digital Transformation program for one of the largest global Life Sciences major.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 12 of 13

About L&T Infotech Larsen & Toubro Infotech is a global IT services and solutions provider with presence in 23 countries. We solve complex business challenges at the convergence of digital and physical with our real-world expertise and client centricity. We enable our clients to build innovative business models, enhance operational efficiencies and create captivating customer experiences.

L&T Infotech Proprietary

Migration to SAP Fiori

Page 13 of 13