Class LLL / 設計星團教材目錄編輯與來源

Figma Design 教材 / Class LLL

原型點了沒反應：先查熱點、觸發與導向

起點、編輯對象與目前播放頁，各有責任

先分設計框架與流程起點，再查目前頁的熱點、觸發條件、動作與目的地。用兩頁信號盤比較點擊時／tap與Enter、導覽至與返回，重播與補讀返回都保有可解釋的脈絡。

撰寫與維護：Class LLL · Lab Light Label｜預估閱讀 13 分鐘

開啟互動教材查看參考來源

閱讀目標

適用條件與學習範圍

按鈕有連線，為什麼點了仍留原頁？你正在操作哪個框架的熱點、送入什麼事件，動作又要去哪裡？

能按熱點、觸發條件、動作、目的地逐項找缺口，重走兩頁原型；知道返回依前頁而非固定畫面，原型連線不等於真產品已完成。

只做兩個頂層框架、各一熱點、click／tap或Enter、導覽至／返回及明示未設互動案例。最多八筆教學歷史，不求解真Figma所有播放／狀態規則、覆蓋層、轉場、變數、條件、捲動或產品資料。

原理與判斷

畫面上有按鈕只是設計外觀；原型要另外告訴Figma在哪個物件接收什麼輸入、執行哪個動作。熱點可能是按鈕、圖像、文字或框架，並不是看到藍線就能確定每個點擊都有回應。先查對象與事件，比反覆重拉線更容易定位問題。 流程起點決定從哪個頂層框架開始，目的地決定這次導覽至去哪裡，而返回則依已走過的前頁。編輯連線、選流程與播放中的目前頁是三件事。本站用可見信號及有限歷史呈現差別，不把原型當已寫好的前端或資料服務。

設計框架與流程不是同一份資料

設計框架承載畫面與圖層；流程是由互動連起來的框架網路。起點放在頂層框架，一個框架最多一個starting point，同一框架可參與多個流程，抵達共享框架後可使用它的其他互動。本台A是方法列表、B是方法詳情，各有一個熱點；不是把框架內所有像按鈕的物件都自動變成連結。

選起點，與從起點重新開始

在原型分頁選起始框架，流程 starting point旁按+；也可由第一個新連線自動建立起點，但要確認它是否符合要測的旅程。空白處取消選取後可看Flows清單、命名及預覽。改起點只改流程入口，不是刪去其他框架或把目前預覽頁強制當作入口；本台必須按「從起點重播」才切到該頁並清歷史。

熱點、連線與目的地要能逐一指出

選擇框架內要互動的物件，原型中拖plus到目的框架，或用Interactions的Add後設定。Hotspot是接收輸入的對象，connection是定義互動的連線，目的地是動作要去的地方。大部分導頁目的地需頂層框架；捲動至有同框內目標的另一條件，不在本台。不要把兩個框架靠在一起、命名相同或視覺對齊當已連線。

Trigger問何時，動作問發生什麼

Interaction details分開Trigger、動作、Destination與動畫等設定。點擊時／On tap接點擊／觸控，Key／Gamepad可指定Enter等按鍵；選Enter後，點擊仍不是Enter，所以本台留原頁並顯示事件不符。官方還有拖曳時、懸浮期間／pressing、指標進入／leave、延遲與影片相關觸發條件，各有條件，本站不把它們硬當click或代做其語義。可用鍵盤輸入框送真Enter，手機另有同事件按鈕替代。

導覽至指定框架，返回取前頁

導覽至用於整頁之間移動，需要指定目的框架；本台執行後把原框架放進教學歷史。返回回到實際上一個畫面，不需要指定固定目的地：從A到B再返回回A；若從B起播、沒有前頁，本站明示留B，不編造A作歷史。返回是動作；若官方連線概述誤稱「返回觸發條件」，仍以動作專文及功能分類判讀。Open link／覆蓋層／變數／條件等是其他動作，不是本票的完整交付。

編輯連線不等於剛剛已觸發

本台選擇編輯A或B，只修改該框架內熱點的觸發條件／動作／目的地。播放目前在B時改A，不會偷替B執行A的設定；送事件永遠到目前框架的熱點。選「未設互動」是本站刻意斷路案例，不是Figma原生動作選單項目。停止後先問目前頁、物件、輸入是否吻合，再查目標，而非讓任意操作都成功跳頁。

在預覽或播放中重走，不靠畫布選取判定成功

設計需在框架內才能預覽／播放。預覽可在編輯器旁逐項觸發，頂部預覽或Shift+Space開啟；播放開新分頁，macOS Command+Option+Return、Windows Control+Alt+Enter。從流程起點重播，再依熱點走A→B→返回，記下卡在哪個物件。Figma播放器另有左右箭頭及畫布排序等導覽，不代表每一個框架已有正確互動；本站只驗指定熱點，不模擬播放器所有捷徑。

