Galih Pranowo — Product Engineering Leader & AI Practitioner

About Me

Building at the intersection of
AI & Engineering

I'm an engineering leader with over a decade of experience spanning product design, frontend architecture, and AI integration. My journey began as a multimedia designer and developer — giving me a rare blend of creative sensibility and technical depth.

Today, I channel that background into two areas: revolutionizing how engineering teams operate through AI-driven workflows, and exploring how AI unlocks new creative possibilities in multimedia production.

🌐 gapra.dev

What others say

"He has a unique ability to balance speed and quality. What's remarkable is that even as a senior leader, he still has a strong builder mindset — never losing focus on execution and outcomes."

Burhanudin Hakim

Colleague at Mekari

Current Focus

Two dimensions of AI innovation

My work with AI spans both the professional and creative realms — each informing and enriching the other.

⚡

Work Focus

AI for Team Productivity

Transforming how engineering teams work by embedding AI into every stage of the software development lifecycle — from planning and coding to review and deployment. Building the infrastructure for human-AI collaboration at scale.

Model Context Protocol (MCP) AI Agents AI Skills SDLC Automation LLM Integration Developer Experience Codebase Optimization for LLMs

🎨

Personal Research

AI for Multimedia Production

Exploring the frontier where AI meets creative production — building workflows for AI-generated advertising content, synthetic imagery, and video generation at scale. Researching how generative AI reshapes the creative industry.

AI Image Generation AI Video Ad Creative Automation Generative Design Creative AI Workflows Visual Storytelling with AI

Career

Professional Journey

From individual contributor to engineering leader — a decade of building, scaling, and innovating.

Mekari

Engineering Manager

Jan 2022 – Present

Continued as VP Engineering of Qontak under Mekari following the acquisition — managed the technical synchronization post-acquisition, ensuring smooth product integration and alignment of engineering cultures
Spearheaded AI & SDLC transformation initiatives across the engineering org
Designed custom AI Agents and AI Skills for automated task execution
Built Model Context Protocol (MCP) systems enabling seamless developer-AI collaboration
Restructured repositories and codebases for LLM optimization
Evolved architecture from monolithic systems to modular, secure components

Qontak

VP of Engineering (Product & Frontend)

May 2021 – Feb 2022

Directed technical vision and product roadmap for the engineering organization
Led cross-functional engineering teams toward measurable business outcomes
Architected scalable frontend solutions that contributed to the Mekari acquisition

Qontak

Head of Design & Front-End Engineering

Aug 2018 – May 2021

Built and led both the product design and frontend engineering departments
Implemented UI/UX best practices using Vue, Vuex, Nuxt, and SCSS
Drove product roadmap strategy in close collaboration with stakeholders

Qontak

Lead Software Engineer & Product Manager

Sep 2017 – Aug 2018

Held a dual role as Lead Software Engineer and Product Manager — simultaneously owning technical execution and product direction
As Lead Engineer: led the frontend team, set technical standards, and drove code quality through architecture decisions and reviews
As Product Manager: defined product requirements, prioritized the roadmap, and coordinated delivery across design and engineering
Owned the full product pipeline — from UI/UX concept and visual design through to frontend implementation
Translated product requirements into wireframes, visual designs, and polished interactive interfaces

Qontak

Senior Front-End Engineer

Sep 2015 – Sep 2017

Owned the full design-to-implementation pipeline — from creating UI/UX designs to building the final frontend
Designed product interfaces using wireframing, prototyping, and visual design tools before handing off to implementation
Led frontend development of core product features, ensuring high performance and cross-browser compatibility
Established frontend architecture standards, component patterns, and coding conventions across the team
Mentored junior engineers on best practices in HTML, CSS, and JavaScript
Contributed to technical decision-making and code reviews to maintain quality and consistency

SoftwareSeni

Web Designer & Front-End Developer

Oct 2013 – Sep 2015

Created visual designs and implemented interactive UI using HTML/HTML5, CSS/SASS, and JavaScript
Built and customized WordPress themes and CodeIgniter (PHP framework) templates
Design tooling with Adobe Photoshop

Angetan.com

Web Designer & Developer

Feb 2013 – Oct 2013

Specialized in web design, front-end development, and multimedia design
Design using Adobe Photoshop, CorelDRAW, and Adobe Flash
Development with HTML/HTML5, CSS3, jQuery, and PHP

Gapra Art

UI/UX Designer & Front-End Developer

