Jakarta · --:-- WIB
Open to the right next role · Jakarta, Indonesia

I design complex procurement that feels simple.

Hi, I'm Yoga Arya Nudatar, but everyone calls me Goy. I'm the Lead UI/UX Designer at Mbizmarket. For 5+ years I've worked on B2B and government e-procurement used by buyers, vendors and admins across Indonesia: first as a product manager, now leading the design team.

5+years at Mbizmarket
3user roles: buyer, vendor, admin
3regulations designed into the UI
4designers on my team
At a glance

The short version, for busy recruiters.

Current role

Lead UI/UX Designer

  • Mbizmarket (PT Brilliant Ecommerce Berjaya)
  • Since Feb 2024 · 5+ years at Mbiz
  • Based in Jakarta · on-site or hybrid
Strengths

Complex B2B products

  • Compliance-driven UX
  • Product thinking from 2.5 years as a PM
  • Leading a team of 4 designers
Toolkit

Figma + AI assistant

  • Figma, design tokens, prototyping
  • Claude Code as my design assistant
  • HTML/CSS prototypes, WCAG audits
Selected work

Four real cases. Real users.

Real problems from a live government e-procurement platform. Three are live, one is in pilot with selected agencies. Open any card for the full story.

Real case · In pilot 01 — OPEN QUOTATION

Fair, fast, audit-ready mini-competitions

A request-for-quotation and negotiation flow for government buyers, with the LKPP two-quote rule built right into the UI, so it can't be broken by accident.

End-to-end UXGovTechBuyer + Vendor
35 minto shortlist 10 quotes (was ±2 h)
88%pilot rounds met the 2-quote rule
Read case study →
Real case · Shipped 02 — ORDER ADDENDUM

Change a running order without cancelling it

Government buyers adjust quantities on a live PO, sellers just accept or decline, and the e-signed document writes itself, all within Perpres 46/2025.

Interaction designGovTechBuyer + Seller
340+addendums submitted
−35%POs cancelled to change qty
Read case study →
Real case · Shipped 03 — MBIZTRAVEL HOTELS

Flights and hotels, one business-trip record

A flight-only product rebuilt so government agencies can book, approve, invoice and prove hotel stays on the same platform, under one approval.

Design directionDesign QA3 portals
620+room nights since launch
30+QA issues caught before release
Read case study →
Real case · Shipped 04 — DOCUMENT MANAGER

Sharing deal documents without leaking them

Store, share and download procurement documents in one place, with consent on record and signed links that only open for the right people.

Privacy by designUX writingBuyer + Seller
5,200+documents shared
850+companies active in 6 months
Read case study →
Process

How I take a messy problem to shipped.

Five steps, every project. AI helps at each one, but each step ends with a decision that's mine to make.

Step 1 · Understand

Talk to the people who use it

I sit in on buyer and vendor calls, read support tickets, and go through the regulation line by line, before anyone opens Figma.

AI assistsGroups tickets by theme and turns the regulation into a checklist.My callWhich problem is worth solving first.
Step 2 · Map

Flow before pixels

Every role, every status, every unhappy path, mapped in FigJam. In procurement, the edge cases are the product.

AI assistsDrafts a long list of edge cases for me to cut down.My callWhat goes into v1 and what waits.
Step 3 · Design

Decide in Figma

Screens built on design tokens and real components, then critiqued by the team against the brief, not against taste.

AI assistsChecks copy, spacing and token use.My callLayout, hierarchy and every visual decision.
Step 4 · Test

Prototype, then watch people use it

Approved screens become a clickable HTML prototype. I walk 5 experienced internal users through it (support and ops staff who handle buyers and vendors every day) and note where they stop or hesitate.

AI assistsTurns Figma into a working prototype in hours, not days.My callWhat the test tells us to change.
Step 5 · Ship

Hand off with the why, then verify

Engineers get specs that explain the reason behind each rule. Before release, every page is checked against the design.

