最近古柳的 「中國傳統顏色可視化（一）」 視頻在b站小火🔥了下，不知道大家有在首頁看到過這個視頻嘛？
不過畢竟只是小火而非大火，想來不知道的人更多，因而古柳簡單介紹下情況，與大家分享這次的意外之喜。
1月12日上週二晚上，古柳在b站發佈了最近製作的關於中國傳統顏色的可視化視頻，但沒激起什麼水花，到14號上週四下午，原本只有幾百播放量的視頻，播放量和點贊數開始意外地明顯上漲，甚至有人評論是從首頁過來，古柳雖然覺得很不可思議，但想來每個人的首頁內容都不相同，可能只是極少部分人有此情況，只有數據反饋良好纔可能推送給更多人，但總之當時就預感可能會逐漸火起來。
截止晚上8點播放量破1萬，小目標先行達成，後續發展會如何，實在不敢過分設想，只能靜觀其變。次日15號上週五醒來發現收到視頻上了熱門的私信，也是第一次有此經歷，看來還能繼續上行，當天播放量從3萬多漲到了8萬多。
之後上週六雖然沒前一天那麼大的漲幅，但10萬播放量的另一個小成就也在下午16點多達成。
之後趨於平緩，截止目前(1月21號晚上9點)大概15.2萬播放量、1.4萬點贊數、2.1萬收藏數、4.6千投幣數、順帶漲了1300+關注，算是給小透明的古柳意外斬獲一份不錯的數據。
有此一遭，自然也就有些想說想寫的內容、有些之前就有的想法可以順帶講講。
首先是關於爲什麼想到做可視化視頻？
其實想做可視化視頻的念頭很早就有，甚至古柳對 D3.js 還不熟悉那會就有了，而不論當時還是現在，談起可視化視頻，大家腦海中浮現的想來多半是配樂激昂、你追我趕的動態柱形圖之類吧。
在b站搜“數據可視化”，最火的就是這類視頻。
由於實在過於氾濫，古柳一開始就不願意做這類視頻，縱使有“萬惡之源”的見齊的開源框架亦或是 flourish 等在線工具使得製作門檻極低；縱使古柳不一定能琢磨出新穎的、受大家歡迎的可視化視頻類型，但也不願意退而求其次去製作同質化嚴重的視頻。
鏈接：https://flourish.studio/examples/
可到底要做什麼樣的視頻，其實古柳也還沒有答案，只有說下曾有過的嘗試。
在「年更博主冒個泡，或將開啓可視化之旅」 - 20200827一文裏，古柳介紹過「乃木坂工事中」B站熟肉各期(EP01-269)播放量的動態數據可視化|「DataViz EP01」，以此爲基礎的關於up主所有視頻播放量的視頻模版，後續也改進過以縮短時間，雖然還沒有全流程自動化、且美工方面仍有很大優化空間，但暫且作爲一個可以試水的方向。(靜態版折線圖也順帶放下)
寫作時搜到可視化up主 LePtC 的這個回答，很值得學習，將製作視頻的時間儘可能降低，纔有助於持續輸出內容。
再是年前古柳用 ffmpeg 做過一個自動剪輯大量視頻並自動拼接合成的視頻(實現細節之後會另寫文章介紹)，雖然嚴格來說不屬於可視化視頻範疇，但不論背後用到的技術，還是古柳自己的一些做法與追求，都沒有太大差別。
鏈接：「乃木坂工事中」一次“咚”個夠(EP01-289) 20201226
用到的技術/工具有 you-get/ffmpeg/moviepy/D3.js 等，大多是之前這兩個項目也用過的：「李子柒130個視頻1萬圖片5萬顏色數據可視化的背後，是古柳三年的念念不忘」、「關於推特30天地圖挑戰全部7.6k+圖片的顏色可視化」。
技術之外還有一點或許很明顯、又或許不會被注意到的，就是古柳想在美工之類上儘可能多嘗試。說起來也是受每週都會看的乃木坂46的團綜「乃木坂工事中」的影響，大家可能不瞭解的是，工事中很多美工後期很用心很好看，在飯們之間也挺受讚譽和喜歡，簡單找幾期截圖供大家瞭解下。
上面工事中咚合集就參考了24單富士山祈願的美工。能從常看的節目裏學習、參考並應用美工設計，也是蠻有意思的一件事。雖然後續能做到什麼程度還未可知，但希望能在方面做好，併成爲被大家記憶與喜歡的一個點。
至於這次爲什麼做「中國傳統顏色可視化」這個視頻、爲什麼做成這個可視化形式？
其實有太多的因素共同促成了這次的創作，反而古柳想不出哪個纔是最主要、最重要的。
首先是此前看到 Janny Ji 爲 Jenn Creighton 在2019年巴塞羅那舉行的 JSCamp Conference 中的分享所設計的 「Choose Your Own Adventure」 這組插畫，其將許多複雜的 JS 問題轉換成外星球裏一個個特殊的場景，以此帶領聽衆開啓一場不同尋常的旅程，並以此爲基礎講解 ECMAScript 6 中 Iteration protocol/迭代器協議 的相關內容，第三個鏈接裏有油管視頻，感興趣的可以一看。
鏈接：https://www.indigoawards.com/winners/2036
鏈接：https://www.behance.net/gallery/83675097/Choose-Your-Own-Adventure
鏈接：https://jscamp.tech/speakers/2019/jenn-creighton/
看到這組很有趣的 2.5D 插畫，於是古柳想起以前在可視化交流羣裏分享過，但一直沒細看的 zdog 庫，印象中似乎也能借助它而用程序代碼的方式做出類似的效果。
zdog 挺多人估計沒接觸過，如官網所說是很友好的僞3D引擎，不像 three.js 要先學一堆概念才能用，而是直接上手就能做一些東西。
鏈接：https://zzz.dog/
於是簡單敲幾個 demo 熟悉下，並上 codepen 看看其他人做的更多例子，挺多蠻有意思的，這裏就不過多一一列舉，大家可自行瀏覽。
鏈接：https://codepen.io/search/pens?q=zdog
印象深刻的有火烈鳥這個例子，栩栩如生。
鏈接：https://codepen.io/chenxinnn/full/Xwowxz
然後看到用漸變顏色做成的一組方塊，想來對可視化略敏感的人，應該也能聯想到顏色梯度圖例，雖然一個3D一個2D，但本質卻相同。
鏈接：https://codepen.io/Sake7/pen/GVWzLE
隨便找了幾張圖，這應該是大家更熟悉的可視化中使用顏色梯度圖例的場景。 鏈接：https://www.visualcinnamon.com/2016/05/smooth-color-legend-d3-svg-gradient
而相應的3D例子古柳想不出來太多，於是仔細翻了下收藏夾，可能只有之前「可視化作品分享：第1期 | 好評來襲」 - 20200904裏也發過的這個才吻合。
鏈接：https://vimeo.com/445505735
扯回來，看到這組方塊，古柳也開始好奇如果在此基礎上改動下代碼，加上更多方塊並簡單佈局會是怎樣的效果，於是邊閱讀代碼學習下實現方式，邊簡單跑了個 demo，莫名有種海邊或泳池之類的氛圍，而且確實比一般2D作品有更亮眼的表現。
那如果每個方塊用真實的顏色數據填充又會如何呢？
此前李子柒視頻或30天地圖挑戰的數據都是動輒上萬顏色，顯然太多不合適，古柳於是想到中國傳統色、日本傳統色等三個不錯的網站，可以拿數據來用用，而且大家應該沒怎麼看過將所有顏色擺到一起的全景圖，如果這麼做下或許也蠻有意思。
鏈接：http://zhongguose.com/
鏈接：https://colors.ichuantong.cn/
鏈接：https://nipponcolors.com/
於是趕在12月31號做了一組顏色可視化的圖，元素用長方體、圓柱體、球體、半球體等都來了遍看看各自效果，反正用 zdog 實現很方便。
古柳自己還是很喜歡這組圖的，實現簡單、效果驚豔，當時也在羣裏或各個地方發過，不少人估計也看到過，但唯獨還沒發公衆號裏。其實當時也想過在2020年的末尾，辭舊迎新之際趕緊發掉，但一來想到大家都在看各種跨年節目，讀懂空氣就不出來蹦躂了；二來想先寫工事中咚合集自動剪輯的實現文章，再介紹 zdog 顏色可視化，反了順序總覺得彆扭，於是作罷，今日才發，所以還是推薦大家進可視化交流羣，縮短信息時間差哈。
之後擱置了幾天，zdog 也忘光了，但古柳還是想把靜態版繼續改成動畫版，最初想做成等距動畫的形式，加入諸如顏色工廠、顏色塊、傳送帶等等元素，儘量可愛有趣些。
可終究想不出合理自然的、好的展現形式，如何設計與編排毫無頭緒，只能很不情願的又依次展示每種顏色，並拼湊成所有顏色的全貌圖，於是有了這次沒料到會小火的視頻。
雖然能火的原因可能不全在於3D顏色可視化這一點，但古柳個人對用 zdog 這個本不是可視化的庫來實現更多3D可視化效果還是很感興趣的，也期待能做出更多有觀感的作品。zdog 可能遠不如 three.js 強大，但上手容易得多，也期待大家一起做些好玩的例子和古柳分享。
以上，簡單分享了下這次視頻小火的事以及關於可視化視頻的一些內容。
如果大家還想看到更多幹貨，歡迎【點贊】、【評論】和【轉發】，多多捧場，古柳也有持續創作的動力，畢竟這慘淡的閱讀量實在也是有點說服不了自己太頻繁更新，還真不是因爲懶。逃。