Knowledge Base
閱讀站
首頁而家只顯示最近 50 篇文章,避免文章量愈大愈拖慢首頁載入。
AI控制瀏覽器的最佳方案:Playwright-cli + AI Coding ——寫不出來的爬蟲、跑不通的腳本,讓 AI 對着瀏覽器幫你調
Playwright-cli + AI:寫爬蟲同腳本唔再靠估,AI 睇住瀏覽器幫你搞掂曬
完成GPT Image 2最強用法:21個能直接拿去用的設計場景(附完整提示詞)
GPT Image 2 真正嘅價值係將設計工作做到可交付,而唔係畫梗圖。
完成需求總返工、PRD總跑偏?產品經理最該補的是這8個Skill
產品經理返工根源在於問題定義不清,pol-probe 與 problem-statement 最值得補
完成GPT Image 2 人像出圖指南:31個提示詞模板,Github 6.1K stars點贊
31個經實證嘅GPT Image 2人像提示詞模板,由攝影風格到產品級全面覆蓋
完成開源一個Skill管理神器
黃叔開源 Skill Hub,一個可視化嘅 Skill 管理神器,幫你解決版本回退、多設備同步等煩惱
完成分享一個好玩的 GPT image2 prompt
一個將詞語轉譯為高級概念海報嘅GPT prompt
完成如何把經驗裝到Skills?
寫 Skill 唔係只係畀任務說明,而係要將自己嘅經驗同判斷邏輯寫入去,先至可以得到真正可用嘅結果。
完成Karpathy 想要的那個 LLM Wiki 產品來了,裝一個 Skill 就能用
有道雲筆記推出 youdaonote-llm-wiki skill,將 Karpathy 嘅 LLM Wiki 概念變成即用產品
完成強烈推薦!這個 Skill 畫架構圖質量超高,一句話出圖
一個 Claude Skill 幫你快速生成高質量架構圖,一句話出圖
完成GPT Images 2 企業六大應用指南+Seedance2.0——企業實操玩法
GPT Image 2 結合 Seedance 2.0,六大企業應用場景實戰指南,從品牌形象到電商轉化全面覆蓋
完成GPT Image 2 的十種超前玩法:這才叫生產力!
GPT Image 2 憑極簡 Prompt 就能生成高品質、風格統一圖片,覆蓋十大場景,但仍有文字錯亂等限制。
完成open-design:Claude Design 的開源平替,自動調用你已裝的 Agent
open-design 係 Claude Design 嘅本地開源平替,自動用你部機已裝嘅 Agent,唔使額外俾錢。
完成GPT Image2 很強,但 OpenClaw 不能生圖?這個 Skill 解決了!
用一個 Skill 補齊 OpenClaw 生圖能力:GPT Image 2 對接 Codex
完成我用DeepSeek V4做出了史上最離譜的重生模擬器
DeepSeek V4 整咗個最離譜嘅重生模擬器,霸總變狗、皇帝用釘釘,全程AI自由發揮,兩小時搞掂。
完成突發!Freepik 正式更名為 Magnific:AI 創意平台的里程碑式進化!
Freepik 正式改名做 Magnific,整合 AI 放大技術,變身一站式創意平台
完成很多人問我的 Codex + gpt-image-2 工作流,我用一個真實頁面完整跑一遍
Codex+gpt-image-2 工作流實戰:先拆頁再出圖,避免返工
完成GPT Image 2.0深度測試(Vol:3)--商業海報設計測評
GPT Image 2.0 海報設計實戰:7個案例中5張可直接交付,設計師角色由執行變導演
完成分享一個 Image2 的提示詞庫,Github已8K Star
分享一個 GPT-Image2 提示詞庫,GitHub 8K Star,涵蓋多個領域嘅高質量案例
完成為什麼 AI Agent 反而更喜歡 kubectl-style CLI?
kubectl-style CLI 對 AI Agent 更友好,因為佢將「開放式作文題」變成「有限選項選擇題」,降低出錯率同上下文成本。
完成人為什麼總是會不自覺地逐漸滑向平庸?
平庸係熱力學第二定律嘅必然結果,唔靠結構化行動主動對抗熵增,就會不知不覺滑向平庸。
完成Claude 接入 Blender、Adobe、Ableton... Anthropic 一次放 9 個創作連接器
Anthropic 推出 9 個創作軟件連接器,Claude 接入 Blender、Adobe 等工具,同時發佈 Claude Design 打通設計到交付
完成AI產品的需求文檔怎麼寫,與傳統產品的PRD有何異同
AI產品PRD需從「人」轉向「模型」敍事,嵌入型與Agent型各有專屬架構
完成探索AI的魔法:PDFDAO網站UI優化的革命性步驟
用 AI 系統性優化網站 UI:PDFDAO 嘅實戰經驗,提示詞策略係關鍵
完成為了一個首頁,我設計了 20 個版本,終於明白:好的設計是磨出來的
好設計係磨出嚟:一個開發者為首頁設計20個版本嘅迭代反思
完成圖文 + 多個場景案例詳解 shadcn + tailwind 顛覆性組件開發
shadcn/ui顛覆傳統:組合式API同代碼分發打造真正可定製組件庫
完成11個APP靈感庫全攻略!設計師必備收藏!
設計師的日常需要尋找很多很多的靈感,為了滿足設計師複雜的需求,也就有了各式各樣的靈感、素材平台,但是 APP 類型的靈感網站在我印象中並不常見。所以我花了一番功夫,收集和體驗了一些 APP 靈感庫,它們各有側重,有的專攻動效細節,有的聚焦用戶流程,有的則是真機截圖的集合。建議根據具體需求來選擇使用,比如做動效時使用 60 FPS,研究競品時用 Scrnshts,梳理流程就上Pageflows。如果預算允許,Mobbin 還是相當值得付費的。1、60 FPS網站:60fps.design非常推薦!60 FPS 專注移動端動效靈感的策展,強調流暢、清晰的演示質量。站內通常按使用場景歸類(如加載、轉場、手勢等),也分設備,類型、風格等,可以針對性的細分化去瀏覽。它的價值在對微交互節奏、過渡關係和結構層級的觀察很直觀,適合動效拆解與風格參考。如果你需要拆解某個動效的實現細節,這個平台支持慢速播放功能,可以清楚地看到每一幀的變化過程。2、APP MOTION網站:appmotion.designAPP MOTION 更偏創意向的動效案例策展,覆蓋從微交互到全屏轉場。標籤體系較豐富,便於按風格或元素篩選,適合發散思維、突破視覺與動效套路。網站的視頻質量很高,支持全屏預覽,能清楚地看到動效的每個細節。:強調“創意風格探索”, 這個平台適合需要突破常規思路的創意設計師,或者做品牌類APP的團隊。3、SHOOT網站:www.shoot.desigSHOOT 聚焦“商店展示資產”的靈感參考,重點是 App Store/Google Play 截圖與應用圖標等,幫助你優化上架頁視覺與差異化表達,適合 A/B 方向靈感與版式參考。網站可以按照類型檢索,提供了 iPhone 和 iPad 兩種設備的截圖,簡單但是體驗好,很實用。4、Scrnshts網站:scrnshts.clubScrnshts是一個純粹的截圖收藏庫,收錄了眾多 自App Store和Google Play的真實應用截圖。這裏沒有花哨的動效,沒有概念設計,全是已上線產品的實戰案例。這個平台的價值在於真實性。當你需要快速瞭解某個功能模塊的主流設計方案時,在這裏搜索比翻遍整個應用商店要高效得多,當然檢索與標註粒度不如 Mobbin 系統和詳盡。5、Pageflows網站:pageflows.comPageflows 是一個專注於"完整用戶流程"記錄與展示的設計靈感庫,幫助設計師和產品經理通過真實產品的用戶流程來學習和優化自己的設計。它收錄了大量來自主流應用和網站的用戶流程錄屏、截圖和郵件示例,涵蓋註冊、付費、引導、留存觸達等關鍵業務場景 。適合使用的場景:優化轉化漏斗和關鍵業務流程(如註冊、支付、訂閲);Onboarding、Checkout 等關鍵路徑的競品對標;產品評審中需要真實案例佐證設計決策;UX 團隊學習行業最佳實踐等。Pageflows 的核心價值在於"流程可視化與檢索",但並非所有案例都有詳盡的關鍵節點標註或長文解讀。免費內容有限,大部分高級功能(如批量下載、無限書籤)需要付費訂閲6、Handheld網站:www.handheld.designHandheld Design 是一個專注於移動端設計靈感的精選平台,每週為設計師提供精心策劃的最佳移動應用設計案例,提供深度點評或拆解,確保內容質量而非數量堆砌。該平台不僅展示優秀的移動界面設計,還深入解析設計決策背後的原理,幫助設計師理解為什麼優秀的應用能夠成功。7、UI Sources網站:uisources.comUI Sources 是一個移動設計模式和交互庫,專注於幫助設計師和產品團隊通過對標世界頂級應用來節省時間。該平台收錄了數千個來自業界最佳設計應用的界面設計案例,涵蓋各種移動應用場景和交互模式,為產品開發提供行業標準的參考基準。對於獨立開發者、小型創業團隊,或者需要快速搭建原型的產品經理來說,UI Sources 能節省大量重複勞動。它也適合想學習原生開發的設計師,通過真實案例來理解實現邏輯。8、The APP FUEL網站:theappfuel.comThe APP FUEL 專注於探討設計與商業結果的關聯,不僅展示視覺效果,更關注設計決策背後的商業邏輯。該平台經常提供設計案例覆盤,分析項目的設計思路與實際效果,部分案例會結合數據驗證進行討論。相比其他純視覺展示的平台,The APP FUEL 更願意分享設計改版的得失經驗,包括一些不夠成功的嘗試與反思。內容組織上會涉及轉化率、用戶留存、訂閲轉化等商業維度的討論。9、UI LAND網站:uiland.designUI LAND 的特色是聚焦非英語地區的 APP 設計參考,收錄了中文、日文、阿拉伯文等多語言環境下的界面適配案例。對於出海團隊來說,這是研究本地化設計的有價值資源。網站按國家和地區進行內容組織,涵蓋東南亞、中東、拉美等市場的精選樣例。你可以觀察到文化差異在設計中的體現,例如不同地區的色彩使用傾向、圖標語義的差異等。平台還提供了 RTL(從右到左)佈局的參考案例,這對計劃進入阿拉伯語或希伯來語市場的團隊尤其實用。如果你的產品面向多地區市場,UI LAND 可以幫助你建立對不同文化語境下設計需求的初步認知。本地化設計仍需結合目標市場的用戶研究與可用性測試,UI LAND 更適合作為早期調研與靈感參考的起點。10、UINOTES網站:uinotes.com中文站點。側重“真實產品的完整UI截圖庫與流程參考”,聚焦已上線產品的實際界面,而非概念稿或組件庫。收錄大量上線App的完整頁面截圖與關鍵流程。適合做競品研究、界面探索與交互參考,是國內少有的 APP 靈感平台。每個APP都有非常詳細的分類和截圖,並且標註了具體日期版本號,以及原圖下載。核心價值是靈感參考與競品觀察,UINOTES是個很好的學習資源。11、Mobbin網站:mobbin.comMobbin 是當前最主流的 App 界面與流程數據庫之一,以規模與篩選能力見長。支持按平台(iOS/Android/Web)、行業、頁面類型、設計模式、組件等多維度檢索,覆蓋大量主流 App 的屏幕截圖與典型流程。平台的數據庫規模在同類工具中處於領先位置,涵蓋廣泛的頭部與新興應用。除了靜態截圖,Mobbin 還提供部分用戶流程的錄屏,便於理解完整的交互過程。付費版支持團隊協作功能,可以創建共享收藏夾,方便團隊成員同步靈感與對齊方案。Mobbin 採用訂閲制收費,對於需要頻繁進行競品研究、模式對標的移動端設計師與產品團隊來說,其內容廣度與功能完整度具有較高性價比,建議團隊評估使用頻率後再決定是否訂閲。如何高效使用這些平台分享完這11個平台,最後聊聊實際使用中的一些經驗。不同的工作階段,適合使用不同的平台。在項目前期做競品調研時,Scrnshts和Mobbin能快速提供大量真實案例,Pageflows則幫你梳理業務流程。到了創意發散階段,可以瀏覽APP MOTION和 60 FPS 尋找設計趨勢和創意方向,如果是國內產品, 則不能錯過 UI NOTES 。建議不要只是被動瀏覽,而是建立自己的收藏體系。可以用Notion、Eagle等工具建立分類收藏庫,每週固定時間集中瀏覽新案例。看到好設計時,立即思考"為什麼好"和"能否用在自己項目中"。這種主動思考的過程,比單純收藏要有價值得多。對於出海團隊,有幾個特別需要注意的點。首先要重點關注UI LAND的本地化案例,瞭解目標市場的設計偏好。SHOOT中展示的不同文化背景設計差異也值得研究。用Pageflows研究目標市場頭部APP的用戶習慣,能避免很多水土不服的問題。從模仿到創新是個循序漸進的過程。新手階段可以直接參考類似場景的設計方案,這沒什麼不好意思的。進階之後,要學會拆解設計背後的原則,組合不同平台的優點形成自己的方案。真正成熟的設計師,會在大量輸入後建立自己的設計語言和方法論。好的設計不是簡單的模仿,而是理解了設計原則之後的創造性應用。
完成Supabase的賬單出來了,我一看傻眼了...
Supabase 賬單超預期?你可能都係咁樣中招:十個數據庫每個收近十美金,月費破百。
完成出海工具推薦:Supabase 讓後端變得像拼積木一樣簡單
Supabase:AI編程最佳後端搭檔,一站式搞掂數據庫同認證
完成為什麼你總覺得別人的設計更“高級”?3個秘密找到了
設計高級感嘅秘密:呼吸感、字體層次、色彩系統,做好基礎就夠。
完成為你的界面打造一套一致的配色方案
構建一致配色方案嘅方法:從品牌色入手,用漸變分割法整色板,再處理透明色同深色模式,確保界面色彩連貫。
完成顛覆認知!我讓 AI 給我加上了 Google 登錄功能,過程簡單到離譜
用Supabase加Trae,幾分鐘為出海應用加上Google登錄
完成設計個人網站?看看這份實操指南(設計篇)
設計個人網站唔係淨係講代碼,視覺風格先係決定性因素——Rico分享由Figma到開源模板嘅完整設計流程
完成我厭倦了AI千篇一律的網頁設計,於是寫下了這套“反平庸”的通用提示詞!包含6大設計法則!
呢套「反平庸」前端設計提示詞,用六大法則逼AI跳出舒適區,造出雜誌感、電影感嘅網頁
完成如何用AI從0到1生成可編輯UI設計稿!這個教程打通了生成式UI高可用的最後一公里
用AI生成可編輯Figma UI設計稿,告別死圖片
完成我用5個AI工具搭建了一條設計流水線,效率提升10倍
用5個AI工具砌出設計流水線,效率提升10倍
完成一鍵拯救大模型的前端審美能力
安裝 Anthropic 的 frontend-design skill 可即時提升主流模型的前端審美能力,效果顯著。
完成告別“AI 塑料味”!Claude Code 加上這個“審美外掛”,你的頁面身價瞬間翻十倍
告別AI塑料味!用Claude Code Skills加UIPrompt.site提升設計質素
完成Vibecoding時代,怎麼提高設計審美。說一下我是如何系統地尋找設計參考的
AI時代審美要靠自己練,大量持續有目的地睇好作品係關鍵
完成從 Claude Code 源碼學到的 11 個設計模式
Claude Code 嘅設計精髓:簡單 while 循環,靠模型能力唔靠複雜架構
完成NanoBanana 2來了,中文支持真的很強!
NanoBanana 2中文能力大躍進,指令理解精準,風格多變
完成Lovart+Nano Banana Pro超多用法合集,這次真的對PS貼臉開大了
Lovart + Nano Banana Pro 超多用法合集,AI 生圖挑戰 PS 地位
完成智能分層+無痕改字,美圖這套AI海報小連招太絲滑了
美圖旗下 RoboNeo、美圖設計室、X-Design 三個 AI 海報工具,透過智能分層、無痕改字、一鍵套圖等功能,有效解決 AI 海報二次編輯困難、產品變形等痛點,讓設計流程更順暢。
完成聯動三大頂流模型,海螺AI新玩法分享!
海螺AI一次過接入Sora 2、Veo 3.1同自研模型,一站式玩轉頂級AI視頻生成,性價比超高。
完成分享我今年最愛的AI學習工具,一切都可以從這裏開始學。
學AI唔使從底層理論開始,用Youmind建立知識庫,帶住任務邊做邊學最實際
完成朋友們,阿真的年度總結來啦。
阿真2025年度總結:持續學習、真誠分享,做一個長期學習型創作者
完成Nano Banana Pro和頂級設計Agent Lovart會擦出怎樣的火花?
Nano Banana Pro 結合 Lovart Agent,實現動漫實景融合、經緯度打卡照同多風格 PPT 生成
完成藏師傅新工具,一鍵生成任意位置打卡照!
藏師傅用 Gemini 3 整咗個一鍵生成任意位置打卡照嘅工具
完成藏師傅用 Nano Banana Pro 幫你想去哪就去哪
藏師傅用Nano Banana Pro整咗個Banana Camera,輸入經緯度即時生成打卡照,仲可以穿越時空
完成視頻進入可編輯時代:藏師傅教你視頻版 Banana 可靈 O1
可靈 O1:用自然語言直接編輯視頻,藏師傅教你點樣做到精細控制
完成將你的旅行記憶放在罐子裏|🍌提示詞
將旅行記憶封存喺玻璃罐入面,呢個提示詞幫你生成夢工廠風格嘅微縮模型圖像