liuchiawei
@liuchiawei
Public Skills
code-refactoring-tech-debt
by liuchiawei
"You are a technical debt expert specializing in identifying, quantifying, and prioritizing technical debt in software projects. Analyze the codebase to uncover debt, assess its impact, and create acti"
murakami-style-writing
by liuchiawei
Generates or revises prose in the style of Haruki Murakami (村上春樹): short sentences, rhythm, mundane details, first-person detached narrator, loneliness and memory, unexpected similes. Use when the user asks for Murakami-style writing, 村上春樹風格, or to write like Murakami.
frontend-developer
by liuchiawei
Build React components, implement responsive layouts, and handle
rag-implementation
by liuchiawei
Build Retrieval-Augmented Generation (RAG) systems for LLM applications with vector databases and semantic search. Use when implementing knowledge-grounded AI, building document Q&A systems, or integrating LLMs with external knowledge bases.
frontend-patterns
by liuchiawei
Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.
error-diagnostics-error-trace
by liuchiawei
"You are an error tracking and observability expert specializing in implementing comprehensive error monitoring solutions. Set up error tracking systems, configure alerts, implement structured logging,"
backend-dev-guidelines
by liuchiawei
Opinionated backend development standards for Node.js + Express + TypeScript microservices. Covers layered architecture, BaseController pattern, dependency injection, Prisma repositories, Zod validation, unifiedConfig, Sentry error tracking, async safety, and testing discipline.
google-3d-tiles-r3f
by liuchiawei
Builds a 3D world using Google Maps Photorealistic 3D Tiles API with Three.js and React Three Fiber (R3F), including ECEF-to-ENU coordinate correction for a flat local coordinate system. Use when integrating Google 3D Tiles, Google Earth tiles, 3d-tiles-renderer, R3F map scenes, or when correcting 座標系 (coordinate systems) from ECEF to ENU for camera, physics, or audio positioning.
react-ui-patterns
by liuchiawei
Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states.
mediapipe-usage
by liuchiawei
Provides guidance for Google MediaPipe Pose Landmarker on web using @mediapipe/tasks-vision. Covers setup, landmark indices, running modes, and real-time video patterns. Use when working with MediaPipe, pose detection, body landmarks, or @mediapipe/tasks-vision.
code-review-ai-ai-review
by liuchiawei
"You are an expert AI-powered code review specialist combining automated static analysis, intelligent pattern recognition, and modern DevOps practices. Leverage AI tools (GitHub Copilot, Qodo, GPT-5, C"
threejs-skills
by liuchiawei
"Three.js skills for creating 3D elements and interactive experiences"
ui-ux-pro-max
by liuchiawei
"UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 9 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient. Integrations: shadcn/ui MCP for component search and examples."
frontend-dev-guidelines
by liuchiawei
Opinionated frontend development standards for modern React + TypeScript applications. Covers Suspense-first data fetching, lazy loading, feature-based architecture, MUI v7 styling, TanStack Router, performance optimization, and strict TypeScript practices.
screenshots
by liuchiawei
"Generate marketing screenshots of your app using Playwright. Use when the user wants to create screenshots for Product Hunt, social media, landing pages, or documentation."
mobile-design
by liuchiawei
Mobile-first design and engineering doctrine for iOS and Android apps. Covers touch interaction, performance, platform conventions, offline behavior, and mobile-specific decision-making. Teaches principles and constraints, not fixed layouts. Use for React Native, Flutter, or native mobile apps.
error-diagnostics-smart-debug
by liuchiawei
"Use when working with error diagnostics smart debug"
neon-postgres
by liuchiawei
"Expert patterns for Neon serverless Postgres, branching, connection pooling, and Prisma/Drizzle integration Use when: neon database, serverless postgres, database branching, neon postgres, postgres serverless."
page-cro
by liuchiawei
Analyze and optimize individual pages for conversion performance. Use when the user wants to improve conversion rates, diagnose why a page is underperforming, or increase the effectiveness of marketing pages (homepage, landing pages, pricing, feature pages, or blog posts). This skill focuses on diagnosis, prioritization, and testable recommendations— not blind optimization.
copywriting
by liuchiawei
Use this skill when writing, rewriting, or improving marketing copy for any page (homepage, landing page, pricing, feature, product, or about page). This skill produces clear, compelling, and testable copy while enforcing alignment, honesty, and conversion best practices.
clean-code
by liuchiawei
Pragmatic coding standards - concise, direct, no over-engineering, no unnecessary comments
code-reviewer
by liuchiawei
Elite code review expert specializing in modern AI-powered code
marketing-ideas
by liuchiawei
Provide proven marketing strategies and growth ideas for SaaS and software products, prioritized using a marketing feasibility scoring system.
next-intl-app-router
by liuchiawei
Configures and uses next-intl for Next.js App Router with locale-based routing. Use when adding or changing i18n, locale routing, translations, next-intl plugin, middleware/proxy, or message files in Next.js App Router projects.