Frontend Engineer with 6+ years of experience and an MFA in Design & Technology from Parsons. Bridges design and engineering — translating ambiguous requirements and design intent into pixel-perfect, accessible React UI on enterprise-scale platforms. Integrates AI-assisted development workflows (Claude Code, Cursor) into daily engineering practice.
Skills
Core Tech
Design
Engineering & Tooling
AI Development Tools
Selected Projects
Unified the design system and WCAG 2.1 AA accessibility standards across products built on different tech stacks.
Reverse-engineered and rebuilt two government platforms to match the National Park Service's design system.
Sole contributor for the platform's visual layer, built with a custom SCSS architecture.
Designed EZSIGN's Wizard onboarding flow and brand identity, including a logo later registered as a trademark.
Work Experience
Tradevan, Taipei, Taiwan
Senior Frontend Engineer
03/2023 – Present
- Served as the team's primary frontend and accessibility resource across multiple Taipei City Government digital platforms, translating Figma designs into pixel-perfect, WCAG 2.1 AA-compliant interfaces.
- Took ownership of two legacy frontend rebuilds with no formal specifications or documentation, reverse-engineering the National Park Service portal's UI conventions to independently reproduce its visual language and component patterns across separate codebases.
- Drove the Indigenous Carbon Sink ESG platform from 0-to-1 as the sole frontend contributor, owning the end-to-end design and frontend implementation—from defining the visual system (SCSS architecture, color system, and responsive layouts) to translating stakeholder requirements into production-ready code.
- Owned EZSIGN's visual identity and B2B onboarding experience — designing the logo, color system, and landing page from scratch, then simplifying a complex legal signing process into a guided, trust-focused Wizard flow.
Frontend Engineer
03/2021 – 03/2023
- Refactored the ECAR cross-agency vehicle platform and NSRRC research portal from legacy markup to a structured SCSS + ES6+ architecture, including complex multi-step forms with dynamic field logic and data-heavy admin interfaces.
- Established a unified visual style guide and component conventions for both platforms, working directly with internal users to align the UI with existing government workflows.
Full Stack Developer
03/2020 – 03/2021
- Built the APEWS portal — a centralized entry point providing unified access and consistent UI across 10+ independent IoT surveillance subsystems, with shared visual styles and cross-system SSO navigation.
- Built a real-time visualization dashboard integrating Google Maps API and Chart.js to display live container tracking states across 10+ interconnected subsystems, designed under a zero-scroll high-density layout constraint.
- Developed the data layer using Java Spring MVC and SQL to support high-concurrency container tracking, ensuring consistent state between backend and the frontend visualization layer.
Education
Parsons School of Design, New York, NY, USA
Master’s Degree in Design and Technology
2016 – 2018
- Focused on the intersection of design, technology, and human-centered interaction through studio-based projects.
- Selected for the Studying Abroad for Excellent Students Scholarship, sponsored by the Ministry of Education, Taiwan.
National Taipei University, Taipei, Taiwan
Bachelor’s Degree in Computer Science
2010 – 2014
- A significant part of the education involves practical experience through labs and projects, which are designed to enhance problem-solving skills.
EFREI – Engineering School of Digital Technologies, Paris, France
Exchange Program in Computer Science
2012 – 2013
- Awarded the MOE Scholarship for Excellent Students to Study Overseas (2012).
Blog
From Browser Rendering to React Reconciliation: The Complete UI Update Flow
Understand how a state update flows through React reconciliation, DOM updates, and browser rendering to finally become pixels on screen.
What Actually Triggers a React Re-render? From Props and State to Context and React.memo
Explore the three paths that trigger a React re-render—state, parent renders, and Context—and how React.memo actually works.
Are JavaScript Objects Really Copied? From References and Shallow Copies to React State
Understand references, shallow copies, and deep clones in JavaScript, and why reference equality matters for React state updates.
JavaScript Event Loop Explained: Understanding Microtasks and Macrotasks with a Stir-Fry Restaurant Analogy
Why the browser never freezes while waiting on a request, and how the call stack decides what runs first.
Debounce, Throttle, and Concurrency Control All Limit Flow, but They Guard Completely Different Lines
Understand how debounce, throttle, and concurrency control each guard a different trigger source, and how the Event Loop lets them coexist on a single thread.
Connect
Feel free to contact me at hsuanlin44@gmail.com