FECT — AI customs & trade portal
FECT is the flagship product of Rudasoft (now Astra Technology) — an AI-integrated portal for cross-border trade that brings customs operations into one place for 500+ import-export enterprises. At its heart is an AI trade consultant that handles everything from HS-code and tariff lookups to rules-of-origin and legal questions, wrapped around six modules: Q&A, Origin, Inventory, Clearance, Track and Express.
- Role
- UI/UX Designer — covering product, content & motion solo
- Timeline
- 4 weeks · 2024
- Team
- Solo design · VN dev team · Korean BOD
- Scope
- Marketing portal + FectQ AI chatbot + design system
By August 2024 the FECT product worked — 500+ enterprise users — but its landing didn't. A generic page converted at just 3.2%, bounced 68% of visitors and held attention for 23 seconds. With a Series A raise and a Vietnam expansion ahead, the company needed a marketing portal that told the story and qualified leads — with a brand-new AI chatbot, FectQ, built in. The catch: four weeks, zero marketing / pricing / feature documentation, and a Korean board referencing a dozen unrelated sites with no settled direction — and no PM, BA, marketing or motion designer to lean on.
Before any screen, I mapped how exporters actually move through customs — the documents, the hand-offs, the moments things break. In customs, one wrong HS code or a missing certificate stalls a shipment, so the research had to be precise.
- Designed for multiple user flows — Seller, Buyer and Admin — plus a dedicated responsive experience for the Buyer.
- Mapped the end-to-end journey across all six FECT modules (Q&A, Origin, Inventory, Clearance, Track, Express).
- Ran usability sessions and behaviour tracking to locate friction — the document flow was the biggest drop-off.
- Built an analytics framework of 15+ KPIs (funnels, cohort retention, feature adoption) so every decision was evidence-led.
- Tore down 12 customs-software landing pages to learn what actually converts in the category.
- Wrote the content-requirements doc the company didn't have — then got the CEO to supply expert customs copy via a translator.
- Reframed a regulation-first product around the user's task, not the bureaucracy.
I designed a calm, information-dense interface that carries a lot without feeling heavy — plus the 'fect' brand (the iridescent cube) so a compliance product still reads modern and trustworthy.
- High-fidelity UI for the Portal, Admin and Certificate-of-Origin / Clearance flows.
- A restrained visual language: clear hierarchy, generous spacing, status-driven colour for a data-heavy domain.
- Designed the 'fect' identity and applied it consistently across web and mobile.
- Guided, step-by-step flows with in-context help that cut the support burden.
As product owner I set the roadmap by business impact and technical feasibility, and coordinated a 12-person cross-functional team across four core systems.
- Owned the product lifecycle across 4 core systems generating $500K+ ARR.
- Prioritised by revenue potential, retention and feasibility; tracked it all in Jira, Notion and Figma.
- Led a design-system standardisation initiative across 3 product lines.
I vibe-coded the Portal from Figma into a live front-end myself — turning the tokenised design system into the running site at fect.vn.
- Vibe-coded and shipped the FECT Portal front-end (fect.vn).
- Translated design tokens into code components for one-to-one consistency.
- Bridged design and engineering daily, closing the gap between intent and implementation.
- Handed engineering comprehensive component specs, reference links and detailed motion specs — citing specific animation references — for a faithful build.
- 01
Discover
Shadowed how exporters actually file customs — interviews, support logs and behaviour data — to find exactly where shipments stall.
- 02
Define
Reframed six scattered modules into one coherent product and set the KPI framework that would judge every decision.
- 03
Systemise
Built the tokenised design system so the Portal, Admin and CO flows all spoke one visual language.
- 04
Design & build
Designed the high-fidelity flows, then vibe-coded the Portal front-end live at fect.vn.
Treat the board as users, too
The endless approval loop was really a research gap. I studied the Korean board's design culture and a dozen Korean sites, found the shared aesthetic (vibrant, dynamic, youthful) and designed toward it — turning subjective debate into alignment.
Two design systems, on purpose
The product design system didn't fit a vibrant marketing landing, so I spun up a second, simplified system for the landing — keeping product consistency while meeting the board's aesthetic, fast.
Skip hi-fi wireframes
With four weeks and no content, I prototyped straight on the design system instead of wireframing — running design and CEO-supplied content in parallel to hit the deadline.
One UI, switchable real / demo data
Missing real assets could have blocked the build. A switchable real/demo mode with an identical interface let the page ship now and swap in real content later.
Ship hero motion now, hire a specialist for v2
With no motion designer and a hard deadline, I spec'd the animations myself and agreed with the board to keep the hero motion as-is — while advocating to bring in a dedicated motion designer for the next release.
- ✦Document completion rate 68% → 90%
- ✦Customer activation 12 days → 4 days; CSAT 7.2 → 8.9
- ✦Support tickets −40% (~$20K/yr saved) via in-app guidance
- ✦Design system cut development time ~30% and lifted UI consistency 6.2 → 8.8
- ✦$500K+ ARR across 4 core systems
The biggest lesson wasn't visual — it was that stakeholders are users too. Researching the board's design culture turned an endless approval loop into alignment. And with no product, marketing or motion role in place, I had to stretch across all of them without dropping the thread — the breadth I think a modern product designer should have.