用一串程式碼做的畫,欣賞Chrome、Safari、Edge不同的「藝術」風格
用一串程式碼做的畫,欣賞Chrome、Safari、Edge不同的「藝術」風格

如果你的瀏覽器會畫畫,那它會畫出怎樣一幅畫呢?

如果瀏覽的小說文字多,那可能是文字組合多多的黑白圖畫;如果是線上看不同的動漫作品,那估計是色彩繽紛的普普畫作;要是每天都在看攝影美圖,那瀏覽器畫出的可能是一幅光影變幻的印象畫。

可惜瀏覽器不是AI,沒辦法根據自己的代碼、特性來畫一幅畫。

Web Browser1.jpg
Chrome的畫。
圖/ 愛范兒

但這也沒關係,數位藝術家黛安娜.史密斯(Diana Smith)設計了一串純web的程式碼,每個瀏覽器在加載頁面時都會將其呈現為繪圖。

史密斯一直以來都在進行的嘗試是用CSS和HTML作出畫作。所有的元素都是手動的輸入,僅允許使用Atom文本編輯器和Chrome的開發者工具進行操作,同時SVG元素的使用也可能受到限制。它的項目和源代碼都可以在GitHub中查詢。

這一次,史密斯的「作畫」和不同的瀏覽器有關。除了Chrome瀏覽器能夠呈現圖片本身預想的畫作外,其它瀏覽器都會「畫」出不同的圖像。這也展示了不同瀏覽器轉換工作的差別。

Web Browser2.jpg
▲ Diana Smith的其它藝術作品
圖/ 愛范兒

這不是說其它的瀏覽器都不如Chrome,只是作者在一開始並沒有考慮過跨瀏覽器兼容的問題。

但就是因為沒有兼容,這串代碼反而畫出了不同的「有趣」圖畫。

由於這個項目的藝術性,因此我不關心跨瀏覽器的兼容性,所以即時預覽可能在除Chrome之外的任何瀏覽器中看起來都很可笑。

在Safari瀏覽器中,蕾絲的花邊裝飾覆蓋在了女人的臉上,這片蕾絲本應該出現在女人的脖頸後方作為裝飾品。

Web Browser3.jpg
Safari的畫。
圖/ 愛范兒

而在2014版本的Opera瀏覽器中,畫作變得更加詭異了,有了一種全然不同的風格。脖子分成了三個部分,眉毛、頭髮、眼睫毛的位置都出現了偏移和錯位,以一種更像條碼的方式展現。脖子、眼睛也出現了位置的偏移,這是一張平面的、詭異的畫作。

Web Browser4.jpg
Opera的畫。
圖/ 愛范兒

而讓人感覺十分複雜的是Edge瀏覽器。雖然他的名字Edge有「邊緣」的意思,但在這次作畫中,它自動「畫」掉了所有的邊,讓項鍊消失,使整幅圖畫更為平滑。

這幅畫作還是所有畫中看起來最為陰沉的一幅。

Web Browser5.jpg
Edge的畫。
圖/ 愛范兒

還有曾是世界上最流行的瀏覽器——Netscape Navigator(網景領航員),儘管它的市場佔有率一度達到了90%,但今天可能很多人都沒有聽過它的名字了。

即便如此,它依然是最有風格的瀏覽器創作者,畫出的圖像自成一派。

臉變成了方塊,嘴巴、眼睛等五官都變成了不同大小的方塊,深色的毛髮變為了條碼狀的線條。有點像樂高,也有點像《當個創世神(minecraft)》風格。Vice覺得這個顏色和微軟的Edge瀏覽器基本保持了一致,或許是因為這兩家公司都曾統治了90年代。

Web Browser6.jpg
Netscape Navigator的畫。
圖/ 愛范兒

Diana Smith說:「當你在不同的瀏覽器上查看這張圖片時,你就像是在查看網路的歷史,以及當時用戶對瀏覽器的要求。」

事實上,雖然這個數位藝術完全是藝術方面的探索,但也很容易讓人聯想想到中國多年前的一場行銷活動——IE6殲滅戰。

