frontend-app-design

此技能作為 React Native Expo 開發的專業設計系統專家。它專注於超越通用模板，創建工業級、美學上令人驚豔的行動介面。該技能強制嚴格遵守 iOS 人機介面準則，同時利用液態玻璃、基於深度的分層以及精緻的物理運動學等現代設計原則。使用者可利用此技能生成既功能強大又在視覺上令人難忘的螢幕、元件或完整設計系統。

• 進階 UI/UX 實作：使用 Tailwind CSS (NativeWind)、用於流暢 60fps 動畫的 Reanimated 以及用於高保真半透明效果的 expo-blur，生成生產就緒的 React Native 程式碼。

• 液態玻璃美學：透過磨砂玻璃效果、分層表面和精心安排的透明度，實現深層的視覺層級，提供現代且具觸感的體驗。

• 字體與色彩系統：透過 @expo-google-fonts 策劃獨特且具表現力的字體搭配，並使用強而有力的配色方案，避免平庸的 AI 設計模式。

• 空間與觸控優先設計：強調行動裝置人體工學、拇指區域最佳化以及符合無障礙準則的觸控目標（最小 44pt）。

• 情境化設計思考：強制執行大膽的美學承諾，無論是極簡主義、粗野主義還是極繁主義，確保最終介面與應用程式的特定品牌識別相符。

• 輸入要求：提供畫面用途、目標受眾、技術限制以及期望的美學方向（如：粗野主義、奢華、趣味）。

• 技術堆疊相容性：專為 Expo SDK 53+、React Native Reanimated、Zustand 和 React Query 整合而設計。

• 美學護欄：主動防止通用 AI 美學，如標準系統字體或過度使用的紫色漸層。

• 迭代優化：鼓勵高衝擊力、記憶點驅動的設計選擇，例如交錯顯示、手勢互動，以及透過 expo-haptics 實現的觸覺回饋迴路。

• 工作流整合：適合需要快速將設計概念轉化為生產環境中精緻、易於維護元件的開發者。