網頁視覺特效最強必殺技大全：用 Three.js 與 Shader 圖說核心原理 x 閃避踩雷 x 創作指南（iThome鐵人賽系列書）【軟精裝】 1/e 蘇桓晨(Umas) 2024 博碩
找相似
$755

網頁視覺特效最強必殺技大全：用 Three.js 與 Shader 圖說核心原理 x 閃避踩雷 x 創作指南（iThome鐵人賽系列書）【軟精裝】 1/e 蘇桓晨(Umas) 2024 博碩

台灣樂天市場
搶購
訂單成立賺1%
下單享LINE POINTS點數
訂單成立賺1% 7 點
價格趨勢怎麼看？
設定到價通知
分類：
圖書文具 書籍/雜誌期刊 語言學習書籍
台灣樂天市場

台灣樂天市場

▐ 自2024/1/1 00:00起，台灣樂天市場「屈臣氏」將不贈送 LINE POINTS 點數 ▐ 自2023/2/1 00:00起，樂天Kobo電子書不贈送 LINE POINTS 點數，請會員多加留意。 ▐ LINE POINT點數回饋依照樂天提供扣除折價券(優惠券)、與運費後之最終金額進行計算。 ▐ 愛買與愛票網、a la sha（2023/8/1生效）、GAME休閒館（2023/8/1生效）、專品藥局（2023/8/1生效）等部分店家不參與全站加碼，請詳閱LINE Points 加碼店家清單:https://lin.ee/Y2CcVdk/rcfk ▐ 注意事項 (1)部分服務及店家不符合贈點資格，購買後將不贈送 LINE Points 點數，亦不得使用點數紅包，如：比漾廣場、神腦生活、MyCard、愛美麗福利社、展翔通訊、ezcook 美食廚房、葳豐數位商城、吉盈數位商城、森林巨人、包材中心、KABO佳麗寶家電批發、LuLuLu精品店、NewSTYLE新風尚潮流、0216零食會社、美寶家電、純米小鋪、LILY科技新櫃、登芳3C電子雜貨賣場、豐饌御鴨、鼎耀通訊、誠選3C、Smile、葳豐數位商城二店、米蘭寶、BoBo Outlet代購屋、楊家食品（2022/10/1生效）、樂天Kobo電子書（2023/2/1生效）、屈臣氏（2024/1/1生效）等，請詳閱LINE Points 加碼店家清單。 (2)需透過LINE購物前往台灣樂天市場，並在同一瀏覽器於24小時內結帳，才享有 LINE Points 回饋。 (3)若購買之訂單（包含預購商品）未符合樂天市場 45 天內完成訂單出貨及結帳，則不符合贈點資格。 (4)如使用App、或中途瀏覽比價網、回饋網、Google等其他網頁、或由網頁版(電腦版/手機版網頁)切換為App都將會造成追蹤中斷而無法進行 LINE Points 回饋。 (5) LINE 購物為購物資訊整合性平台，商品資料更新會有時間差，如顯示之商品規格、顏色、價位、贈品與台灣樂天市場銷售網頁不符，以銷售網頁標示為準。 (6)Pickup店家之有效訂單需於下單後40天內使用完畢才符合分潤條件 (7) 若上述或其他原因，致使消費者無接收到點數回饋或點數回饋有爭議，台灣樂天市場保有更改條款與法律追訴之權利，活動詳情以樂天市場網站公告為準。

相關文章

日韓暢銷6款人氣即溶咖啡！連明星們都愛不釋口！

日韓暢銷6款人氣即溶咖啡！連明星們都愛不釋口！

咖啡可說是每日精神糧食，宅家辦公一樣少不了它！尤其即溶咖啡既省時又方便，就連2021最夯的韓國影集「黑道律師文森佐」都看得...
516,985人已觀看
國小畢業禮物推薦！７款適合小學生的超實用畢業禮物

國小畢業禮物推薦！７款適合小學生的超實用畢業禮物

每到鳳凰花開時，就是畢業季的開始，人生除了幼稚園，國小畢業大概是第一個最有感覺(也最有印象?)的時間點，象徵一個新的開始，...
33,404人已觀看
畢業季！8款送老師的畢業禮物，直接送到心坎裡

