Bridging the Phygital Gap

Background

As a comprehensive sports venue management SaaS platform, Gelora has successfully digitized the booking process through its application and website ecosystem. However, to achieve the vision of a "Unified Sports Ecosystem," we recognized an obstacle called the Digital-Physical Gap—a barrier to physical interaction on-site.

Field dynamics often demand more instantaneous speed—such as walk-in players, on-site availability checks, and the need for rental extensions (extend) in the middle of an ongoing game. It is not uncommon for transactions to be conducted manually or through the "back-door," causing data fragmentation on the business management side. Venue operators must perform manual consolidation between actual field data and Gelora SaaS—an inefficiency that hinders business scalability.

To overcome these challenges, Gelora strategically collaborated with Bank BTN as a pioneer partner. This project is not merely the addition of a payment tool, but rather the integration of a Smart EDC as an extension of Gelora SaaS. This step was taken to eliminate user friction, standardize operations, and create a better ecosystem.

Observe: The "Walk-In" Friction

From observations, it was found that the existing digital system felt "analog" when dealing with on-site dynamics. There are three main anomalies that became pain points:

• The "Forced" Digital Flow: Users come to the cashier to book immediately. However, to make a booking, the operator asks them: "Please download the application first, create an account, and then book from there." This is a major barrier (friction) for users who are not yet familiar with Gelora. Or, for users who already have a Gelora account but haven't booked yet, the team has gathered and they want to enter the court immediately, but they must order online first, even though the cashier is only one step away.
• The Extension Hassle: Players who are currently playing and want to increase their rental duration must stop first and take their phones to book via the application. Some accept this, but others prefer going directly to the cashier. Clearly, the hassle exists.
• Operational Double-Entry: From the business side, venue operators must perform manual reconciliation between cash transactions at the cashier and the Gelora SaaS system at the end of the day—an inefficiency prone to human error.

Insight

The discovery phase provided us with a fundamental insight: For on-site booking cases, forcing users back into the application ecosystem when they are already at the venue—especially during an ongoing game—creates an awkward and often poor experience. Users feel they cannot find a quick and practical solution, thinking, "Wait, I have to use the app? Can't I just do it directly?"

After brainstorming, the team agreed that the EDC is the interface closest to the answer for this problem. By changing the function of the EDC from a mere payment tool into an Integrated Venue Management Tool, we can bring the power of Gelora SaaS directly into the hands of the operator at the edge of the field.

Jobs To Be Done (JTBD)

Next, we performed a mapping of fundamental needs using the JTBD framework to understand the core motivations of two personas:

1. The Walk-in Player
   • "When I arrive at the venue and see an empty court, I want to book and pay for it instantly with minimal steps, so that I can start playing immediately without administrative hassle."
   • "When I am in the middle of a match and notice the next slot is still available, I want to extend my booking quickly and easily, so that I can continue my game without any interruptions or pauses."
2. The Venue Operator
   • "When a customer makes a walk-in payment, I want the inventory and revenue data to update automatically in real-time, so that I can avoid manual data entry and minimize reconciliation errors."

Concept Model

Designing an integrated ecosystem concept model to solve the problem of data fragmentation.

• Existing Flow: User (Offline) -> Manual Payment -> Operator Input to SaaS to update/close schedule (Potential for Human Error).
• New Concept Flow: User (Offline) -> Operator Input on EDC -> Payment -> Real-time Data Sync to Gelora Cloud.

In this model, the Smart EDC acts as a "terminal" that allows the operator to:

1. Check field availability in real-time.
2. Select time slots (booking).
3. Process payments (Cashless/QRIS/Card).
4. Print rental receipts. All in one device, one flow.

User Flow: From Fragmentation to Seamlessness

To validate this concept, it is necessary to map the transformation of the user flow from the old fragmented system to the new integrated ecosystem via the EDC.

The Fragmented Legacy Flow (Existing)

In the previous flow, offline users faced an operational dilemma. If they didn't want to order through the app, operators had to go through a tedious manual process:

• Manual Booking: The operator opens the SaaS system and searches for the field and hours to be rented.
• Administrative Friction: The operator must have a permit, manually close online slots to prevent double booking, and record payments manually.
• Manual Reconciliation: At the end of the day, all manual payment data must be synchronized one by one with the daily SaaS data to get clean financial data for that day—a time-consuming process prone to errors. "Overtime again!"

The Streamlined EDC Flow

With the integration of Smart EDC, the workflow is significantly cut into one efficient linear path:

• Assisted Booking: When a user wants to book, the operator assists directly through the EDC device.
• All-in-One Terminal: Within one interface, the operator can select schedule slots, add retail items (such as drinks or snacks), and process cashless payments simultaneously.
• Auto-Sync: Transaction data is automatically synchronized to the central SaaS system, eliminating the need for manual reconciliation at the end of the day.

