Creates highly automated design systems with cross-platform variable architecture.
Build scalable systems using Variables and Semantic Tokens.
Implement 1:1 dev handoff with Boolean logic and RWD breakpoints.
Introduce DesignOps to significantly reduce cross-team communication and technical debt.
Advanced
Photoshop
Produces high-conversion digital marketing and visual communication assets.
Execute high-quality compositing and color correction for cross-platform interfaces.
Utilize batch processing and compression for optimized digital assets.
Maintain highly iterative design files using non-destructive workflows.
Familiar
Lottie / UI Motion
Crafts lightweight interactions balancing visual motion with frontend performance.
Create fluid micro-interactions for Web and App interfaces.
Integrate animation specs ensuring zero impact on DOM rendering load.
Align JSON parameters with frontend developers for state-triggered controls.
Familiar
Illustrator
Constructs scalable vector UI components and brand graphics.
Design clean vector iconography systems and illustrations.
Build brand guidelines including swatches and reusable symbols.
Export clean, code-friendly SVGs for frontend component usage.
Familiar
Premiere Pro / AE
Produces fluid multimedia videos to support product demonstrations.
Plan storyboards, transition logic, and product promotional motion.
Incorporate Motion Graphics to strengthen visual storytelling.
Export optimized background videos for various digital devices and breakpoints.
Beginner
Rive
Utilizes state-machine logic to build real-time interactive UI animations.
Design advanced dynamic feedback based on State Machines.
Export minimal file sizes to meet strict Web/App performance requirements.
Experiment with trigger logic to enhance emotional connection in the UI.
Advanced
CMS Architecture
Customizes theme architecture, balancing dev performance and scalability.
Build lightweight system architecture and complex Custom Fields (ACF) logic.
Implement global variables ensuring alignment with the Design System.
Create modular page blocks ensuring seamless handover for client operations.
Advanced
Frontend Integration
Proficient in Box Model and Flex/Grid logic for responsive development.
Use global styles and modular thinking to rapidly deploy Landing Pages.
Manage DOM structure to optimize seamless switching across breakpoints.
Execute performance optimization strategies like lazy loading and asset compression.
Advanced
Webflow / Data-Driven
Builds responsive layouts and advanced interactions adhering to frontend standards.
Establish flexible CMS collections to implement data-driven page templates.
Precisely control HTML/CSS tags to ensure clean, bloat-free code output.
Connect Webhooks and APIs to achieve cross-system automated workflows.
Familiar
Bootstrap / CSS Architecture
Utilizes Sass for modular design, accurately reproducing UI interfaces.
Customize grid breakpoints and variables ensuring visual logic across screens.
Define CSS Variables aligning perfectly with Figma's Semantic Tokens.
Optimize dev handoff with the ability to discuss technical limits with senior RDs.
Familiar
E-commerce Optimization
Builds high-conversion e-commerce systems, optimizing user shopping experiences.
Utilize RWD to ensure smooth cross-device checkout flows.
Integrate marketing automation tools and configure conversion tracking.
Integrate third-party APIs and plugins to expand digital service capabilities.
Beginner
Data Tracking Integration
Configures tracking codes to establish quantitative data feedback loops.
Configure tracking events to gain insights into user behavior.
Ensure data collection logic aligns with commercial conversion goals.
Optimize page resources to improve Web Vitals performance.
Beginner
Version Control & Ops
Masters digital product deployment and basic system operations.
Understand domain configuration, DNS, and basic server operational logic.
Manage design component libraries as codebases with version iteration control.
Ensure system stability and performance optimization during live product updates.
Familiar
Customer Journey Map
Visualizes the entire service journey to accurately identify B2B/B2C pain points.
Map end-to-end (E2E) experience maps to pinpoint system friction points.
Deeply understand real user emotions under high-pressure or complex scenarios.
Translate pain points into product features with commercial value.
Familiar
User Mission Analysis
Translates complex business goals into clear design actions and priorities.
Break down abstract business needs into actionable technical specs for RDs.
Plan Sprint development priorities based on the value of core tasks.
Ensure solutions meet error-prevention and compliance requirements.
Advanced
Userflow Map
Plans multi-role operation paths to build intuitive system task flows.
Untangle cross-departmental approvals in multi-module B2B systems.
Utilize flowcharts to identify edge cases and logic breaks early.
Iterate rapidly with Wireframes to align cognitive understanding with stakeholders.
Advanced
Information Hierarchy & Logic
Untangles complex permission logic, enhancing readability for data-heavy UIs.
Deconstruct hardcore logic to build clear information tiers.
Transform data-heavy UIs into intuitive, decision-making dashboards.
Achieve perfect balance between professional info display and cognitive load.
Advanced
Product Blueprint
Builds highly scalable system blueprints to support future iterations.
Plan forward-looking architecture to reduce rework and refactoring risks.
Ensure seamless integration of new features without disrupting user habits.
Provide a shared product roadmap for design, dev, and business teams.
Familiar
Personas & Research
Uses research data to profile target users, guiding precise product decisions.
Extract core design insights from frontline observations or interviews.
Define technical familiarity and environmental constraints of the audience.
Combine quantitative and qualitative feedback to ensure solutions hit pain points.
My Journey
From human factors to tech-driven digital transformation
Hotel Front Desk Agent
@The Pier, Hong Kong
2021-2022
Overview
Job Description
Execution of daily check-in/out operational procedures
Reservation management and frontline client consultation
Fulfill instant guest needs and crisis management
Skills & Achievements
Cultivate instant problem-solving skills in high-pressure environments
Establish a mindset of cross-cultural communication and deep empathy
Develop acute observation skills for user emotions
Show Details
Turning Point
The hospitality industry gifted me with strong "empathy" and "human factors insight," but I realized my desire to create scalable systems. I began self-studying visual design and tech tools, transforming this passion for "experience" into the starting point of digital product design.
Graphic & Visual Designer
@In-well Ltd., Hong Kong
2022-2023
Overview
Job Description
Establish brand visual guidelines and high-conversion marketing assets
Execute cross-platform digital ads and product visual design
Integrate visual strategies to drive commercial sales performance
Skills & Achievements
Mastery in commercial visual communication and brand asset management
Translate marketing strategies precisely into concrete visual outputs
Lay a solid aesthetic foundation for future UI interface design
Show Details
Turning Point
This experience sharpened my aesthetic sensitivity, but pure visual presentation couldn't solve the fundamental pain points of "logic, interaction, and data flow" in products. To solve deeper business problems, I dove into frontend code and UI/UX architecture, officially advancing toward a Product Designer role.
Product Designer (Project Lead)
@Spotx Studio, Taipei
since 2023
Overview
Job Description
Lead 0 to 1 planning and design of complex B2B/SaaS systems
Build cross-platform design systems and implement DesignOps workflows
Communicate closely with engineering teams ensuring frontend tech alignment
Skills & Achievements
Independently delivered multiple high-complexity systems (medical, finance)
Leveraged a frontend mindset to dramatically cut dev costs and comms time
Established highly scalable architectures utilizing Semantic Tokens
Show Details
Highs & Challenges
As a strategic lead, my biggest advantage is "deconstructing products from both design and tech perspectives." I strive not just to deliver pretty mockups, but system-level solutions aligned with frontend logic, ensuring high engineering maintainability as the product scales commercially.
Media Project Lead
@TCOC, Taipei
since 2023
Overview
Job Description
Lead the team in large-scale brand redesigns and digital content production
Coordinate cross-departmental needs, streamlining workflows for design quality
Mentor team members technically and establish standardized collaboration guidelines
Optimized resource integration, successfully eliminating information gaps
Demonstrated cross-functional communication and conflict resolution
Show Details
Highs & Challenges
Transitioning from an executor to a manager, I learned how to build systematic guidelines to guide team output. By driving project tracking and resource transparency, we built a highly cohesive team. This deepened my practical understanding of Operations (Ops).