畢業季！8款送老師的畢業禮物，直接送到心坎裡

畢業季又快到囉～想送老師畢業禮物又不知道該送什麼才能送到心坎裡嗎？別擔心，這篇幫你整理出老師最愛收到的禮物排行榜，還有從國...
98,093人已觀看
男用腰包推薦總整理！7款實用好看運動腰包、精品腰包、工作腰包一次看，一秒掌握型男穿搭～

男用腰包推薦總整理！7款實用好看運動腰包、精品腰包、工作腰包一次看，一秒掌握型男穿搭～

大多數男生出門時講求簡單快速，衣著穿搭也傾向簡單隨性，一個好看又實用的腰包就成為男生外出必備的時尚單品之一。但市面上腰包種...
40,693人已觀看
日本人都這樣收納！折疊家居用品超省空間！

日本人都這樣收納！折疊家居用品超省空間！

現今買房、租屋，多以小坪數、小宅為主，但在有限的空間裡，擺放所有想要的家具，是許多人的困擾！這次小編就為大家找尋多款居家實...
223,838人已觀看
水晶寶寶哪裡買到正確丟棄處理方式｜懶人包

水晶寶寶哪裡買到正確丟棄處理方式｜懶人包

水晶寶寶是什麼？是活得還死的？ 水晶寶寶是沒有生命的非生物，水晶寶寶的成分屬於丙烯酸高分子聚合物，這種化學藥品具有強力吸水...
73,966人已觀看
上班族通勤必備好包！網友激推提把托特包TOP8

上班族通勤必備好包！網友激推提把托特包TOP8

提把托特包的大容量是許多上班族珍愛的通勤好包，不僅可以放筆電，如果有1-2天短距離的出差公務需求時，也可以拿來當成旅行包使...
44,959人已觀看
咖啡因洗髮精好用嗎？網友大推5款咖啡因洗髮精

咖啡因洗髮精好用嗎？網友大推5款咖啡因洗髮精

想要提神，來杯咖啡準沒錯！不過把咖啡因添加在洗髮精中，你用過了嗎？咖啡因被認為能滋養頭皮及頭髮並強化髮根，而被廣泛使用於洗...
33,675人已觀看
復古跑鞋57/40花樣上市，春櫻粉、梨花奶茶、雛菊黃...5款春日限定錯過捶心肝！

復古跑鞋57/40花樣上市，春櫻粉、梨花奶茶、雛菊黃...5款春日限定錯過捶心肝！

靠著舒適度和有型有款的設計New Balance 57/40 復古運動鞋，成為近期女鞋頭們熱搜大熱門！搶眼復古風格搭配上醒...
56,875人已觀看
小心！上公廁也可能被傳染新冠病毒！重症名醫：使用蹲式馬桶「自保6要訣」必注意

小心！上公廁也可能被傳染新冠病毒！重症名醫：使用蹲式馬桶「自保6要訣」必注意

防疫三級警戒降至二級，隨著人流活動機會增加，大家在戶外碰到尿急時，必需找公廁，但是不禁令人擔心：「上廁所時，在公廁內遇到新...
1,467,376人已觀看

熱銷排行榜

更多

Fun English｜3-10歲幼兒英語啟蒙遊戲學習App（一年期）贈送 Fun English 六個月
找相似
72折
1,299

Fun English｜3-10歲幼兒英語啟蒙遊戲學習App（一年期）贈送 Fun English 六個月

親子天下Shopping
15%
限時加碼14:36:10
新韓檢初級TOPIK1字彙30天搶分王！（隨書附贈MP3朗讀光碟）
找相似
降價
221 (降$31)

新韓檢初級TOPIK1字彙30天搶分王！（隨書附贈MP3朗讀光碟）

康是美網購eShop
0%
新日檢JLPT N1關鍵540題：文字、語彙、文法、讀解、聽解一次到位(5回全真模擬試題+解析兩書+1CD)
找相似
315359

新日檢JLPT N1關鍵540題：文字、語彙、文法、讀解、聽解一次到位(5回全真模擬試題+解析兩書+1CD)

0~1%
比價18個賣場 立即比價
康是美網購eShop台灣樂天市場Yahoo奇摩購物中心蝦皮商城
學習認識ABC(18.5*13.5*1.5cm) NO.813【九乘九購物網】
找相似
90105