AI assistsMeasures every page with Playwright and flags visual drift.My callWhat's a bug and what's a trade-off we accept.
AI in my workflow

AI is my assistant. Every call is mine.

I use Claude Code every day, right in my terminal. It does the heavy lifting: prototypes, QA checks, repetitive production. The research questions, the flows, the visual decisions and what finally ships stay with me and my team.

Windows PowerShell
The assistant handles
  • Figma screens into clickable prototypes
  • Measuring spacing, fonts and colors on every page
  • First drafts: edge-case lists, ticket summaries, copy options
  • Repetitive production: token syncs, certificates, tutorial videos
I decide
  • Which problem we solve, and for whom
  • The flow, the rules and what's cut from v1
  • Every visual and interaction call
  • What's good enough to ship, and what isn't

Faster production, same standards. This portfolio too: Claude Code did the typing, I made the calls.

How I lead

A team that ships without waiting on me.

I lead 4 designers, each owning one side of the marketplace. My job is to set the bar, protect their focus, and get out of the way.

BuyerGovernment & corporate buyers1 designer
VendorSeller Center & small businesses1 designer
Admin & TravelBack-office and Mbiztravel1 designer
Design systemComponents, tokens, QA1 designer + me

How a feature moves

Usually 2 to 6 weeks. Most of it is design time.
  1. 01

    Intake

    PM brings the problem and the PRD. I check scope and regulation, then pick an owner.

  2. 02

    Brief

    One page: problem, users, rules, and how we'll know it worked. No brief, no Figma.

  3. 03

    Design time

    The bulk of the work. The designer owns it end to end, with one crit a week to stay on track.

  4. 04

    Review gate

    I sign off on the flow and edge cases before hi-fi, so nobody polishes the wrong screen.

  5. 05

    Handoff

    Walkthrough with PM and engineers. Specs explain the why. AI checks for visual drift.

A normal week

About 2 hours of rituals per designer. Everything else is maker time.
MonIntake · 30 minMaker time
TueNo design meetings
WedCrit · 45 minMaker time
ThuNo design meetings
Fri1:1 · 30 min every 2 weeksMaker time
Rule 01

I review, I don't redraw.

If I take the pen, the designer stops thinking. I ask questions until the fix is theirs.

Rule 02

Decisions are written down.

Every call goes in a decision log next to the frame, so nobody asks "why is it like this?" twice.

Rule 03

Critique the work, not the person.

Feedback always points back to the brief and the user. That keeps crit safe for juniors too.

~2 hof rituals per designer a week
2no-meeting days every week
2 daysmax wait for a design review
1designer grown from junior to mid
Side projects

Off the clock, still shipping.

What I build when nobody's handing me tickets: an app for my riding crew and my own cycling apparel brand.

Mini case study · Android app prototype

Bulakbalik CYC

Group rides where nobody gets left behind.

A ride app for my own cycling crew: start a group, pick a route, see everyone live on the map, then post the ride. I took it from Figma to a clickable prototype with Claude Code, and it's live for anyone to try.

  • Crew roles, not just members. Captain, Navigator, Documentation and Sweeper. Real group rides already work this way, so the app just gives it names.
  • I cut the distance alarms. Pinging people every time they fall behind felt like nagging on a chill ride. Simple manual signals won: Wait!, Flat tyre, Something's wrong.
  • Free to run. Sign-in uses an email code instead of SMS, so a community app doesn't pay for every login.
  • Unhappy paths first. Wrong code, no internet, lost signal, low battery, an empty lobby. Each one got its own screen.
95+screens & states
12sign-in edge cases
4crew roles
Try the live prototype ↗Best on desktop, with a screen list on the left.

It started as a Garmin watch app (a Connect IQ bike computer running in the simulator), then I went phone-first so the whole crew could join.

Brand · Apparel

Bulak Balik Cycling logoBulak Balik Cycling

My own cycling apparel brand. Playful and anti-race-team, made for kids on push bikes and the parents who ride with them. I do all of it: the logo, the graphics, the mockups, and a landing page with a 3D jersey you can flip and recolour.

