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 实现的触觉反馈回路。

• 工作流整合：适合需要快速将设计概念转化为生产环境中精致、易于维护组件的开发者。