iPaaS Integration Manager

Overview

Overview

Overview

iHub is bp’s Integration Hub, a platform that empowers users to set up and operate integrations autonomously, securely, and cost-effectively without relying on specialised experts. As bp transitions into an Integrated Energy Company, iHub enables seamless data and application connectivity across value streams; ensuring faster delivery, reduced costs, and stronger self-reliance across the organisation replacing the need and reducing cost of third-party platforms.

Client

bp

bp

bp

Industry

SaaS and cloud services

SaaS and cloud services

SaaS and cloud services

Service

Branding, App design, Web Admin design

Branding, App design, Web Admin design

Branding, App design, Web Admin design

Collaborators

Individual

Individual

Individual

Multiple tools, One hub

Multiple tools, One hub

Multiple tools, One hub

iHub is built as bp’s central integration manager, constantly evolving to enhance efficiency and deliver value to product teams. The homepage design was made scalable to support quick version switches, highlight new advancements, provide direct access to all tools, and give new users a safe playground to test and experiment before setting up full workspaces.

Unified management: Integrations, APIs, Events, MCP

Unified management: Integrations, APIs, Events, MCP

Unified management: Integrations, APIs, Events, MCP

As a one-stop solution, iHub required consistency across multiple management systems: integrations, APIs, events, and MCP. The design emphasised on standardised views, statuses, and data structures, ensuring users could easily adapt to new features without a steep learning curve.


Streamlined flows and smarter deployments

Streamlined flows and smarter deployments

Streamlined flows and smarter deployments

Creating integrations and managing deployments was redesigned into a cohesive, hierarchical flow; covering integration setup, flow creation, and multi-environment deployment. Active and past deployments became easier to manage with quick-action tools. A key design addition was the smart scheduler, enabling backend teams to reduce infrastructure load and costs during off-peak times.

Advocating design value

Advocating design value

Advocating design value

Introducing design brought significant impact to the platform. Before-and-after screens clearly show how a single designer transformed the experience: reducing clicks, aligning visuals with bp’s design system, and building a scalable design foundation. The result was an intuitive, future-ready product experience.

Challenges & Edge cases

Challenges & Edge cases

Challenges & Edge cases

  • Designing for a technically complex platform required deep product immersion.

  • Without a dedicated BA, translating business requirements often became part of my role as a designer.

  • Multiple ways to perform the same action made prioritisation (effort vs. value vs. need) critical.

  • Each flow contained numerous edge cases, requiring careful consideration in the design process.

The Impact

The Impact

The Impact

  • Reduced integration costs for BP by over 80%.

  • Replaced MuleSoft, saving millions in licensing fees.

  • Designed 100+ screens across key modules within just 6–8 months.

If you found this project interesting, take a look at my other case studies —

Create a free website with Framer, the website builder loved by startups, designers and agencies.