Web Browser7.jpg
圖/ 愛范兒

當時還有很多用戶在使用存在較大安全隱患的IE6,於是奇虎360號召大家和周鴻禕一起「真槍實彈」地消滅IE6。用戶只需要登錄活動主頁就能自動檢測用戶瀏覽器的IE內核版本,檢測自己是否正在使用不安全的IE6。

若用戶瀏覽器內核為IE6版本,主頁的哆啦A夢就無法顯示出本來的形象,五官扭曲,分辨不清。而IE8內核的瀏覽器則能很清晰地顯示哆啦A夢,圖片顯示的直接不同也能提醒用戶升級瀏覽器。

Web Browser8.jpg
圖/ 愛范兒

七年前的行銷活動和今天的數位藝術品,二者都很有趣。

責任編輯:江可萱、蕭閔云
本文授權轉載自:愛范兒

關鍵字: #瀏覽器
往下滑看下一篇文章
不只投廣告!在 AI 時代,無限創意行銷如何從企業營運出發,放大行銷成效?
不只投廣告!在 AI 時代,無限創意行銷如何從企業營運出發,放大行銷成效?

一家連續十年營收 700 萬元的健身業者,如何在一年內將業績推升至 3,500 萬元,成長整整 5 倍?答案可能和多數人想的不一樣。

這家健身品牌不是一開始就加碼投放廣告,而是先從調整組織架構與薪酬制度著手,透過明確分工改善團隊運作,進而建立「全員銷售」文化,這並不是要求每位員工都成為業務員,而是讓團隊理解與認同品牌理念,確保從服務、回覆、教學到售後過程中的每一個顧客接觸點,都能傳遞一致的訊息與體驗,從而建立顧客對品牌的信任感,甚至願意主動購買與持續回購。而規劃這套成長策略的幕後推手,正是無限創意行銷。

AI 讓行銷變簡單,為何行銷公司反而更難做出成效?

雖然公司名稱裡有「行銷」兩個字,但無限創意行銷並非只從行銷工具出發,而是以顧問式行銷的角色,先理解企業經營問題,再決定應採取哪些行銷與營運解方。「我們不會一開始就告訴企業該採用哪些行銷策略,而是根據企業真的需求來提供適合解方」,無限創意行銷創辦人翁小五一語道出公司的獨特定位。

通常,企業在面對營收成長瓶頸時,第一個念頭就是做行銷,然而,翁小五從過往的工作與創業經驗中發現,限制企業營收成長的原因有很多,不一定與行銷有關,背後可能還有其他問題,若沒有釐清真正的問題所在,就急著投入廣告或其他行銷資源,很可能只是治標不治本。

基於這樣的觀察,無限創意行銷決定採取反向思考邏輯:先回到企業經營本身,找出造成「成長趨緩」的真正原因,再據此制定策略、優化營運流程,最後透過行銷放大企業優勢。當每一筆行銷投入都建立在更健康的企業體質與更精準的策略判斷之上,行銷才不只是「有做」,而是真正能為企業帶來成長。

這套「先找問題、再選工具」的服務模式,在生成式 AI 工具普及後,也成為拉開行銷成效差距的關鍵。

過去,行銷公司的價值建立在製作能力、投放技術與媒體資源;但當 AI 逐步降低文案、素材與分析的執行成本,單純提供「做內容、下廣告、做報表」的服務,差異化將快速縮小。此時真正考驗的,反而是行銷人的理解力和判斷力:能否看懂消費者真正需要什麼?能否找出限制企業營收成長的關鍵環節?而這正是無限創意行銷長期深耕企業經營現場、不斷透過數據與市場驗證所累積的核心能力。

無限創意行銷-2.JPG
無限創意行銷創辦人 翁小五
圖/ 數位時代

AI 拆解營收黑洞,讓數據為企業成長導航

