ROAMmerchant

Lead designer for the launch of Ingenico's new self-service management portal

Role

Lead Product Designer

Company

Ingenico Group

Platforms

Web

Areas

Research, strategy, design

Team

1 PD, 1 PM, 1 FE, 1 BE

Industries

FinTech

Date

2015

Background

ROAMmerchant is a self-service management portal that gives merchants real-time access to manage terminals, monitor transactions, and use a built-in virtual terminal, all from one centralized platform. Whether you're a small business owner, restaurant franchisee, or direct selling consultant, ROAMmerchant makes it easy to run your business efficiently and independently.


The portal is designed to be user-friendly and feature-rich, enabling merchants to board sub-merchants, customize receipts, issue refunds, export and analyze transaction data, and more. With a focus on flexibility, visibility, and control, ROAMmerchant empowers users to manage their day-to-day operations with greater ease and confidence.

My role

As the sole product designer at Ingenico Group, I led the end-to-end design strategy across Ingenico’s suite of payment solutions, including ROAMmerchant. I worked closely with product managers and stakeholders to translate business goals and merchant feedback into intuitive, goal-driven user experiences. Through UX research and design best practices, I crafted branded, responsive interfaces that worked seamlessly across platforms.

I collaborated directly with developers to ensure smooth handoff and consistency throughout implementation. I also led all client-facing branding efforts, including the creation of Ingenico’s white-label solution, and defined a scalable design and delivery process to support rapid customization for enterprise clients.

Challenge

While the existing version of ROAMmerchant was functional, it had become outdated both visually and in terms of user experience. The interface no longer aligned with Ingenico Group’s updated brand guidelines, and the overall UX lacked the simplicity, flexibility, and clarity that modern merchants expect. ROAMmerchant needed more than just a visual refresh. It required a strategic redesign that would transform the platform into a robust, feature-rich, and intuitive experience.

Alongside these improvements, a key business opportunity surfaced: the need for a white-label solution that would allow clients to easily customize the portal with their own branding. However, the current architecture did not support this level of flexibility, making it difficult to scale. The challenge was to modernize the experience, align it with brand standards, and build a customizable platform that meets both merchant expectations and business goals.

Solution

We set out to create and launch a new version of ROAMmerchant, a redesigned portal focused on delivering a cleaner, more intuitive experience without compromising the robustness of the original platform.

Key project goals included:

  • Simplify and modernize the UI. Redesign the interface with a streamlined, user-friendly layout that aligns with Ingenico’s updated branding and visual guidelines.

  • Enable white-label flexibility. Build in the ability for clients to easily customize the portal with their own branding. This included designing configurable components and creating a white-label process that could be clearly communicated and efficiently implemented.

  • Preserve core functionality while modernizing the UX. Maintain the features that users rely on, while improving usability with updated interaction patterns, a more efficient task flow, and a purpose-driven experience optimized for speed, clarity, and scalability.

The result would be a more powerful, adaptable platform that delivers real value to both Ingenico and its clients.

User research

To inform the redesign of ROAMmerchant, my PM and I adopted a Lean UX approach grounded in both historical insights and current user assumptions. We gathered qualitative user data through multiple channels and used it to define clear problem statements. Feature requests were tracked and communicated through project managers, while business and user requirements were shaped collaboratively with key stakeholders, including support and product teams.


We also conducted a detailed analysis of our customer database to better understand the type and size of our client base. This helped inform design priorities and user goals. In addition, I referenced quantitative metrics captured from the previous version of ROAMmerchant, using tools like Crashlytics to surface behavioral trends. This included data on average time on page, exit rates, unique pageviews, event triggers, and in-app search terms. These insights allowed us to identify pain points and understand which features were most used and valued by our users.


Using a combination of this data, I created user personas to guide the design process. For ROAMmerchant, our primary focus was on the target merchant, the ideal customer profile. These personas helped ensure that design decisions were rooted in real user needs and business objectives, ultimately leading to a more focused and effective user experience.

An example of one of our user personas

An example of one of our user personas

An example of one of our user personas

Design process

Ideation & design exploration

With a strong foundation of user insights and clearly defined business goals, I entered the ideation phase focused on turning our research into a clear, actionable design strategy. I followed a complete UI/UX process, including brainstorming sessions, user flows, wireframes, interactive prototypes, and polished high-fidelity designs. Grounded in our merchant persona, I began wireframing key flows across the platform, exploring different layouts, information architectures, and conceptual features. ROAMmerchant is a large and complex system, so my goal was to reduce visual and cognitive clutter while delivering a seamless, intuitive experience from start to finish.


I created and iterated on many wireframes, validating ideas with stakeholders and refining based on feedback. The process was highly collaborative, ensuring alignment across design, product, and engineering. The following examples represent just a small sample of the many wireframe directions explored. Ultimately, we landed on a design that balanced usability with functionality and reflected the priorities of both our users and the business.

Early wireframes with various concepts and use cases of the 'Recent Activity' section

Early wireframes with various concepts and use cases of the 'Recent Activity' section

Early wireframes with various concepts and use cases of the 'Recent Activity' section

Early wireframe of a 'cloud catalog' concept we wanted to introduce as a new feature

Early wireframe of a 'cloud catalog' concept we wanted to introduce as a new feature

Early wireframe of a 'cloud catalog' concept we wanted to introduce as a new feature

Wireframe of editing an item in the 'cloud catalog'.

Wireframe of editing an item in the 'cloud catalog'.

Wireframe of editing an item in the 'cloud catalog'.

Early design exploration

Early design exploration

Early design exploration

Visual & UX designs

