Local evidence search. No AI or command execution.
02 / WORK
work / records
Portfolio statements supplied by the owner. Outcomes are source claims, not independent analytics verification.
01PelanaPersonal Finance App2026+
An iPhone finance app that connects spending, budgets and goals with an AI companion and idle adventure.
Role
Designed and built Pelana, from the original research and prototype to the current iOS app. The implementation uses React Native, Expo and TypeScript, local encrypted storage, and RevenueCat for memberships.
Deliverables
iPhone finance app · Reviewable AI money-action flows · Expense, income, transfer, budget and goal interfaces · Onboarding and membership · Idle-adventure and reward experiences · Character and brand artwork · Landing, legal and support website
Tools
Design and development
Figma
Notion
Codex
Xcode
GitHub
Native app · language
TypeScript
Native app · frameworks and libraries
React Native
Expo
React
Expo Router
React Navigation
Zustand
Reanimated
React Native Skia
Native app · storage and services
SQLite
RevenueCat
PostHog
Local SQLite-based storage. Experimental model adapters are not presented as shipped functionality.
Website · language
TypeScript
Website · frameworks and services
Next.js
React
Supabase
Resend
Vercel
Supabase supported historical waitlist persistence; the public waitlist form is retired. Support messages do not use Supabase.
Owner-attested design workflow tool; this does not establish a shipped runtime dependency.
Pelana began as a design study in making everyday financial habits more approachable. The current iPhone app combines a finance tracker, Pela AI companion and an idle adventure.
Challenge
Connect three experiences without compromising the clarity of financial actions. Money inputs, pending actions and saved transactions must remain explicit and reviewable.
Approach
I mapped user needs, prioritized the core flows and developed an MVP-ready prototype through research, illustration and usability testing.
System
Money remains the source of truth. Pela prepares structured actions for review, while the adventure translates financial engagement into XP, quests and rewards.
Research habits and motivation
Used interviews, surveys, competitor research, personas and journey mapping to understand the barriers to everyday financial tracking.
Prioritize the core experience
Developed flows and information architecture, using card sorting, How Might We questions and MoSCoW prioritization to define the prototype.
Design the product and characters
Progressed from sketches and wireframes to a Figma prototype, with an illustrated world, avatars, Pela and a shared visual system.
Test and iterate
Used usability feedback to refine the original prototype. The current app builds on that work with reviewable AI actions, local storage and an integrated financial and adventure state.
Build and release
Extend the original design study into the iPhone app: implement money-action flows, onboarding and membership, then complete QA and release preparation alongside the supporting website.
Design choices
Keep financial records authoritative; AI prepares actions for the user to review before saving.
Connect habits to quests and rewards without rewarding spending more money.
Keep Money, Pela and Adventure connected through shared financial state.
Reported outcomes
Released Pelana on the App Store.
Submitted the current app to RevenueCat Shipaton 2026.
The process artifacts below document the original design study; the demo above shows the current app.
A responsive website and visual system for an institutional investment platform in Southeast Asia.
Role
Led UI/UX and visual direction across Home, About, Careers, News, Investor Resources and Contact.
Deliverables
Six website section designs: Home, About, Careers, News, Investor Resources and Contact · Responsive system and reusable components · Hero concepts and fintech/data illustrations · NusaX identity and logo explorations · Investor-document experience
Tools
Design
Figma
LottieFiles
Spline
Development and workflow
Codex
Notion
Claude Code
Vercel
Development and workflow tools confirmed by the owner.
Brand identity, Shopify store, photography, and campaign content for a Singapore techwear label.
Role
Brand, product, Shopify, photo, video, and creative direction
Deliverables
Brand identity and tone · Apparel concepts, graphics, placements, colorways and specifications · Shopify storefront and product taxonomy · Class and loadout shopping flows · Photography and campaign video
Tools
Brand, commerce and production
Shopify
Figma
Claude Code
Codex
DaVinci Resolve
Photoshop
After Effects
Judge.me
LottieFiles
Spline
Documentation
Notion
Altermana needed a full brand and commerce foundation for modular techwear built around real-world movement, daily loadouts, and class-based gear discovery.
Challenge
The brand had to feel more like an equipment system than a simple apparel store while still staying clear enough for first-time buyers to shop and understand.
Approach
Pakago shaped the identity, Shopify experience, product story, photography, video, and AI-assisted production workflow around the Armory, loadouts, classes, and the Negative Zero drop.
System
The final system combines a tactical brand voice, Shopify commerce, product taxonomy, campaign media, Field Reports, and launch assets for a local Singaporean techwear brand.
Define the concept
Frame the audience, brand voice and RPG-inspired class and loadout concept.
Develop the range
Create identity, apparel graphics, placements, colorways and product specifications.
Shape the storefront
Connect shopping discovery, class and product understanding, and purchase flows.
Prepare the launch
Create photography, film and campaign assets for the brand and apparel range.
Reported outcomes
Built a complete ecommerce presence for a Singapore-born modular techwear label.
Turned product drops into a loadout system with classes, Armory browsing, and Field Reports.
Connected branding, store design, photo, video, and AI-assisted production into one launch system.
An AI feedback platform for founders to submit pitches, review reports, and improve their ideas.
Role
Lead UI/UX Designer and Creative Director
Deliverables
Landing page system · Pitch submission flow · Founder dashboard · AI committee and report screens · Pricing and plan pages · Progression and reward prototypes
Tools
Design and prototyping
Figma
Framer
Jitter
MagicPath
Notion
Current case-study workflow
Codex
Owner-confirmed current workflow; prototype screens do not establish a shipped backend.
Pitch Arcade had a functional MVP for AI-driven startup feedback, but the experience needed stronger clarity, trust, and polish.
Challenge
Founders needed to understand the product quickly, trust the system with sensitive ideas, and feel motivated to iterate.
Approach
Pakago structured five core flows: landing, submission, dashboard, report, and pricing, then wrapped them in a retro-future interface language.
System
The final design connects AI committee feedback, founder metrics, report insights, pricing, and playful progression into one coherent product experience.
Frame the MVP
Clarify the proposition and five core journeys for founders.
Map the journeys
Connect submission, dashboard, reports and pricing into a coherent flow.
Build the visual system
Apply a consistent retro-future interface language across the product screens.
Prototype progression
Explore rewards, progression and post-submission states through prototypes; these do not establish a shipped progression backend.
Reported outcomes
Clarified the platform story in the first screen.
Made pitch submission feel lighter and more guided.
Built a sharper visual system around trust and replay value.
A shared visual and interaction system across Seedworld’s responsive website and in-game interfaces.
Role
Led website UX/UI from wireframes to final screens and designed in-game menus, HUDs, inventories and rewards with game designers and engineers.
Deliverables
Responsive main and Creative Mode websites · HUD and menus · Inventory, rewards and progression interfaces · Character and mode selection · Shared components, icons and visual rules
Tools
Project tools
Figma
Claude
Current case-study workflow
Codex
Notion
Current documentation and presentation workflow; not a claim that these tools were used during the original project.
Seedworld needed a consistent experience from learning about the game on the web to playing and creating inside it.
Challenge
The website had to explain the path to play, while game interfaces needed to support deeper inventory, building and progression tasks.
Approach
I combined stakeholder and player research with journey mapping, navigation testing and iterative prototypes across both surfaces.
System
Shared components, iconography and visual rules connect the main website, Creative Mode, character and mode selection, gameplay HUD and in-game menus.
Align on player needs
Combined stakeholder discussions, user research, competitor review and community feedback to identify the path from discovery to play.
Structure the navigation
Mapped journeys and flows, using information architecture, card sorting and tree testing to check navigation and define the core features.
Design across web and game
Developed responsive website layouts alongside HUDs, character and mode selection, inventories, maps and research screens, supported by common components and brand assets.
Refine and hand off
Iterated through usability feedback with game designers and engineers, then prepared modular components for handoff and future seasonal content.
Design choices
Give the main game and Creative Mode distinct entry points within one visual system.
Keep build controls and gameplay information visible without competing with the world.
Reuse patterns across inventory, map, research and rewards to support future updates.
Reported outcomes
+38% increase in website session duration.
+26% improvement in new-player onboarding completion.
+30% higher interaction with in-game menus.
Faster seasonal interface expansion through modular UI.
Figures reported in the original Seedworld case study; measurement windows and baselines were not provided.
A modular battle-pass interface for tracking progression, claiming rewards and upgrading a pass.
Role
Led the battle-pass redesign, UX research, interface design and supporting asset illustration.
Deliverables
Battle-pass interface · Reward and quest flows · Premium and level-purchase dialogs · Mid- and high-fidelity screens · Motion and illustration assets
Tools
Project tools
Figma
Current case-study workflow
Codex
Notion
Current documentation and presentation workflow; not a claim that these tools were used during the original project.
Warden’s Ascent needed a reusable battle-pass system that could support both ongoing progression and limited-time events.
Challenge
Players needed to see their level, remaining time, reward eligibility and upgrade options without losing the game’s visual character.
Approach
I reviewed battle-pass patterns and organized the flow around progression, reward claims and upgrades before developing the visual treatment.
System
Warden’s Chronicle provides the evergreen track; Cempress’s Emporium provides the event track. Both use the same interaction structure with distinct themes.
Research the patterns
Compared battle-pass systems and identified the information players need to track progress and reward value.
Establish the hierarchy
Built mid-fidelity wireframes around level, time remaining, free and premium tracks, claims and purchase decisions.
Develop two themes
Adapted the shared structure for the evergreen Warden’s Chronicle and event-based Cempress’s Emporium.
Resolve the flows
Developed high-fidelity reward, quest, premium purchase and level purchase screens, with motion and illustrative assets.
Design choices
Keep level, timer and progression visible above the reward tracks.
Distinguish free and premium rewards while providing a clear Claim All action.
Reuse the layout for quests, premium upgrades and level-purchase dialogs.
Reported outcomes
Delivered two themed pass experiences within one reusable interface system.
Produced wireframes, high-fidelity flows and animated reward presentations.
Retention and monetization were design goals; the source does not report measured changes.
A gaming wallet prototype that connects game discovery, account connection and asset purchases with less blockchain jargon.
Role
Led research, collaborative ideation, information architecture, prototyping and moderated usability testing.
Deliverables
Wallet prototype · Game discovery, connection and purchase flows · Mobile interface screens · Design system
Tools
Project tools
Figma
Current case-study workflow
Codex
Notion
Current documentation and presentation workflow; not a claim that these tools were used during the original project.
PLAY3R explored how a crypto gaming wallet could help players discover games and start playing without unnecessary setup or terminology.
Challenge
The experience had to support different levels of familiarity with blockchain while giving players control over automated and manual actions.
Approach
I moved from interviews and competitive research through flows, wireframes and a linked prototype, then ran one moderated testing iteration with three types of gamers.
System
Game discovery, connection, collections and asset purchase share a consistent interface. Blockchain details appear when they are relevant to the action.
Understand the players
Combined interviews, competitive analysis, personas and journey mapping across three gamer types. The source does not state a participant count.
Organize the flow
Used user flows, information architecture and card sorting to connect game discovery, wallet setup and purchasing.
Prototype the experience
Progressed from low-fidelity layouts to high-fidelity screens and a linked Figma prototype, supported by a shared design system.
Test and refine
Ran one moderated usability iteration. Feedback favored fewer blockchain-specific steps and a choice between automated and manual actions; further flow testing was recommended.
Design choices
Lead with games and the path to play instead of technical wallet terminology.
Offer automated and manual options so players retain control.
Connect discovery, game connection and asset purchasing in one prototype flow.
Reported outcomes
Participants completed the tested flow in one usability iteration, with favorable qualitative feedback.
The study recommended further testing across other flows.
The original portfolio reports roughly 40% fewer transaction steps.
The 40% figure is an existing portfolio claim; its baseline and measurement details are not supplied in the Framer case study.
Owner-attested design workflow tool; this does not establish a shipped runtime dependency.
Product interface design for an AI workspace, spanning cloud storage, conversational search and agent workflows.
Workspace structure
Organize cloud files, recent activity and shared spaces into a readable workspace.
Conversational search
Present image results and written responses alongside workspace content.
Agent configuration
Define interfaces for missions, configuration and agent assignment.
Execution visibility
Present status, progress, reports and cost. This breakdown describes the supplied design artifacts, not an undocumented research or testing chronology.
Cloud storage
A workspace for organizing files, reviewing recent activity and managing shared spaces.
AI search
Conversational search with image results and written responses, presented alongside workspace content.
Agents
Interfaces for configuring missions, assigning agents and reviewing execution status, progress and cost.
I'm a product and visual designer with more than a decade of experience across Jakarta and Singapore. My background spans graphic design, UI/UX and visual storytelling, with work across fintech, commerce, gaming, Web3 and AI products.
Pakago
Pakago brings my product design and visual practice together. I work across interfaces, brand identities, design systems and interactive experiences, carrying an idea from its early structure through to the details people see and use.
Beyond the interface
I started working in graphic design in 2012 and moved into UI/UX and human-centered design in 2014. Gaming is a personal interest as well as part of my work, and my creative practice also includes music composition, video and photography.
Capabilities
Product Strategy
Product direction is demonstrated through Zarklab's expanding AI workspace, Mintology B2B journeys and PLAY3R research. Evidence is stronger for defining experiences than for owning business strategy or quantified commercial outcomes.
UX Architecture
A sustained strength across complex storage, wallet, marketplace and onboarding structures. Zarklab, PLAY3R and personalized commerce show a repeated ability to organize journeys, states and information.
Visual Craft
The most consistently demonstrated strength: distinctive visual direction across luxury commerce, gaming, brand identities and AI products. Maison 21G, Seedworld, Portvale and Altermana show range as well as continuity.
Interaction & Prototyping
Strong repeated evidence in perfume customization, wallet setup and recovery, and conversational AI workflows. Prototypes and interface states make complex journeys understandable and tangible.
Delivery & Collaboration
Mintable design QA and handoff, Seedify collaboration with engineers and game designers, and Julius Baer internal-tooling work demonstrate cross-functional delivery across product, design and engineering.
Design to Build
A growing practical strength in HTML/CSS, responsive interfaces and AI-assisted design-to-build iteration with Codex and Claude Code. Pelana and Zarklab support this direction; independent full-stack engineering depth has not been established.
Education / languages
BINUS International University, Art & Design Studies, 2008 - 2011
English: Professional working proficiency
Bahasa Indonesia: Native
Working practice
Clarify constraints and priorities early.
Make tradeoffs and design rationale visible.
Consolidate feedback into actionable decisions.
Keep files, components and handoff materials organized.
Collaborate with founders and engineers through implementation.
Planning, AI-assisted development and creative exploration. Hermes Agent supports research workflows; this is not the Hermes JavaScript engine.
Product implementation
TypeScript
React Native
Expo
Next.js
Xcode
Applied in Pelana's native app and supporting website. The case study separates native, web and service stacks.
Career timeline
Nov 2025 - Jun 2026
Zarklab
Senior Product Designer / Full-time
Designed onboarding, navigation, workspace discovery and upgrade paths for AI storage. Shaped chat for searching, organizing and generating files, with AI-assisted UI exploration, design-to-build iteration and animated launch storytelling.
Jan 2025 - May 2025
Julius Baer
Senior UX/UI Designer / Contract
Designed internal SaaS pages, dashboards, developer-tool marketing and employee-logistics experiences. Created visual systems, onboarding guides, decks and nontechnical communications.
Designed for Seedworld, staking dashboards and Seedhub launchpad across desktop and mobile, collaborating with blockchain engineers, developers and game designers.
Jan 2023 - Feb 2024
RPG Republic
Lead UX/UI Designer / Freelance / concurrent remote
Designed PLAY3R for noncrypto-native gamers, using research, brand and community feedback to refine onboarding, wallet setup, recovery, tooltips and responsive flows.
May 2021 - Mar 2023
Mintable
Lead UI/UX Designer / Full-time
Designed Mintable 2.0 desktop and mobile journeys and Mintology B2B NFT experiences, including ImmutableX and XRP work, research, prototypes, design QA and handoff.
Sep 2019 - Apr 2021
Maison 21G
Lead UI/UX Designer / Full-time
Designed luxury commerce and virtual perfume customization across desktop and mobile. Research, journey mapping and design QA supported discovery, personalization and checkout.
Apr 2019 - Aug 2019
PolicyPal
Senior UI/UX Designer / Contract
Insurance and fintech comprehension.
Feb 2018 - Mar 2019
Happi
Senior UI/UX & Graphic Designer
Consumer product UX and visual design.
Mar 2014 - Dec 2017
Telunjuk
UI/UX & Visual Designer
Commerce interfaces, video and campaign production.
Oct 2012 - Sep 2013
MatchMove Games
UI and Graphic Designer
Game interfaces and graphic design.
Dates overlap; this is not an exclusive employment sequence.
04 / SERVICES
services / evidence
UI/UX & Product Design
Interfaces, prototypes, design systems, and product flows for apps, games, commerce, AI tools, and digital platforms.
Evidence
Brand & Visual Direction
Identity systems, art direction, illustration, campaign visuals, and premium visual languages for brands that need a stronger presence.
Evidence
Game & Interactive Design
Game UX, progression systems, wallet flows, creator surfaces, collectibles, and game interactions for teams building interactive products.
Evidence
AI & Digital Systems
AI-enabled products, digital platforms, dashboards, automation flows, and content systems that turn complex ideas into usable digital experiences.
Evidence
05 / ARCHIVE
archive / directory
All 72 visible archive records are included in the structured archive. Expand any title to read its description here. Optional asset links are clearly marked when they leave terminal mode.
Browse archive titles +
Zarklab : Cloud Storage +
UIUX
A workspace for organizing files, reviewing recent activity and managing shared spaces.
Readable HTML, Markdown and JSON, generated from the same portfolio records. Public resources provide the reading path, project evidence and professional profile for people and agents.
Source confidence is unscored. Evidence links show the basis for each claim. Read-only static resources and browser-local keyword search. No autonomous agent, model, remote query endpoint or write API. Rates are agreed directly through Contra. Current availability, certifications and testimonials are not specified. Ask Adri; do not infer.
/ Search · Tab Move focus · Enter Open / run search · Esc Close menu
Figma
Notion
Codex
Xcode
GitHub
TypeScript
React Native
Expo
React
Expo Router
React Navigation
Zustand
Reanimated
React Native Skia
SQLite
RevenueCat
PostHog
Next.js
Supabase
Resend
Vercel
LottieFiles
Spline
Claude Code
Shopify
DaVinci Resolve
Photoshop
After Effects
Judge.me
Framer
Jitter
MagicPath
Claude
Adobe Illustrator
Paper
Blender
Rive
Lottie
Adobe Premiere Pro
ComfyUI
Hermes Agent