Maralaut Portfolio

MOBAPRO PC · B2B SALES ANALYTICS

MobaPro PC

From quick mobile checks to deeper sales analysis.

MobaPro is a sales analytics platform that helps merchants monitor store performance using transaction data from connected payment devices. As the product grew, sales and marketing teams needed more than quick mobile monitoring. They needed a larger workspace to compare stores, analyze detailed performance, and export data for reporting. MobaPro PC extends the existing product into a desktop experience designed for deeper business analysis.

MY ROLE

UX/UI Designer, Sole Designer

PERIOD

Dec 2024 - Present

PLATFORM

Desktop Web

RESPONSIBILITIES

Requirements, Information Architecture, UI Design, Prototyping, Developer Handoff, Design QA

MOBAPRO PC

DESKTOP EXPANSION

MobaPro PC

TOTAL SALES

¥1,240,000

TRANSACTIONS

1,284

Store comparison

Last 30 days

Tokyo

Osaka

Fukuoka

LINEAGE

Mobile

WORKSPACE

Desktop

LINEAGE

The mobile experience established the core monitoring pattern that the desktop expansion builds upon.

TODAY

¥184,000

TXNS

142

BACKGROUND

MobaPro Was Built for Quick Sales Monitoring

MobaPro originally focused on mobile access, allowing store managers to check key sales metrics while working on-site or away from their desks. But as the product grew, the same experience became limiting for teams that needed to analyze larger amounts of data across multiple stores.

MOBILE

Quick Monitoring

Today's sales

Transactions

Average spend

Store performance

DESKTOP

Deeper Analysis

Compare multiple stores

Analyze longer periods

View richer datasets

Export business data

Quick Monitoring → Deeper Analysis

The challenge was not simply making the mobile interface bigger. It was redesigning the experience around deeper analysis.

The Mobile Experience Wasn't Built for Deep Analysis

Mobile worked well for quick sales checks, but corporate teams had different needs when analyzing performance across stores.

PROBLEM 01

Comparing Multiple Stores Was Difficult

Mobile worked for one location, but several stores required more space and clearer data relationships.

3+ STORES needed to be compared side by side

PROBLEM 02

Teams Needed More Detailed Data

Teams needed when sales happened, what customers purchased, location comparison, payment methods.

PROBLEM 03

Data Needed to Leave the Dashboard

Data needed for reports, presentations and analysis; filtering and downloads.

Designing for Analysis, Not Just Monitoring

Three bold cards: 01 COMPARE-Enable users to compare performance across three or more stores from one dashboard. 02 ANALYZE-Provide detailed metrics, multiple time views, and flexible filtering without overwhelming users. 03 EXPORT-Make sales information easy to download and reuse for reporting and business planning.

COMPARE

Enable users to compare performance across three or more stores from one dashboard.

ANALYZE

Provide detailed metrics, multiple time views, and flexible filtering without overwhelming users.

EXPORT

Make sales information easy to download and reuse for reporting and business planning.

The goal was to bring more information to desktop without simply adding more complexity.

A Wider Dashboard for the Bigger Picture

I redesigned the dashboard around the additional space available on desktop, allowing users to understand multiple performance indicators without moving between separate screens.

MobaPro PC dashboard

OVERVIEW FIRST

TOTAL SALES

+12.4%

¥1,240,000

TRANSACTIONS

+8.1%

1,284

AVERAGE SPEND

+4.2%

¥960

STORE COMPARISON

3 stores

Tokyo +12%

Tokyo

Osaka

Fukuoka

PAYMENT RANKING

4 methods

Card 68%

Card

Cash

DESIGN PRINCIPLE / Overview first. Details when needed.

Compare Stores Without Switching Screens

One of the biggest opportunities on desktop was making multi-store comparison easier. Users select the stores they want to analyze, choose a time period, and compare performance from the same dashboard.

Select Stores

Users choose the locations they want to compare, with enough space to understand which stores are included.

Tokyo

Osaka