The following images showcase a range of visual designs and user experiences developed throughout the ROAMmerchant redesign process. Some reflect final, released designs, while others represent early concepts and in-progress explorations. Together, these examples highlight key milestones, feature rollouts, and the iterative improvements made across multiple phases of the product lifecycle.


The UI was designed to be simple, elegant, and purpose-driven. Built as a responsive web application, it supports both merchant-facing functionality and white-label flexibility. The experience focuses on usability, brand alignment, and scalability, all while maintaining a streamlined and predictable user flow. Every visual decision was rooted in our core goals: to create a faster, more intuitive ROAMmerchant that empowers merchants and supports business growth.

Original design vs. new design

Original design vs. new design

Original design vs. new design

Video preview of the ROAMmerchant platform

Recent Activity. One of the most popular features. From here, merchants can find, filter, and take action on all transactions on their account

Recent Activity. One of the most popular features. From here, merchants can find, filter, and take action on all transactions on their account

Recent Activity. One of the most popular features. From here, merchants can find, filter, and take action on all transactions on their account

Sub-Merchants. From here the user can easily add or manage multiple sub-merchants

Sub-Merchants. From here the user can easily add or manage multiple sub-merchants

Sub-Merchants. From here the user can easily add or manage multiple sub-merchants

Edit Billing Information under My Account

Edit Billing Information under My Account

Edit Billing Information under My Account

One key design goal was to maintain consistency and clarity across the entire platform. This involved designing a cohesive set of UI components and patterns, including modals, pagination, text styles, pop-ups, input fields, navigation elements, buttons, and icons. Each element was carefully crafted to align with Ingenico Group’s branding guidelines while also supporting future customization. The components were built to be flexible and scalable, ensuring they could be easily adapted for white-labeled client versions without sacrificing usability or visual integrity.

The login screen. The primary brand logo, background image, and secondary logo are examples of parts of the ROAMmerchant platform that can be white-labeled

The login screen. The primary brand logo, background image, and secondary logo are examples of parts of the ROAMmerchant platform that can be white-labeled

The login screen. The primary brand logo, background image, and secondary logo are examples of parts of the ROAMmerchant platform that can be white-labeled

The Virtual Terminal. User metrics showed that merchants spend a majority of time on this feature. The Virtual Terminal provides users with a web-based interface to accept card and cash payments right from ROAMmerchant

The Virtual Terminal. User metrics showed that merchants spend a majority of time on this feature. The Virtual Terminal provides users with a web-based interface to accept card and cash payments right from ROAMmerchant

The Virtual Terminal. User metrics showed that merchants spend a majority of time on this feature. The Virtual Terminal provides users with a web-based interface to accept card and cash payments right from ROAMmerchant

Transaction history with a transaction selection in an expanded view

Transaction history with a transaction selection in an expanded view

Transaction history with a transaction selection in an expanded view

From here, the user can edit and easily customize their receipt settings

From here, the user can edit and easily customize their receipt settings

From here, the user can edit and easily customize their receipt settings

An example of a line graph report based on your transaction history

An example of a line graph report based on your transaction history

An example of a line graph report based on your transaction history

The Advanced Search modal. This is one way to customize advanced search filters to find exactly what users want

The Advanced Search modal. This is one way to customize advanced search filters to find exactly what users want

The Advanced Search modal. This is one way to customize advanced search filters to find exactly what users want

Another Advanced Search modal concept

Another Advanced Search modal concept

Another Advanced Search modal concept

Concepts of graph reports based on daily revenue or daily transactions

Concepts of graph reports based on daily revenue or daily transactions

Concepts of graph reports based on daily revenue or daily transactions

More graph report concepts

More graph report concepts

More graph report concepts

White-label solution

One of the key design goals was to create a completely new white-label process. The objective was to make it easy and efficient for clients to customize the portal with their own branding, including colors, logos, and images. This required designing and documenting a streamlined process that could be clearly communicated across customers, as well as Ingenico Group’s product, design, and engineering teams. The result was a scalable system that balanced flexibility with consistency.

Example of a white-labeled ROAMmerchant solution. Customizable components include primary and secondary colors for buttons and backgrounds elements, background images and headers, and primary and secondary logos

Example of a white-labeled ROAMmerchant solution. Customizable components include primary and secondary colors for buttons and backgrounds elements, background images and headers, and primary and secondary logos

Example of a white-labeled ROAMmerchant solution. Customizable components include primary and secondary colors for buttons and backgrounds elements, background images and headers, and primary and secondary logos

Another example of a custom white-labeled ROAMmerchant solution

Another example of a custom white-labeled ROAMmerchant solution

Another example of a custom white-labeled ROAMmerchant solution

White-labeled Recent Activity

White-labeled Recent Activity

White-labeled Recent Activity

White-label specs

White-label specs

White-label specs

Example of a white-labeled sign-in screen

Example of a white-labeled sign-in screen

Example of a white-labeled sign-in screen

White-labeled Recent Activity screen

White-labeled Recent Activity screen

White-labeled Recent Activity screen

Results

The launch of the new ROAMmerchant was a major success for Ingenico Group and the merchants we serve. We delivered a significantly improved product experience, designed with a clear focus on simplicity, flexibility, and efficiency. The platform was modernized, streamlined, and fully aligned with Ingenico’s updated branding and style guidelines.

The redesigned experience resonated with users, leading to increased merchant adoption and stronger retention. The implementation of a scalable white-label system added meaningful business value, enabling clients to easily brand and deploy their own versions of the platform. By meeting all project objectives, ROAMmerchant is now positioned as a forward-looking solution built to evolve with the market and support long-term growth.