Brand identityThree.js landing pageGraphic design
Visit the landing page ↗
Bulak Balik Cycling · Coming soonBulak Balik Cycling landing page with a 3D Rujak jersey
Experience

From product manager to design lead.

Five years at Mbizmarket, one domain, two hats. As a product manager I wrote the PRDs, and because I couldn't wait for a mockup, I designed the screens myself. In 2024 that habit became the job.

Feb 2024 – Present · 2 yrs 9 mosNow

Lead UI/UX Designer

Mbizmarket · Jakarta, on-site
  • Lead a team of 4 designers across the buyer, vendor and admin sides of the marketplace, with a light weekly rhythm (about 2 hours of rituals) that leaves the rest of the week for design.
  • Own the design system and the design review, and make the final call when Figma and production disagree.
  • Designed Open Quotation (now in pilot), shipped Order Addendum and Document Manager, and led design direction and QA for Mbiztravel Hotels, with procurement rules baked into the UI, not buried in a help page.
  • Brought AI in as the team's assistant: Claude Code for prototypes and automated visual QA, while design decisions stay with designers.
↑ PRDs became pixels · Feb 2024
Sep 2021 – Feb 2024 · 2 yrs 6 mos

Product Manager

Mbizmarket · South Jakarta
  • Wrote the PRDs. Turned procurement regulations and stakeholder wish-lists into requirements engineers could actually build.
  • Designed while I specced. My PRDs shipped with my own flows, wireframes and UI, so nobody had to guess what I meant.
  • Owned the launch. Took features from first idea to release with engineering, QA and the business team.
  • Learned the marketplace from every side: government buyers, vendors big and small, internal admins and partners.
2017 – 2021 · before Mbizmarket

Regulations, before they were screens

  • Graphic Designer · British Propolis, freelance · 2021
  • HSE Manager, NCICD coastal protection project · PT Wijaya Karya Beton Tbk · 2019–2021
  • Individual Consultant · Ministry of Public Works and Housing (PUPR) · 2017–2019

Four years of reading regulations, running audits and working with government teams. Same muscles I use to design compliance into a flow today.

Design

Product designInteraction designDesign systemsPrototypingAccessibility (WCAG)UX writing

Product

Product requirementsPrioritisationCompliance-driven UXRelease planningStakeholder management

Leadership

Team leadershipDesign reviewMentoringHandoff standards

Tools

FigmaFigJamHTML / CSSClaude CodeAI agents & automationPlaywrightAdobe CC

Languages

Indonesian (native)English (professional working)

Education

  • UI/UX DesignPurwadhika Digital Technology School · 2020
  • Bachelor's degreeUniversitas Diponegoro · 2017
Why a PM got the design keys

I didn't switch careers. I just stopped switching tabs.

01

I already knew the rules

Two and a half years of procurement rules, edge cases and approval chains. Now I design them straight into the flow.

02

I write the why, then draw the how

PRD on one screen, Figma on the other. Every design call comes with a business reason engineers can check.

03

I was already designing

My PRDs came with my own wireframes and UI. Moving into design just made the side hustle official.

About

Half product brain, half design hands.

I've spent five years in one of the trickiest corners of Indonesian tech: procurement for companies and government institutions. As a PM I learned why every rule and approval step exists. As a design lead, I make sure the person on the other side of the screen never has to think about them.

Good design here is rarely about bold visuals. It's flows that follow the rules, treat every vendor fairly (small businesses included), and make sense to people who'd rather get back to their actual job.

As a lead, I
  • Lead 4 designers across buyer, vendor, and admin teams
  • Run a weekly design crit and set handoff standards with engineering
  • Make the final call when Figma and production disagree
  • Hand engineers specs with the why, a habit from my PM years
  • Bring AI-assisted workflows into the design team
Outside work: I ride, I run my own cycling apparel brand, and I'm building a group-ride app for my crew, because a WhatsApp group just wasn't enough.