在無限創意行銷的顧問式服務流程中,數據是相當重要的依據。翁小五進一步說明,無限創意行銷的數據應用可以分為三個層次:從檢視行銷活動成效、拆解顧客旅程中的問題節點,再進一步延伸至年度營運規劃,讓企業不只知道「過去發生了什麼」,更能判斷「下一步該怎麼走」。

首先,是檢視行銷活動成效,其中最重要的原則在於,根據行銷目標去解讀數據。舉例來說,如果目標是增加首購顧客,除了檢視素材吸引力與點擊率,還要持續追蹤到站、詢問、成交、新客占比與首購成本;如果目標是擴大營收規模,則應進一步檢視回購率、客單價與顧客終身價值。

數據應用的第二層價值,是拆解從「廣告投入」到「營收產出」之間的過程,理解每一個節點的數據分別反映什麼問題,再針對問題逐一修正。

至於第三個層次,則是讓數據成為企業經營與資源配置的依據。無限創意行銷會從年度營收目標出發,結合產業特性、淡旺季變化與過往行銷成果,拆解每一季、每個月的業績任務,再將過去有效的策略放大、成效不佳的做法修正,據此安排下一年度的行銷資源與營運節奏。

不急著加碼廣告,從企業體質出發找出 5 倍成長解方

對無限創意行銷來說,數據是找出問題、配置資源與規劃成長路徑的關鍵,文章開頭提到的健身業者,正是此套方法論的最佳印證。當初,翁小五深入診斷後發現,這家企業真正的問題在於組織結構過度扁平,老闆長期忙於處理日常事務,難以專注在營運規劃;此外,組織缺乏真正負責營運管理的中階主管、教練流動過高導致學員缺乏安全感等,皆是影響回購率的因素。

因此,無限創意行銷先從組織架構著手,設立專責店長一職,並重新設計薪酬制度,藉此讓教練、店長與老闆皆可專注在自身工作上。之後,再透過前期廣告數據與顧客洞察,找出消費者選擇品牌的真正原因,並運用行銷活動與口碑經營持續放大。同時,翁小五也在過程中導入「全員銷售」概念,確保顧客在各個接觸點都享有一致的體驗,品牌才能逐步累積顧客信任。

最終,這家企業的營收一年就成長至 3,500 萬元,達到原先的 5 倍。這個案例也說明了無限創意行銷的方法論:行銷不是企業成長的起點,而是放大企業優勢的槓桿;企業體質愈健全,這支槓桿所能放大的成長效益也愈大。

從「會做」到「會判斷」,AI 時代,無限創意行銷正在重新定義行銷公司的價值

隨著 AI 能力越來越強大,下一代行銷公司的價值,不只是比誰更懂得運用 AI,而是行銷人的市場理解力與專業判斷力,知道 AI 產出的內容哪些值得留下、哪些應該捨棄,或是該如何持續修正,才能打造出能夠被消費者感受到的品牌體驗。

因此,無限創意行銷未來將積極建立團隊與 AI 協作的方法論,將過往的專案判斷、提問框架與數據檢核邏輯,轉化為 AI 協作流程。團隊在面對新專案時,不是直接要求 AI 給答案,而是先定義目標、限制條件與判斷標準,再去檢查 AI 產出是否符合商業情境。

對翁小五而言,AI 時代真正稀缺的,不是工具,而是定義問題、理解消費者與判斷品質的能力。未來無限創意行銷的競爭力,也不在於使用多少 AI,而是持續將人的品味、市場理解與產業 Know-how,透過 AI 放大,協助企業打造更精準的品牌體驗與更高品質的決策。

登入數位時代會員

開啟專屬自己的主題內容,

每日推播重點文章

閱讀會員專屬文章

請先登入數位時代會員

看更多獨享內容

請先登入數位時代會員

開啟收藏文章功能,

請先登入數位時代會員

開啟訂閱文章分類功能,

請先登入數位時代會員

我還不是會員, 註冊去!
追蹤我們
台達電全解讀
© 2026 Business Next Media Corp. All Rights Reserved. 本網站內容未經允許,不得轉載。
106 台北市大安區光復南路102號9樓