張祐禎 Yu-Chen Chang

Frontend Engineer

I graduated from National Cheng Kung University with a Bachelor's degree in computer science and information engineering. I’m a self-motivated programmer and designer who is passionate about exploring new trends in both fields through self-study. I’ve worked as a front-end engineer for Chi Jen(智見), a Technology Co., Ltd in Taiwan, for over two years.

     

[email protected]

Skill

Frontend Skills


  • Javascript(ES6+), Typescript
  • Vue2/ Vue 3 / Vuex / Vue-router / Vue-CLI / Vite
  • HTML (Pug)CSS (SASS / SCSS), Tailwind
  • AJAX (Axios)
  • Phaser.js, Echart.js, GSAP,  Bootstrap
  • Webpack, AWS S3, and Heroku deployment
  • Website Performance Optimization, RWD

Other Dev Tools


  • Experience in Python
  • Familiar with Git / GitHub / Gitlab / Gitflow
  • Experience in Cypress, Storybook for testing

Design Tools


  • Familiar with Photoshop
  • Familiar with Illustrator
  • Experience in Figma / Adobe XD
  • Experience in After Effect / Premiere

Collaboration Tools


  • Agile Development 
  • JIRA / Trello 
  • Notion
  • Slack  / Discord

Language


  • Mandarin (Native)
  • English (Advanced, TOEIC 875/990)

Experience

Frontend Engineer

Chi Jen(智見) Technology Co., Ltd   •  March. 2021 - Present

I've worked for Chi Jen(智見) for over two years since I graduated and retired from military service. I participated in the development of the company's new product, Vivipic, from 0 to 1.

Vivipic is an online graphic design tool for e-commerce, offering thousands of customizable templates for various industries and online events. Users can apply these templates with just one click to create stunning graphics and enhance their online presence.  

My Achievement:

Contributions as Frontend Engineer /

  • Built the project's foundation and established coding style rules and Git flow to ensure consistent development.
  • Established the editor's basic page/layer structure and implemented sophisticated features, including layer selection/deselection, alignment, snapline/guideline system, temporary storage for undo/redo, and complex mathematical operations for grouping and coordinate conversion.
  • Implemented manual image background removal with Canvas. 
  • Created a semi-automation i18n tool for Internationalization with Google Sheet API and Python. 
  • Optimized editor performance by over 50% with Vue dev tools and self-made debugging tools. 
  • Upgraded the project from Vue 2 to Vue 3, reducing the JS heap size by approximately 40% and improving layer control speed by over 50%. 
  • Developed the mobile web version of Vivipic and solved cross-browser issues.



Frontend Engineer | Game Art Designer

CityChaser Studio  •  Oct. 2019 - Present

I worked for Taiwan's independent game studio CityChaser for over one year, from 2019 to 2020. I participated in the development of the studio's first product,《Kyronus 開拓者》, from scratch to a large award-winning game project.

《Kyronus 開拓者》 is a cross-platform, location-based simulation mobile game that aims to promote Taiwan’s local culture and historical sites. Players can collect those famous historical buildings' resources and then construct them on their own planets with their mobile phones. 

Studio Achievement:

  • Won 3rd prize in Mobile Game Development Group of Vision Get Wild Award 2020
  • Shortlisted in the first stage of U-Start Innovation and Entrepreneurship Program 2020
  • Shortlisted in the first stage of Bahamut ACG Contest 2020
  • Shortlisted in the final stage of Tourism Innovation & Tech Awards 2020
  • Crowdfunded NT $80,000(approx.) dollar from 100+ sponsors in Zeczec.

Contributions as Frontend Engineer /

  • Constructed the user-facing interface and game feature with Vue.js and Phaser.js
    • Mall / Diary / Baggage / Characteristic Building Info Modal / Custom Character Dialog System, etc.
  • Communicated with backend engineers to determine the server response format
  • Connected backend API with Axios
  • Fast extract certain types of images (svg, png) from the design team shared folder with Python script.
  • Produced CSS sprites with Texture Packer to optimize game performance

Contributions as Game Art Designer/

  • Designed 13 historical sites in Taiwan in an isometric and minimalist style.
    • National Palace Museum, Cristal Church, The British Consulate At Takow, Twin Hearts Stone Weir, etc
  • Designed 17 custom characters for crowdfunding sponsors in a minimalist style. 
  • Designed the user interface of the announcement system and the isometric building News Center.


Part-time Web Assistant

Miin Wu School of Computing, National Cheng Kung University  •   Arp. 2020 - Mat 2020

I worked as a short-term part-time web assistant at Miin Wu School of Computing to handle the problem of their website independently.

Contribution /

  • Developed reusable R-page(school-provided software) components and construct RWD website with HTML, CSS, and Javascript (jQuery)
  • Designed school's poster and illustrations on the website with Illustrator/ Photoshop.

Education

National Cheng Kung University

B.S in Computer Science and Information Engineering  •  Sep. 2016 – 2020

Project

Vivipic

career project

Vivipic is an online graphic design tool for e-commerce, offering thousands of customizable templates for various industries and online events. Users can apply these templates with just one click to create stunning graphics and enhance their online presence. 


Project Skill /

  • Frontend framework | Vue3 ( Vuex/Vue-router)
  • Project Build | Vue-CLI, Webpack 
  • HTML Preprocessor | Pug 
  • CSS Preprocessor | SCSS 
  • JavaScript Library | Tiptap


TeleCan Web

freelance project 

My friend and I worked freelance for TeleCan Team to develop the demo website.  I was responsible for all the frontend part tasks independently, including UI to HTML, visualization, and AWS S3 static website deployment.


Project Skill /

  • Frontend framework | Vue.js ( Vuex/Vue-router)
  • Project Build | Vue-CLI, Webpack 
  • HTML Preprocessor | Pug 
  • CSS Preprocessor | SCSS 
  • JavaScript Library | GSAP, Echart.js


Portfolio Website 2020

personal project

This website is my personal project to demo some of my projects and artworks.

Project Skill /

  • Frontend framework | Vue.js ( Vuex/Vue-router)
  • Project Build | Vue-CLI,
  • HTML Preprocessor | Pug 
  • CSS Preprocessor | SCSS 
  • JavaScript Library | GSAP, Vanilla-Tilt

Simple Physic Simulator [Canvas]

personal practice work

It's a small practice to create a simple physic simulator with Canvas and Dat.GUI.

Project Skill /

  • HTML Preprocessor | Pug 
  • CSS Preprocessor | SCSS 
  • JavaScript Library | Canvas, Dat.GUI

Simple Snake Game [Canvas]

personal practice work

It's a small practice to develop a snake game with pure Javascript and Canvas.

Project Skill /

  • Frontend Framework | Vue 
  • HTML Preprocessor | Pug
  • CSS Preprocessor | SCSS 
  • JavaScript Library | Canvas