Fukuoka

Choose Time Period

Users can switch between hourly, daily, monthly, and custom date ranges without leaving the comparison view.

30d

Custom

Compare Performance

The dashboard shows how each store is performing relative to the others, with clear totals and variance.

TOKYO

¥420,000

OSAKA

¥380,000

FUKUOKA

¥440,000

Investigate Details

From the comparison view, users can drill into transaction-level data, product performance, and payment behavior.

Details

CSV

Metric callout: 3+ STORES / Can be compared from a single desktop workspace.

From Overview to Detailed Analysis

Instead of showing every piece of information at the same level, I structured the dashboard so users could move progressively from high-level performance to detailed business data.

UNDERSTAND

Total sales, Overall performance, Key KPIs.

TOTAL

¥1.24M

TXNS

1,284

COMPARE

Stores, Time periods, Sales patterns.

Tokyo

Osaka

INVESTIGATE

Transactions, Average spending, Products, Payment behavior.

AVG SPEND

¥960

PAYMENTS

4 methods

2×2 UI visual grid

TRANSACTION COUNT

1,284

Peak activity between 18:00 and 20:00.

AVERAGE SPEND PER CUSTOMER

¥960

Higher spend on weekends and holidays.

TOP-SELLING MENU ITEMS

12 items

Combo A

Combo B

Drink

Top items are stable across the selected stores.

MOST USED PAYMENT METHODS

4 methods

Card

Cash

Card remains the dominant payment choice.

Different Questions Need Different Time Views

Business performance looks different depending on the time scale. Instead of forcing users into one fixed chart, I introduced multiple ways to analyze performance over time.

HOURLY

Understand peak sales periods

Identify when sales spike and when staffing should be adjusted.

18:00

19:00

DAILY

Compare day-to-day performance

Compare weekday versus weekend performance across stores.

Mon

Tue

MONTHLY

Identify longer-term trends

Spot seasonal changes and year-over-year performance shifts.

Jan

Feb

ADVANCED DATE FILTERING

Investigate specific reporting periods using custom date ranges.

Custom

30d

CSV EXPORT

Take selected sales data into reporting, presentations, or further analysis.

CSV

PDF

Turn Dashboard Data Into Reports

Analysis does not always end inside MobaPro. Sales and marketing teams often need the same information for internal reports, presentations, and further analysis, so the PC experience supports CSV export directly from the dashboard.

Dashboard

Start with the desktop workspace and select the stores, time period, and metrics to analyze.

Tokyo

Osaka

Filter Data

Apply filters for time, store, and payment method before exporting.

30d

Card

Export CSV

Download the filtered dataset for reuse in reports, presentations, and further analysis.

CSV

PDF

Business Report

Use the exported data to build internal reports, presentations, and planning materials.

Report

Deck

From Sales Dashboard to Business Platform

As MobaPro evolved, the desktop experience expanded beyond sales monitoring into a broader platform for product, customer, marketing, and store analysis.

PRODUCT

Product performance, Frequently Bought Together

Merchants can analyze item-level performance and identify bundles that drive higher average spend.

Combo A

Drink

CUSTOMER

Customer profiles, Demographic analysis, Visit behavior

Customer data helps teams understand loyalty, repeat visits, and demographic trends across locations.

Profile

Loyalty

MARKETING

Campaign performance, Web coupons, Promotional management

Teams can measure campaign lift, manage promotions, and create targeted offers directly from the platform.

Coupon

Campaign

INTELLIGENCE

Store rankings, Performance insights, AI-supported suggestions

The platform surfaces operational insights and recommendations to help merchants improve store performance.

Ranking

Connecting Analytics With Action

MobaPro does not only help merchants understand what is happening. Premium features allow them to act on those insights. Web Coupon enables merchants to create, schedule, and manage digital promotions directly from the platform.

Coupon List

Review active, scheduled, and archived campaigns from one place.

Active

Scheduled

Create Coupon

Define offer type, discount rules, and redemption conditions.

