用一串程式碼做的畫,欣賞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
圖/ 愛范兒

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

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

關鍵字: #瀏覽器
往下滑看下一篇文章
和泰汽車奪 IDC 數位生態系首獎!以 AI 數據中樞領航台灣車業新時代
和泰汽車奪 IDC 數位生態系首獎!以 AI 數據中樞領航台灣車業新時代

台灣車市龍頭和泰汽車,近年不只在賣車,更在賣「移動生活的體驗」。最新的里程碑,是和泰憑藉自建的 Hotai CDP(和泰智匯雲),整合集團十四家企業、七大品牌、三十三項數位服務,奪下 2025 IDC Future Enterprise Awards「Best in Digitally-Enabled Ecosystem」台灣首獎。這套系統不只是資料平台,更是撐起 MaaS (Mobility as a Service)轉型策略與 AI 營運的關鍵中樞。

「我們一直在想,當汽車交付出去,與顧客的連結不應該就此終止。」今年十月新上任的和泰汽車 MaaS 先進策略本部長韓志剛說。從這個問題意識出發,和泰讓傳統車業「會思考」、並推動整個生態系轉型。

Hotai CDP 打造台灣車業最大跨域數據平台

和泰的數位轉型並非一夕之間。真正的起點可以追溯到 2018年,當時公司內部開始反思,過去營運模式多半圍繞「車」,而不是「人」;顧客買車之後,接觸點幾乎只剩下保養與維修,難以掌握他的需求與生活場景。

同年,時任豐田集團社長豐田章男喊出「從汽車公司轉型為移動服務公司 (Mobility Company)」 的全球戰略,和泰遂從「移動服務」的思維出發,成立 MaaS 推進室,後來升級為 MaaS 先進策略本部,延攬具創新思維的企畫人才,組成約百人的專責團隊,首要任務不是再做新 App,而是整合散落在各子公司的資料,從「一台車一筆資料」轉向「一個顧客一個樣貌」。

Hotai CDP 以 One ID 串起集團所有數位服務,把顧客購車、iRent 出遊、yoxi 出差、HOTAI 購消費、去趣App規劃旅遊等足跡,從過去多組斷裂帳號統一回到單一識別之下。

韓志剛解釋,光是整合資料,就是浩大工程。團隊須先處理系統年代久遠、格式各異的問題,逐步完成資料清洗與欄位標準化,才能與各子公司協作建立統一辨識碼。同時,在個資法規與資安要求下,也一一補齊授權與同意流程,導入多層級權限控管、資料去識別化與簽核機制,並規劃通過 ISO 27001資安認證 與 ISO 27701 個資認證,打造可信任、安全的數據治理環境。

完成這些基本功後,Hotai CDP 成功串聯起950萬名顧客與 3,600 項行為標籤,成為台灣車業規模最大的跨域資料平台。對內,資料取得效率約提升六倍,估算每年可節省約 7200 人天工時;對外,已有超過 100 萬名顧客跨品牌使用集團服務,各品牌間的導流成果明確可見,為和泰的 MaaS 佈局奠定關鍵基礎。

V和泰汽車(IDC獲獎) x 數位時代_Allen-81_0.jpg
Hotai CDP 打造台灣車業最大跨域數據平台,為和泰的 MaaS 佈局奠定關鍵基礎
圖/ 和泰汽車

AI 賦能營運,從精準行銷到數據變現

更進一步的,還有 AI 賦能,帶動行銷、客服與商業決策形成持續學習的正循環。在行銷端,和泰運用 Hotai CDP 與 AI 模型分析顧客輪廓與行為,預測高潛力購車族群,再推播個人化內容,「從過去廣泛性發送行銷eDM,轉變為運用CDP數據進行分析與洞察之後再規劃促銷方案,引導顧客進入展間試乘;運用CDP輔助精準決策的這二年間,促成實際購車的成果大約有一萬八千筆,是過去的2.4倍!」韓志剛説。

服務體驗上,和泰以 TCS360 智慧儀表板串接顧客回廠滿意度、服務歷程與現場情境,再搭配現地現物觀察,各據點得以更精準調整流程,顧客滿意度因此穩定提升。在客服中心,系統流程導入 AI 摘要與客服案件自動分類機制,過去需人工逐筆輸入、分類的客服案件,改由AI進行自動識別摘要及分類建議,再交由人員判讀應對,如今作業效率提升67%,分類準確率也提升 20%,客服團隊能將時間用在更具價值的溝通與問題解決上,讓顧客的心聲更仔細、專注地被聆聽與分析。

深耕 AI 文化,讓數據成為企業語言

「2024 年開始,我們推動一系列企業級 AI 導入,而 MaaS 本部在其中扮演重要角色。」韓志剛說。AI 推動初期,公司提供員工免費使用五個月的 ChatGPT 或 Gemini,希望先培養基本使用經驗與 Know-how,降低跨出第一步的門檻。以「AI First」為願景,和泰一方面補助員工「玩」AI,一方面推動 AI 自主研活動,分享如何用 AI 改善流程、提升效率,讓成功案例在組織內橫向擴散。

V和泰汽車(IDC獲獎) x 數位時代_Allen-30_0.jpg
和泰汽車 MaaS 先進策略本部長 韓志剛
圖/ 和泰汽車

同時,和泰系統性培力內部種子,鼓勵 IT 人員與業務單位共同提升能力,目前已超過 5成IT人員具 AI、數據專業證照,成為各單位與技術團隊之間的關鍵橋樑。企業也鼓勵全體員工完成 AI 素養課程,並明確表示,只要是與業務相關、符合治理規範的 AI 工具,公司願意提供補助。「只要業務用得上,我們都鼓勵大家去試。」

走過 AI 試水溫階段、全員具備基本 AI 素養後,下一步將規劃導入 AI 企業版解方,將公司知識庫與資料納入企業級 AI 平台,逐步打造屬於和泰的 AI Agent 與應用架構,並正式納入公司 IT 藍圖。韓志剛強調,從 Think Amazing 到 Do Amazing,和泰把創新精神落實於日常行動,讓每一位員工都能以數據思考、與 AI 並行,走出屬於車業的智慧轉型之路。

登入數位時代會員

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

每日推播重點文章

閱讀會員專屬文章

請先登入數位時代會員

看更多獨享內容

請先登入數位時代會員

開啟收藏文章功能,

請先登入數位時代會員

開啟訂閱文章分類功能,

請先登入數位時代會員

我還不是會員, 註冊去!
追蹤我們
進擊的機器人
© 2025 Business Next Media Corp. All Rights Reserved. 本網站內容未經允許,不得轉載。
106 台北市大安區光復南路102號9樓