Design Strategy & Implementation

As a Product Designer, the main challenge was designing the interface (UI) for a small EDC screen that is often used in outdoor environments or less-than-ideal lighting. Therefore, it was crucial to know exactly what the EDC looks like and what operating system is used. The goal is for the designer to visualize and decide on visual forms that can be adapted to technical needs during development.

• Operating System: Android Ver. 12.0.0 ⬆ (meaning it likely uses popular frameworks like Flutter, Native, or React Native).
• Screen Type: LCD HD/IPS and Touch Panel.
• LCD Pixel Size: 720 * 1280 or 720 * 1440 (5 - 5.5 inch).

From the confirmed EDC specification information, the following strategic design decisions were made:

1. Ergonomics & Accessibility (The "Fat Finger" Rule): Because the EDC is held with one hand and operated with the thumb or index finger (often by an operator who is sweating), complex UI elements must be avoided.
   • Big Tap Targets: Buttons are made large and fill the screen width (full width) to minimize tapping errors.
   • High Contrast: Using high-contrast colors for readability under outdoor field sunlight.
2. Simplification of Flow : Trimming the regular booking flow. No complicated profile setups. Focus only on: Select Field > Select Time > Pay.
3. Business Value (Upselling Integration): Retail sales features (F&B) are inserted into the EDC. This allows players to buy drinks or merchandise directly at the cashier, thereby increasing the Average Revenue Per User (ARPU) for venue owners by capturing the "Captive Audience" Moment. Two main scenarios were mapped to maximize the user journey in this context:
   • The Post-Match Frictionless Purchase: Thirsty players after a match need speed. With the EDC, they can buy drinks directly at the edge of the field through the operator. No more separate queues at different cashiers, and all transactions are recorded in the same financial report.
   • The Spectator Experience: Sports venues are not just about players; there is often an ecosystem around them. Spectators or companions who are waiting can now easily order food or drinks while still enjoying the game. This transforms the waiting area into a new profit center for the venue owner.

Wireframes: Structural Efficiency

Before going into visual details, I designed wireframes with a focus on the Hierarchy of Information. Given the limited EDC screen, the screen structure is divided into three main zones:

• Status Bar & Navigation: Provides quick information regarding connectivity and the operator's position within the booking flow.
• Dynamic Workspace: An adaptive central area used for selecting schedule calendars, field durations, and managing retail (F&B) shopping lists.
• Primary Action Zone: The lower section of the screen, dominated by a large, primary Call-to-Action (CTA) button; this facilitates seamless payment execution without the need to search for button placements

High-Fidelity UI: Optimized for Action

The final visual design was translated into a clean yet highly functional interface, considering the technical aspects of the Android EDC device:

• Accessible Visual Components : I used large cards to represent time slots. Field status (Available, Occupied, or Booked) is distinguished through a high-contrast color palette so operators can identify field status in just one quick glance, even under direct sunlight.
• Streamlined Checkout Experience : The payment process is designed with clear steppers. When entering payment mode, the screen will focus on displaying a dominant QRIS code or scan instructions, minimizing unnecessary interaction and speeding up field queues.
• Unified Brand Identity : Although used on an EDC device, visual elements such as iconography and typography remain consistent with the Gelora digital ecosystem, providing a professional and trustworthy impression to users performing on-site transactions.

Measuring Success

To measure the success of this Smart EDC integration, we established several Key Performance Indicators (KPIs) divided into operational efficiency and business growth:

1. Operational Efficiency (The Operator's Side)
   • Reconciliation Time Reduction : Minimizing financial data reconciliation time from hours at the end of the day to zero, as synchronization occurs automatically in real-time.
   • Human Error Mitigation : Eliminating cash discrepancies between manual records and system data by 100%, ensuring "Clean Data" for all financial reports.
2. User Experience & Transactional Speed (The Player's Side)
   • Reduced Booking Time: Accelerating the walk-in booking process from an average of 3–5 minutes (previously requiring an app download) to under 1 minute through operator assistance via the EDC terminal.
   • Seamless Extension Rate : Increasing the percentage of players who extend their rental time, as the process no longer interrupts the flow of the game.
3. Business Growth (The Owner's Side)
   • Average Revenue Per User (ARPU) Increase : Enhancing revenue per visit through the integration of retail features (F&B), where players are more likely to make impulse purchases when offered directly courtside.
   • Revenue Leakage Prevention : Ensuring every transaction on the field is recorded digitally to prevent potential revenue loss (fraud) caused by unreported cash transactions.

Summary

This Smart EDC integration is not just a hardware update, but a strategic step for Gelora in closing the gap between the digital and physical worlds. With this ecosystem, we not only provide convenience for players but also provide peace of mind for venue owners through transparent and accurate data.