Oct 2012 – Aug 2019

Ran a freelance creative studio in parallel — handling UI/UX design and frontend development projects

Envato / Themeforest

Premium Theme Author

Sep 2010 – Aug 2013

Designed and commercialized premium web templates on the global Envato marketplace

Gapranimator

Multimedia Designer & Front-End Developer

Dec 2010 – Oct 2012

Freelance multimedia design and front-end development projects

IST AKPRIND

Multimedia Instructor

Jun 2009 – Jan 2013

Taught Flash animation and web programming to university students

Olta Grafika

Graphic Designer

Sep 2009 – Jan 2010

Advertising & printing design

Expertise

Skills & Capabilities

A unique combination of technical depth, creative background, and leadership experience.

🤖

AI & Automation

Designing and implementing AI systems that augment human productivity across teams and creative workflows.

Model Context Protocol AI Agents AI Skills LLM Integration Generative AI SDLC Automation Prompt Engineering AI Video Generation AI Image Generation Video-to-Video AI

🏗️

Product & Architecture

Building scalable SaaS platforms and evolving systems from monolithic to modern, maintainable architectures.

SaaS Architecture System Design Microservices Component Architecture Product Strategy Modular Systems Frontend Architecture Micro-frontend Security (CORS / CSP) API Design

👥

Team & Leadership

Scaled engineering teams from 4 to 50+ people, building cultures of ownership, quality, and execution.

Engineering Management Team Scaling Cross-functional Leadership Technical Roadmap Hiring & Mentoring OKRs & Delivery

⚙️

Frontend Engineering

Deep expertise in modern frontend ecosystems, with a designer's eye for UX and an engineer's focus on performance.

Vue.js / Nuxt.js JavaScript / TypeScript SCSS / CSS UI/UX Design Component Architecture Performance Optimization

Open Source

Projects & Packages

Open source design systems and MCP servers - built to make AI-assisted development faster and more consistent.

useVyre

AI-Friendly Design System

Featured Project

Visit useVyre

A design system built from the ground up for the AI era - structured to minimize hallucinations and maximize consistency when AI tools generate frontend code. Covers components, tokens, accessibility rules, and visual language in a format that AI agents can reliably consume.

Design System AI-Friendly Component Library Design Tokens Accessibility Frontend

📦

@gapra/nuxt-migration-mcp

v1.3.4

MCP Server for AI-assisted Nuxt 2/3 → 3/4 migration. Audits Options API, Vuex, asyncData, ESM compatibility, and generates Pinia & Composable code automatically.

MCP Server Nuxt 2→4 Vue Migration Pinia TypeScript

npm GitHub — MIT

🤖

@gapra/sdlc-planner-mcp

v1.5.0

Principal-level AI Agents & Skills for SDLC Planning via MCP. Includes Feature Architect, Tech Researcher, Security Auditor & DB Schema Designer agents with six executable planning skills.

MCP Server AI Agents SDLC Planning Claude TypeScript

npm GitHub — MIT

🎨

@gapra/vyre-skill

v0.4.0

AI skill for frontend design: 50+ UI styles, 177 palettes, 90+ UX rules. Works with Claude Code, Cursor, Windsurf, Copilot, and Codex to generate visually polished, accessible interfaces.

AI Skill Design System Color Palettes UX Rules Accessibility

npm — MIT

⚛️

@usevyre/react

npm

useVyre component library for React - AI-friendly, token-based UI components built for consistency and accessibility out of the box.

React Component Library Design Tokens Accessibility TypeScript

npm — MIT

💚

@usevyre/vue

npm

useVyre component library for Vue - AI-friendly, token-based UI components bringing the useVyre design system to the Vue ecosystem.

Vue.js Component Library Design Tokens Accessibility TypeScript

npm — MIT

🔌

@usevyre/mcp-server

npm

MCP Server for the useVyre design system - exposes component specs, tokens, and UX rules as AI-consumable context for Claude Code, Cursor, and other AI coding tools.

MCP Server Design System AI Context Claude Code TypeScript

npm — MIT

Product Engineering Leader & AI Practitioner

Building at the intersection of AI & Engineering

Two dimensions of AI innovation

AI for Team Productivity

AI for Multimedia Production

Professional Journey

Skills & Capabilities

AI & Automation

Product & Architecture

Team & Leadership

Frontend Engineering

Projects & Packages

Published Works

Product Engineering
Leader & AI Practitioner

Building at the intersection of
AI & Engineering