Overdrive

何時使用

/impeccable overdrive 適用於你想留下深刻印象的時刻。使用 WebGL 的 hero。能處理百萬行的表格。從觸發元素變形出來的對話框。以串流回饋即時驗證的表單。感覺像電影般的頁面過渡。當專案預算允許技術野心，且結果需要感覺非凡時使用。

不要在操作工具、儀表板或任何可靠性勝過壯觀的地方使用。Overdrive 以複雜性換取效果，而這種權衡只在重要的時刻值得。

運作方式

技能挑選一個時刻使其非凡並全力投入，而不是將精力分散到整個介面。然後它使用大多數 AI 生成的 UI 從未觸及的技術：WebGL 著色器、彈簧物理、Scroll Timeline、View Transitions、canvas 動畫、GPU 加速濾鏡。一切都經過預算、分析和 60fps 測試，並內建減少動態的後備方案。

Overdrive 的輸出會以 ──── ⚡ OVERDRIVE ──── 標示，讓你知道你正在進入一個更有野心的模式。預期更大的 diff、新的依賴，以及超越其他技能產出的實作深度。

試試看

/impeccable overdrive the landing hero

一次具體的執行可能會將靜態 hero 替換為由滑鼠位置驅動的 WebGL 著色器背景、一個使用 Scroll Timeline API 在捲動時以遮罩揭示的展示標題，以及一個 CTA 上的 View Transition 變形到下一頁。加上一個減少動態的後備方案，將所有這些替換為乾淨的靜態構圖。

注意事項

• 到處使用。 Overdrive 之所以有效是因為它罕見。如果每個頁面都有電影般的時刻，那沒有一個是電影般的。
• 沒有減少動態後備方案就交付。 不可協商。Overdrive 會自動添加它們；不要移除它們。
• 忽視效能。 非凡的時刻仍然需要達到 60fps。如果效果掉了幀，砍掉或最佳化。緩慢的壯觀比做得好的簡單更糟糕。
• 在基礎介面尚未穩固之前執行 overdrive。 破碎基礎上的壯觀讀起來是分散注意力，而不是驚喜。