🚀 每個設計師都應該關注與追蹤的創意 Twitter 帳號，彙整 Muzli 精心篩選值得追蹤的國外頂尖設計師

會不會好奇國外頂尖設計師們的個人品牌網站都是如何建立的？

我也常被非從事網頁的設計師或行銷人尋問要如何建立自己的作品集網站，於是我將 Muzli 精心篩選值得追蹤的頂尖設計品牌 Twitter 社群帳號逐一檢視，找出他們使用的架站平台，讓所有設計師們在打造自己個人網站或品牌網站時可以參考。

🚀 先講結論：撇除單純用程式碼開發的名單，不意外地 WordPress 使用率第一，Webflow 和 Framer 並列第二。

雖然 Webflow 初學者入門門檻稍高，但國外相當流行且動態特效是其強項，Framer 則是後起之秀，使用方式跟 Figma 很像，所以也非常受到設計師們的愛戴。也看過不少用這兩套軟體工具打造不錯的品牌和行銷網頁，看來我得開始來正視學習 Webflow 和 Framer 了！

備註：Muzli 受到全球數十萬設計師的喜愛，是創意專業人士首選的領先瀏覽器擴充功能，將成為您最新、最前沿的設計、UI、UX 和互動式內容的視覺中心。它提供來自所有主要設計和靈感來源的每日內容，確保您永遠不會錯過下一件大事。

🍎 網站分析工具，至今依舊完全免費的 Microsoft Clarity，其中熱度圖 Heatmap、錄製內容 Recording 都加入了 AI 分析功能

🍎 網站分析工具，至今依舊完全免費的 Microsoft Clarity，在年 2023 年我才發現其熱度圖 Heatmap、錄製內容 Recording，應該有加入了 AI 分析功能？！

例如上圖中左側顯示的欄位「熱度圖深入解析」可以分析你指定網頁的熱度圖（包含點擊數、捲動深度），另外還有錄製內容（錄製使用者的螢幕操作）的行為分析和小結論，節省我們一些大量觀看評估這些數據的時間與精神。

為何只說「一些」呢？因為其分析是有點到一些重點，但沒有非常深入也未必完全正確，即使如此，還是有一定的幫助，AI 至少還是提供了見解與思考方向，等於是多了一個助理在旁邊先快速摘要一下，若我們對哪些論點或數據想要進一步探討，再去仔細瀏覽即可。

🍎 熱度圖 Heatmap 和錄製內容 Recording 是補足 Google Analytics 比較欠缺的視覺化分析，三者相輔相成、相得益彰。

十年前第一次發現這種功能是使用 CrazyEgg 這套軟體，覺得超酷，後來發現其他介面設計更有質感的如 Hotjar，相信這款滿多人知道，但最後還是選用了 Microsoft Clarity，雖然微軟出的產品時常掉漆，體驗就是沒那麼優，會用它主因還是到現在它真的完全免費，另外兩套費用就一年來講還是不低的 ^^

1. Microsoft Clarity 使用中，還會偵測到現在整在網站上的訪客，我們可以在後台直接「直播觀看」瀏覽網站的行為，完全是 Live show

2. 熱度圖：點擊右上角的「摘要熱度圖」就會顯示 AI 分析後的內容

3. 錄製內容：選擇某一影片後，點擊左上角「其他詳細資料」的「深入解析」，會顯示 AI 的重點分析

4. 熱度圖若選擇的時間過長（例如過去 30 天）再去跑 AI 摘要，有時候會當掉，可以刷新頁面重跑幾次，若還是不行就過一段時候再去跑一下，或就先選擇過去 7 天看看應該就可

🍎 不禁吸引人想購入一台，身為 Figma 的使用者與愛好者 - Work Louder x Figma

😍😍😍 不禁吸引我想購入一台，身為 Figma 的使用者與愛好者。但還是守住荷包了，先夢中擁有～ 來年有緣吧！

Work Louder x Figma 產品介紹：https://worklouder.cc/figma/

🎄 此商店是 WordPress 網站 + Shopify 結帳，像這類整合方式用分析工具查詢通常會兩者的資訊都會被顯示出來，而 Shopify 資訊後面會有個 50% 這種數字，就有可能是這個網站不是完全 Shopify 架站。

🎄 如圖所示，很明顯的此網站是用 WordPress 建站，但前往購買時會連到 Shopify 進行結帳。

設定方式：在 Shopify 安裝 Shopify App 的 Buy Button channel，選項會顯示在 Shopify 管理員中的「銷售管道」。前往閱讀 Shopify 官方文件：新增「購買按鈕」銷售管道

🍎 Blackbox AI + VSCode 撰寫程式，邊寫邊問 AI 問題，左右開畫面非常方便，並搭配 ChatGPT

🍎 有人用過了嗎？ 我現在都搭配 Blackbox AI + VSCode 撰寫程式，邊寫邊問 AI 問題，左右開畫面非常方便。

AI 輔助寫 code ，感覺有一個程式設計顧問或資深工程師在旁邊，而且是二十四小時伴你左右，回覆速度超快，甚至直接寫答案給你，執行效率超高，而且不會不耐煩 XD

前往安裝 VSCode Extension: Blackbox AI Code Generation, Code Chat, Code Search

然後再搭配 ChatGPT，其很容易保留問答紀錄與思路、功能更強、加以外掛如虎添翼。

☕️ 科技工具分享 - Super

Irving 爾文會在每次分享電子報時分享一個我正在使用或精選蒐藏的軟體工具，包含各種領域類別如 UIUX 設計、網站、電商、行銷、社群、AI 等。

網站架站 Website Builder

Super — Create Websites with Notion：若你是 Notion 的使用者或設計師，或想快速簡單且 No code 建立一個自己的網站或作品集，以 Notion 為主要編輯內容與排版，非常適合透過 Super 打造網頁頁面！基本的版型將 Notion 變得更像「網頁」的模樣呈現。

🎄 Line 學習社群

Shopify 網站設計與架站學習交流

分享主題從網站規劃、設計到建立等相關內容，透過學習交流與經驗分享，讓彼此成長更加快速，主要以 Shopify 建立電商網站為主。

前往加入

WordPress 網站設計與架站學習

學習 WordPress 網站設計與架站，分享實作經驗與交流。

前往加入

SEO 資源彙整與學習

閱讀 SEO 就像喝水一樣，習慣建立與自然地吸收。

前往加入

成為網頁設計師

邁向網頁設計師之路，了解網頁設計的基本概念與實作經驗交流與分享，無論是行銷人、工程師、平面設計師等想要了解更多「網頁設計」都歡迎加入討論。

前往加入

Irving 爾文

專注網頁設計與架站平台、SEO 搜尋引擎優化，深度研究品牌行銷、UX 策略與數位產品、電商經營等領域，熱衷科技、設計與文字創作、社群分享。

#藝術 #設計 #科技

★ Founder of Irvinglab 爾文實驗室
★ Senior Web Designer / SEO Manager
★ 專精 Shopify 電商網站設計與架站
★ 專精 WordPress 品牌網站和部落格建置
★ 工作經歷大小型公司 (包含品牌方與代理商)、網頁設計接案公司、數位行銷公司、新創 Saas 軟體公司等

➤ 聯繫方式：Line 官方帳號 | Channel 線上交談
➤ Email：[email protected]