學習認識ABC(18.5*13.5*1.5cm) NO.813【九乘九購物網】

1~2%
比價4個賣場 立即比價
九乘九購物網台灣樂天市場
日本語GOGOGO 3 練習帳(書+1CD)/財團法人語言訓練測驗 文鶴書店 Crane Publishing
找相似
142522

日本語GOGOGO 3 練習帳(書+1CD)/財團法人語言訓練測驗 文鶴書店 Crane Publishing

0~3%
比價63個賣場 立即比價
遠傳friDay購物台灣樂天市場蝦皮商城PChome 24h購物
朱瑞福的游泳課（附「中英雙語」劇場版故事CD）
找相似
79折
284

朱瑞福的游泳課（附「中英雙語」劇場版故事CD）

親子天下Shopping
15%
限時加碼14:36:10
動成語牌卡遊戲組：學成語，練數感，認識身體，賴秋江296張牌卡打開跨域學習新疆界！
找相似
79折
789

動成語牌卡遊戲組：學成語，練數感，認識身體，賴秋江296張牌卡打開跨域學習新疆界！

親子天下Shopping
15%
限時加碼14:36:10
Scholastic ACORN英語閱讀橋梁書系列: Princess Truly系列套書 (套書5書，含學習單共一本，贈讀本音檔MP3光碟)
找相似
72折
850

Scholastic ACORN英語閱讀橋梁書系列: Princess Truly系列套書 (套書5書，含學習單共一本，贈讀本音檔MP3光碟)

親子天下Shopping
15%
限時加碼14:36:10
【書寶二手書T6／語言學習_GWQ】遜咖日記1-葛瑞的中學求生記_Jeff Kinney
找相似
歷史低價
89 (降$20)

【書寶二手書T6／語言學習_GWQ】遜咖日記1-葛瑞的中學求生記_Jeff Kinney

台灣樂天市場
1%
新版實用視聽華語1(第3版)附MP3
找相似
612

新版實用視聽華語1(第3版)附MP3

Yahoo奇摩購物中心
1%
用中文輕鬆學英文-單字篇-只要會中文，就能開口說英語(附QR Code音檔)[79折]11101027643 TAAZE讀冊生活網路書店
找相似
236

用中文輕鬆學英文-單字篇-只要會中文，就能開口說英語(附QR Code音檔)[79折]11101027643 TAAZE讀冊生活網路書店

蝦皮商城
0%
學習認識ABC(18.5*13.5*1.5cm) NO.813
找相似
75折
90

學習認識ABC(18.5*13.5*1.5cm) NO.813

九乘九購物網
2%
哈哈英單7000：諧音、圖像記憶單字書
找相似
338450

哈哈英單7000：諧音、圖像記憶單字書

0~3%
比價7個賣場 立即比價
康是美網購eShop遠傳friDay購物台灣樂天市場蝦皮商城
新版實用視聽華語1(學生作業簿)(第3版)
找相似
180

新版實用視聽華語1(學生作業簿)(第3版)

Yahoo奇摩購物中心
1%
【書寶二手書T5／語言學習_GWQ】遜咖日記2-葛瑞不能說的祕密_Jeff Kinney
找相似
歷史低價
99 (降$30)

【書寶二手書T5／語言學習_GWQ】遜咖日記2-葛瑞不能說的祕密_Jeff Kinney

台灣樂天市場
1%
【快樂文具】 作業簿 作業本 國小作業簿 直行簿 查字典簿 英語作業簿 聯絡簿 數學作業簿 國中作業簿 特賣
找相似
6

【快樂文具】 作業簿 作業本 國小作業簿 直行簿 查字典簿 英語作業簿 聯絡簿 數學作業簿 國中作業簿 特賣

蝦皮購物
0%
黑田桑單字卡
找相似
74折
26

黑田桑單字卡

九乘九購物網
2%
我的第一本英文文法：分課帶領、融入會話、全面剖析，建立文法藍圖，自學教學都好用！(附MP3)
找相似
285334

我的第一本英文文法：分課帶領、融入會話、全面剖析，建立文法藍圖，自學教學都好用！(附MP3)

