教學Tutorial

canvas, 基礎, 教學Tutorial

【互動網頁程式教學】活用GUI Object與繼承概念，完成Canvas物件導向的滑鼠拖曳互動

利用GUI Object的概念，快速畫出多個物件，利用canvas物件導向概念加上事件偵測，讓滑鼠位置與物件互動，達成亮度的提示以及拖曳物件。

2022 年 6 月 16 日

Shader, 基礎, 教學Tutorial

五月社群聚（下）：張文瀚教你用數學作畫 GLSL fragment shader

第二次的 Creative Coding 社群聚，我們邀請到了聲音藝術家吳秉聖，以及 Team9 技術長、黑洞創造前端工程師及國立清華大學藝術學院的兼任教師張文瀚，下集由張文瀚介紹如何用數學作畫：fragment shader 的入門與應用。

繼續閱讀

2022 年 6 月 2 日

Vue.js, 基礎, 教學Tutorial

【Vue.js入門】一小時學會 Vue.component，完成動態飯店房間清單

我們會從 Vue.js 基本概念開始講起，非常適合剛開始接觸 Vue 的朋友們，接著我們用 Vue component 實作一個動態的飯店編輯頁面，你會學到：Vue.js 基本概念、Vue.js 語法指令及深入操作 Vue.component。

繼續閱讀

2022 年 5 月 17 日

p5.js, 教學Tutorial

【p5.js創作教學】Sweet Trap 甜蜜陷阱

生成式藝術迷人的地方就在於它的程式邏輯、它的數學藝術呈現，有秩序卻又充滿了隨機。吳哲宇的＜甜蜜陷阱＞便是這樣有機的創作作品。此文帶大家一步步從 sin 波慢慢建構出目眩神迷的 p5.js 創作。

繼續閱讀

2022 年 4 月 25 日

p5.js, 教學Tutorial

【p5.js創作教學】Coral Carnival 珊瑚嘉年華

藝術創作的有趣之處在於它有無數可能與千萬種解讀，閱讀吳哲宇在創作＜珊瑚嘉年華＞這件作品時的逐步調整，以及一些大膽實驗的意外收穫，慢慢塑造成一件又一件的 p5.js 生成式藝術作品。

繼續閱讀

2022 年 4 月 7 日

p5.js, 基礎, 教學Tutorial

【p5.js創作教學】鳥與電線桿

利用p5.js創作一點都不難！跟著老闆直播，利用簡單的random、class和參數概念，完成童趣的都市景觀《鳥與電線桿》。

繼續閱讀

2022 年 3 月 24 日

基礎, 教學Tutorial

【互動網頁程式教學】用 GSAP 製作直播互動動態效果

本篇教學帶大家使用 vue.js, vue-cli, gsap 製作模擬 facebook 手機版的直播畫面，連結視訊鏡頭中使用者的畫面，並加上留言區塊以及可以點擊的表情符號等功能。跟著老闆一起，動態網頁製作好簡單。

繼續閱讀

2022 年 3 月 10 日

合作推廣, 教學Tutorial

【合作推廣】 AWS帶你在雲端飛

相信大家對於亞馬遜都不陌生吧？就是當你看到海外的酷東西，對錢錢說聲抱歉我需要這個然後點開下單的那個網站，過幾天帶著微笑A到Z的包裹就會出現在你家門外，裡面裝著化成快樂形狀的錢錢。除此之外，你聽過亞馬遜的雲端系統Amazon Web Services (AWS) 嗎？「下單我會，但你說的雲端系統是什麼呢？」

繼續閱讀