原型返回與本站返回是兩條歷史

原型返回屬於示意產品流程；本頁Reader返回或瀏覽器返回則回到你補讀前的教學頁。本站把兩者分開，本台導覽不改hash或呼叫瀏覽器history。你可以從本頁補讀框架後返回，仍保熱點設定、目前框架及教學歷史。分享此教材路由只分享教材入口，並非分享一份已發布Figma 原型或帶走所有本地紀錄。

能點通的原型，還不能證明產品已做好

這些框架只模擬流程，可用於討論、檢查假設及收集回饋；沒有自動產出網站路由、驗證輸入、登入、資料庫或真實付款。官方列任何團隊／方案可建立基礎原型但需可編輯，可檢視可於Presentation播放；檔案分享權限仍適用。本站沒寫入Figma帳戶、沒建立原型連結，也沒有真人測試成效證據。進一步的覆蓋層、智慧動畫、互動元件與變數另有具名邊界，不能只列名稱就宣稱全教完。

步驟與觀察

  1. 準備兩個有內容的框架

    建立A列表與B詳情頂層框架，在各自內放一個要測的熱點物件，先確認父子歸屬。 操作名稱對照（中文為本站教學譯名）： 右側原型 > 流程 starting point > +（介面原文：右側 Prototype > Flow starting point > +） 原型 > Interactions > Add（介面原文：Prototype > Interactions > Add） 選hotspot > 拖plus連向目的地框架（介面原文：選hotspot > 拖plus連向destination Frame） Interaction details > Trigger／動作／Destination（介面原文：Interaction details > Trigger／Action／Destination） 頂部預覽／播放（介面原文：頂部 Preview／Present）

  2. 設定流程 starting point

    選A，原型 > 流程 starting point旁按+並命名；本站選起點A後按從起點重播。

  3. 為A熱點建立導覽

    選A內物件，在原型拖plus到B，或Interactions按Add；設點擊時／tap、導覽至、目的地 B。

  4. 為B熱點設定返回

    選B內返回物件，設點擊時／tap及返回；此動作不硬填A目的地。本站可切編輯B再核設定。

  5. 播放並診斷不符合的事件

    開預覽或播放，A點進B再返回。把A 觸發條件改成Enter後重播，先點擊看不符，再送Enter，確認動作與歷史。

  6. 換起點並重走

    改B為起點，重播後返回沒有原本A路徑；分清指定導向與前一頁，核權限與真稿內容，補讀後返回保本台狀態。

常見問題

按鈕看起來能按卻沒反應

核目前框架內是否真有熱點互動、是否送入所設觸發條件；別把外觀或未連線物件當功能。

改A設定卻在B測試

分清編輯來源與目前播放頁；重播到A或修改B自己的熱點，再送事件。

起點換B後返回沒有回A

A沒有在這段已走歷史中，返回不是固定A；若意圖永遠回A，應考慮導覽至 A而非臆造歷史。

點擊時測得動，Enter卻不動

鍵盤事件需要相應觸發條件，確認Key／Gamepad設定與焦點；本站輸入框送Enter，按鈕替代同事件不代表原生任意鍵盤皆通。

預覽箭頭能翻頁就以為連線完成

播放器可能依座標或歷史切畫面；改從起點，逐個觸發指定熱點，檢查動作與目的地。

把原型分享當已上線產品

它仍是設計流程示意；真路由、權限、資料驗證及服務需另實作，不能以點通或看過標記證明。

適用範圍與證據

原教材查核日期：2026-10-22 適用範圍：Figma Design基礎原型任何團隊／方案，建立需可編輯、Presentation播放可檢視；Windows／macOS播放快捷鍵分列。進階動作、分享及產品服務不由基礎所有方案外推。 來源狀態：2026-10-22以Scrapling get --ai-targeted新查六篇官方專文，含flow、connect、trigger、action與play。連線概述對Back的trigger用詞，以actions專文判作action。未由名稱補猜全套trigger或狀態管理規則。 示意限制：原創雙屏信號盤：A/B各一熱點、click/tap與Enter、navigate/back及未設互動案例；事件、動作、current及最多八筆教學history共用同模型。純本站有限示意，不呼叫真Figma或瀏覽器導頁，不模擬覆蓋層、動畫、變數／條件／重設。 原生軟體實測：未原生Figma建立連線、預覽／播放、分享或跨裝置實測；本站瀏覽器操作與官方查核分開。 學習成效驗證：未真人流程試用、可用性或學習遷移成效實測。

參考來源

來源依原教材逐頁維護；本次建立閱讀網址不代表重新完成原生軟體或真人學習測試。如遇版本差異或內容錯誤，歡迎來信提出具體段落與版本。

相關知識