top of page
ECC_hero (1).webp

SAP ECC UX Modernisation 

Modernising a customer on SAP ECC from a UX perspective involves crafting a clear strategy to bridge the experience gap between ECC and future transformation to S/4HANA, by incrementally introducing SAP Fiori apps, standardising user experience, and building the foundation for a seamless future migration to S/4HANA.

 

Here is our 3 step modernisation process in a nutshell.  

1. ASSESS THE CURRENT STATE (ECC UX AUDIT)

  • Identify top 5–10 business-critical ECC transactions (e.g., VA01, ME21N, MIGO).

  • Interview end users to uncover pain points and workflow inefficiencies.

  • Audit how many GUI-based screens, or Z-transactions are in regular use. 

2. ROLE-BASED EXPERIENCE DESIGN

  • Identify user persona and key tasks they perfom on ECC.

  • Unify disjointed workflows and bring contextual data together

  • Design fit-for-purpose applications using SAP UI5 stencils.

  • Test the screen with end users and validate the efficiency.

3. MODERNISATION & BRANDING 

  • Building custom Fiori apps using SAP UI5 for key ECC transactions

  • Exposing ECC functionality via OData services or RFC wrappers

  • Apply branding for visual aestistics and consistency.

  • Hosted using SAP Launchpad service (on BTP) or Fiori Launchpad on-premise

Case Study

How we modernised ECC transaction screens for a leading Oil & Gas customer by transforming legacy SAP GUI interfaces into clean, intuitive SAP Fiori experiences.

Business Challange: The customer, a major player in the Oil & Gas sector, faced significant efficiency and user experience challenges with their legacy SAP ECC system accessed via the traditional SAP GUI. Key processes like service orders, approvals, and preventive maintenance involved too many steps and required switching between multiple screens. Maintenance teams found it difficult to schedule and track tasks efficiently. The lack of real-time preventive maintenance notifications meant important updates were often missed, leading to delays, missed service windows, and increased reliance on manual follow-ups.

ecc_screen_02.png
ECC_Screen.png

Before - ECC Screen

Key transaction screens was hard to use, with too many fields, tabs, and confusing screens. Important information was buried, and users had to click through multiple steps to complete simple tasks. New staff needed training, and even experienced users took 3–5 minutes and up to 68 clicks to finish one transaction.

Our UX Strategy for ECC Modernisation 

We designed a phased, low-risk strategy to modernise the SAP ECC experience using SAP Fiori, while keeping existing backend processes intact. This allowed users to benefit from a modern UI now, while laying the foundation for a future S/4HANA transition.

1. User Research & Role Mapping

  • Ran discovery workshops with Procurement, Operations, and maintenence teams

  • Identified key user roles and their day-to-day SAP tasks

  • Prioritised high-friction transactions like IW31 – Create Service Order

2. UX Design & Fiori Prototyping

  • Translated ECC screens into role-based Fiori experiences 

  • Designed launchpad, object pages, list pages etc using SAP UI5 Fiori stencils

  • Applied SAP Fiori UX guidelines to ensure consistent, scalable design

  • Created high-fidelity prototypes using Axure RP

3. Validation & Iteration

  • Tested prototypes with real users from multiple business units

  • Refined designs to eliminate confusion, reduce steps, and improve clarity

  • Finalised screens that will be build as Fiori Application.

4. Build & Deployment via SAP BTP

  • Built apps using standard SAP UI5 controls only—no custom components

  • Hosted via SAP BTP Launchpad, ensuring alignment with S/4HANA architecture

  • Integrated with ECC backend using OData services, enabling a plug-and-play shift to S/4HANA

  • Maintained clean separation between UX and business logic to support phased backend upgrades

Outcome

An 82% reduction in clicks from 68 to just 12, minimal fields, clean layouts, and faster loading screens and absolutely no training required. The ECC Fiori apps we delivered on BTP are fully upgrade-safe, meaning they will require minimal or no rework during the S/4HANA transition.

Enhansed_Screens.png
work_order.png

After - Modernised to 'fit-for-purpose' SAP Fiori Apps On BTP

We applied a User-Centred Design (UCD) approach to modernise, digitise, and transform outdated SAP ECC screens into fit-for-purpose SAP Fiori apps, boosting task efficiency by 80% and delivering an intuitive, role-based experience that end users loved.

UX Modernisation Delivery – Sprint-Based Approach

Here's how we would deliver the UX modernisation of SAP ECC screens in a sprint-based model, ensuring minimal disruption while progressively transforming legacy SAP GUI transactions into clean, role-based SAP Fiori experiences:

SPRINT 1
Discovery & UX Audit

  • Conduct stakeholder interviews & discovery workshops

  • Map current ECC transactions (e.g., ME21N, IW31, VA01)

  • Define key personas and user roles

  • Identify high-friction use cases to prioritise

SPRINT 2

Workflow Mapping & Wireframes

  • Map key task flows per persona

  • Create low-fidelity wireframes for targeted ECC screens

  • Conduct walkthrough sessions with users and SAP team

  • Validate design direction and information atchitecture

SPRINT 3

High-Fidelity Fiori UI Design

  • Create high-fidelity mockups using Figma Fiori UI.5 design stencils

  • Reuse standard UI5 controls to ensure S/4 readiness

  • Apply clear information hierarchy, visual simplification

  • Validate with 2–3 key user groups

SPRINT 4

Build & Deploy

  • Work with SAP developers to implement UI using SAP UI5

  • Ensure apps use only standard Fiori controls for upgrade safety

  • Integrate with ECC backend via OData or RFC

  • Deploy via SAP BTP Launchpad or Fiori Launchpad (on-prem)

bottom of page