10%

Configure Campaign

Schedule timing, audience targeting, and redemption limits.

Date

Audience

Review & Publish

Review the offer summary before publishing it to customers.

Review

Publish

Supporting a Growing Subscription Product

As premium capabilities were introduced, I also designed the subscription experience so merchants could select a plan and activate additional features directly from MobaPro.

SELECT PLAN

Compare Basic, Standard, and Premium capabilities.

Basic

Standard

AGREE TO TERMS

Review billing details and subscription terms before activation.

Terms

Billing

CONFIRM

Confirm the selected plan and activate premium capabilities.

Confirm

Activate

SUBSCRIPTION COMPLETE

The merchant receives confirmation and access to premium features.

Complete

Premium

After subscription, users receive confirmation and onboarding support from the MobaPro team.

A Fast, Requirement-Driven Design Process

Four stages: 01 UNDERSTAND-Aligned with stakeholders on business requirements, target users, key metrics, and required data views. 02 STRUCTURE-Defined how the existing mobile information architecture should expand into a desktop and multi-store experience. 03 EXPLORE-Because MobaPro already had an established visual language, I moved quickly into high-fidelity exploration while refining the information hierarchy. 04 DELIVER-Prepared developer-ready designs and supported implementation through design QA.

UNDERSTAND

Aligned with stakeholders on business requirements, target users, key metrics, and required data views.

Stakeholders

Metrics

STRUCTURE

Defined how the existing mobile information architecture should expand into a desktop and multi-store experience.

Mobile

Desktop

EXPLORE

Because MobaPro already had an established visual language, I moved quickly into high-fidelity exploration while refining the information hierarchy.

Figma

Hierarchy

DELIVER

Prepared developer-ready designs and supported implementation through design QA.

Specs

From Mobile Monitoring to a Desktop Workspace

MobaPro PC expanded the product from quick mobile monitoring into a more complete analytics workspace for teams managing multiple stores. Users can now compare locations, analyze richer datasets, switch between different time perspectives, and export information for reporting from one desktop experience.

OUTCOME 01

3+ STORES / Compare multiple locations from one dashboard

Users can compare performance across three or more stores without switching screens.

Tokyo

Osaka

OUTCOME 02

3 TIME VIEWS / Hourly / Daily / Monthly

Users can analyze performance over different time scales without being locked into a single view.

Hourly

Daily

OUTCOME 03

CSV EXPORT / Reuse business data outside MobaPro

Teams can export filtered data for reporting, presentations, and further analysis.

CSV

PDF

OUTCOME 04

ONE PLATFORM / Sales / Products / Customers / Campaigns / Promotions

The desktop experience expanded into a broader business intelligence platform.

Sales

Products

MobaPro Continued to Grow

Present these clearly as overall MobaPro product growth, never causally attributed to the PC redesign. Three strong clean metric cards: ¥79,200 / MONTH / Current subscription revenue; +312.5% / Growth from ¥19,200 / month; 9 CLIENTS / 5 Basic / 4 Standard.

CURRENT REVENUE

¥79,200 / MONTH

Current subscription revenue across all active merchants.

GROWTH

+312.5%

Growth from ¥19,200 / month.

CLIENTS

9 CLIENTS

5 Basic / 4 Standard.

Alongside the continued development of its mobile and PC experiences, MobaPro grew into a recurring B2B subscription product.

What I Learned

Designing MobaPro PC taught me that desktop design is not simply about putting more information on a larger screen. The real challenge was deciding what deserved more space, what users needed to compare, and how detailed data could remain understandable as the product continued to grow.

DESIGN FOR DECISIONS

Structure data around what users need to understand and act on.

USE PROGRESSIVE DETAIL

Start with the big picture and reveal complexity when users need it.

DESIGN FOR SCALE

Build patterns that can support new metrics, features, and business requirements over time.

Final visual

MOBAPRO PC

DEEPER ANALYSIS

MobaPro PC

TOTAL SALES

¥1,240,000