0~1%
比價7個賣場 立即比價
康是美網購eShop台灣樂天市場Yahoo奇摩購物中心蝦皮商城
蜜蜂包打聽
找相似
1,090

蜜蜂包打聽

Mamas & Papas 官方網站
8%
限時加碼11:36:10
(25k)ACME實用英漢字典(精P1) B5202-3
找相似
75折
285

(25k)ACME實用英漢字典(精P1) B5202-3

九乘九購物網
2%
FunEnglish｜3-10歲幼兒英語啟蒙遊戲學習App（一個月）贈送 Fun English 二個月
找相似
63折
599

FunEnglish｜3-10歲幼兒英語啟蒙遊戲學習App（一個月）贈送 Fun English 二個月

親子天下Shopping
15%
限時加碼14:36:10
2024導遊領隊三合一題庫(華語導遊/華語領隊/外語導遊/外語領隊)(依112年
找相似
395

2024導遊領隊三合一題庫(華語導遊/華語領隊/外語導遊/外語領隊)(依112年

Yahoo奇摩購物中心
1%
新制多益大全．聽力＋閱讀＋單字 一本就夠！1,800萬 考生選擇的多益系列[79折]11101001475 TAAZE讀冊生活網路書店
找相似
426475

新制多益大全．聽力＋閱讀＋單字 一本就夠！1,800萬 考生選擇的多益系列[79折]11101001475 TAAZE讀冊生活網路書店

0~3%
比價9個賣場 立即比價
康是美網購eShop遠傳friDay購物Yahoo奇摩購物中心台灣樂天市場
自學日語: 看完這本就能說! 專為華人設計的日語教材, 50音+筆順+單字+文法+會話一次學會! (附QR碼線上音檔/真人發音教學影片)/許心瀠 eslite誠品
找相似
79折
394

自學日語: 看完這本就能說! 專為華人設計的日語教材, 50音+筆順+單字+文法+會話一次學會! (附QR碼線上音檔/真人發音教學影片)/許心瀠 eslite誠品

蝦皮商城
0%
自學日語 看完這本就能說：專為華人設計的日語教材，50音+筆順+單字+文法+會話一次學會！
找相似
374394

自學日語 看完這本就能說：專為華人設計的日語教材，50音+筆順+單字+文法+會話一次學會！

0~1%
比價9個賣場 立即比價
康是美網購eShop台灣樂天市場Yahoo奇摩購物中心蝦皮商城
我的第一本英文文法(附MP3)
找相似
歷史低價
285 (降$15)

我的第一本英文文法(附MP3)

Yahoo奇摩購物中心
1%
新版實用視聽華語5(教師手冊)(第3版)(張仲敏.陳瑩漣.韓英華等) 墊腳石購物網
找相似
108792

新版實用視聽華語5(教師手冊)(第3版)(張仲敏.陳瑩漣.韓英華等) 墊腳石購物網

0~1%
比價5個賣場 立即比價
Yahoo奇摩購物中心蝦皮商城
新制多益大全．聽力＋閱讀＋單字 一本就夠！
找相似
427

新制多益大全．聽力＋閱讀＋單字 一本就夠！

Yahoo奇摩購物中心
1%
學日語50音不用背: 從口訣+字源+諧音+自然律動50音, 日語假名一次學到好/木村学 誠品eslite
找相似
79折
182

學日語50音不用背: 從口訣+字源+諧音+自然律動50音, 日語假名一次學到好/木村学 誠品eslite

蝦皮商城
0%
學習認識ㄅㄆㄇ(18.5*13.5*1.5cm) NO.812
找相似
75折
105

學習認識ㄅㄆㄇ(18.5*13.5*1.5cm) NO.812

九乘九購物網
2%

商品描述

【簡介】 學網頁 3D 可以用聰明的方式融會貫通， 再也不用埋頭苦幹！ 　　| 內容簡介 　　本書內容改編自第 14 屆 iThome 鐵人賽 Software Development 組的優選系列文章《30 天成為鍵盤麥可貝：前端視覺特效開發實戰》。本書透過不同前端 3D 作品案例逐步解釋 WebGL 底層運作原理，用淺顯易懂的方式，搭配豐富的插圖，進而解釋艱澀難懂的主題，幫助讀者打造屬於自己的網頁 3D 作品。內容從數學原理到畫面上的特效，從第一行程式碼到各個 bug 的解方，深入淺出，口吻風趣，涵蓋理論到實務創作的全面認識，帶領讀者輕鬆進入前端 3D 的大門。 　　網頁 3D 在創作時，最麻煩的是踩到深不見底的大坑，而這些大坑往往代表底層原理需要被理解，本書也依照不同案例會遇到的大坑做詳盡解釋，讓新手除了能夠打造自己的作品外，還可以省下埋頭苦幹的時間，用聰明的方式融會貫通！ 　　| 核心內容 　　本書分為三部曲，第一部曲介紹多種底層關係，第二部曲提供多個 three.js 案例的教學同時引出原理，第三部曲深入 Shader 的世界。每一部都能單獨看，每一個案例都有上手的程式碼以及完成的程式碼，學網頁 3D 再也不必茫然！ 　　| 目標讀者 　　◪ 對網頁開發相對陌生，但希望能更嘗試網頁 3D 並融入創作的網頁設計師 　　◪ 對 3D 相對陌生，但對網頁 3D 躍躍欲試的前端工程師 　　◪ 對網頁 3D 感到好奇，想多加認識該領域的勇者 　　◪ 想嘗試在網頁上呈現創作的 3D 建模師 　　◪ 尋找更酷炫的媒材加以創作的視覺藝術家 好評推薦 　　「我衷心推薦《網頁視覺特效最強必殺技大全》，書中很多艱澀的原理在 Umas 的文筆下都相當有趣，相信你將從中受益匪淺。」——蔡木景，《JavaScript 概念三明治》作者 【目錄】 推薦序 序言 CHAPTER 01 導論：前端 3D 視覺特效是什麼？ 誰適合學習前端 3D 視覺特效？ 學習前端 3D 視覺特效有什麼好處？ 網頁視覺特效包含哪些做法？ 我所準備的資源 本書內容 PART Ⅰ | 用 three.js 理解 3D 世界觀 CHAPTER 02 安裝、建置環境 透過 CodePen 上手 透過 Live Server 上手 CHAPTER 03 Hello three.js! 三者關係 從 three.js 開始，要怎麼起頭？ 開始程式碼 CHAPTER 04 three.js 空間座標――讓世界繞著我旋轉！ 巢狀結構 以程式碼示範 設定空間的方法？ CHAPTER 05 什麼！空間被扭曲了？我 three 願稱你為最強――矩陣 順序到底有沒有差？ 在 three.js 看這個問題 矩陣 在 three.js 實作該方法 CHAPTER 06 The World ！砸瓦魯多！歐拉歐拉歐拉！――歐拉角跟四元數 天球問題 在 three.js 應用歐拉角 在 three.js 應用四元數 製作天球 CHAPTER 07 three.js 圓弧的藝術家！弧線的教授！――OrbitControls 軌道控制器 Control OrbitControls 控制「目標」跟「鏡頭」 實作 Target 不正確問題 總結：target 跟 lookAt 的差異 CHAPTER 08 three.js 的一方通行：矢量操作――全面釐清向量與底層特性 我們需要有向量操作能力 學一方通行在短時間內分析向量來反擊 immutable 不止向量，這觀念遍布 three.js 必學的向量函式 如同「矢量操作」般必殺的向量函式 CHAPTER 09 你有被光速踢過嗎？解析 3D 界的黃猿――光的底層原理與介紹 最常用的光源及其原理 這些光怎麼來的？ 光就是內積算出的結果 以上 three.js 都幫你包好了 CHAPTER 10 傲慢的太陽――光的開發 實作地球與太陽 PART Ⅱ | 用 Three.js 實戰 3D 作品 CHAPTER 11 前端視覺特效工程師實戰：全球戰情室――貼圖原理 做一個地球可以做什麼？――地球的應用 理解貼圖的運作模式 數不清的貼圖 小結 CHAPTER 12 前端 3D 視覺特效開發實戰：全球戰情室――實作地球 成品 運用貼圖 加上雲圖 跨入修圖領域 加上互動 CHAPTER 13 3D 地球特效開發實戰：留下飛雷神術式吧！――經緯度座標轉換 開發鏡頭跳躍功能 完成品 經緯度轉三維空間座標 結論 CHAPTER 14 three.js 3D 地球特效開發實戰：飛雷神之術走跳地球！――鏡頭追蹤與浮動文字 開發功能 地球的潛力 CHAPTER 15 three.js 3D 圖表特效開發實戰――繪畫就跟佐為下棋一樣簡單：線段原理 線段是什麼？ 三個重要的線段物件：Shape、Path、Curve 線段物件：路徑 Path 線段物件：曲線 Curve CHAPTER 16 3D 圖表特效開發實戰――來人！餵公子吃餅：圓餅圖 開發線段 小結 CHAPTER 17 3D 圖表特效開發實戰――你爹只給個爛餅，大不了還你 3D 爛餅：用粉圓體做立體圓餅圖 完成品 開發立體圓餅圖 加上圖例 完成品 小結 CHAPTER 18 three.js GIS 系統開發實戰――鄉鎮市區 GIS 系統：SVG、GeoJson 的應用 由 SVG 渲染模型 讀取 SVG 將 Path 轉成 3D Mesh 將數值轉成物件高度 完成品 CHAPTER 19 three.js GIS 系統開發實戰――成為網頁特效的鹿丸！影子模仿術：陰影的終極原理 陰影的實作 陰影的本質 渲染問題解決方法 Self-Shadow Aliasing 問題 Bias 修正 延伸的陰影技術：Shadow Map、PCF、PCSS 各種光源所產生的陰影差異 小結 CHAPTER 20 three.js 前端 3D 視覺特效開發實戰――設備檢視器：倒影特效 成品 鏡面反射原理 開發鏡面特效 成果 envMap 是什麼？ envMap 流程 CubeCamera 怎麼照出 360 度照片的？ 什麼是 HDRI Cube 是什麼意思？ CHAPTER 21 前端 3D 視覺特效開發實戰――智慧工廠：倒影特效 成品 開發鏡面特效 進階鏡面特效 成品 小結 CHAPTER 22 智慧工廠開發實戰――Dejavu！讓鏡頭跟著拓海一起飄移：鏡頭追蹤、飄移特效 準備程式碼 鏡頭追蹤 鏡頭飄移 小結 PART Ⅲ | 用 Shader 實戰視覺特效 CHAPTER 23 WebGL Shader――你好啊大哥哥，沒想到你可以到 Shader 來呢！ Shader 是什麼 Shader 要如何開發 小結 延伸閱讀 CHAPTER 24 WebGL Shader――從認識 GLSL 開始釐清 Shader Shader 是什麼？ 寫Shader 從認識 GLSL 開始 小結 CHAPTER 25 WebGL Shader――透過自製環境光實作 Shader 傳值 實作即時變化的環境光 完成品 從實作過程中釐清變數類型 小結 CHAPTER 26 使用 Shader 創造漸層 為甚麼要用 Shader? 快速建置 Shader 環境――透過 p5.js 快速建置 Shader 環境――透過 three.js 建立具有光暈的粒子――原理 建立具有光暈的粒子――實作放射狀漸層 建立具有光暈的粒子――移動中心點 建立具有光暈的粒子――反白整個畫面 更多探索 CHAPTER 27 WebGL Shader――透過 Shader 製作光暈：速成篇 用 three.js 製作 Shader 材質 在 Vertex Shader 加上 vertexNormal 在 Fragment Shader 加上「神祕的程式碼」 完成品 小結 CHAPTER 28 WebGL Shader――透過 Shader 製作光暈：Shader 傳值的原理 觀察程式碼 vertexNormal 有值嗎？如果有的話，數值是從哪裡來的？ CHAPTER 29 WebGL Shader――透過 Shader 製作光暈：光暈原理與多種變化形式 dot() 是在哪裡宣告的？它的作用是什麼？ 我們釐清了關鍵問題，現在順一遍程式碼 透過 intensity 生成顏色 延伸嘗試 小結 CHAPTER 30 WebGL Shader――用 Shader 做全視角內光暈、星球材質 成品 全視角的內光暈 內光暈在地球的應用 外光暈 小結 後記

加入購物車

設定到價通知

前往賣場1%