Help us improve
Share bugs, ideas, or general feedback.
From erne-universal
Builds, reviews, animates, and analyzes React Native/Expo UI with Apple Human Interface Guidelines, including spring physics, semantic colors, compliance scans, video motion extraction, and design tokens.
npx claudepluginhub jubakitiashvili/everything-react-native-expoHow this skill is triggered — by the user, by Claude, or both
Slash command
/erne-universal:higThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
- Building UI components with Apple-quality design (spring physics, semantic colors, 8pt grid)
Generates token-bound mobile UI components for React Native, SwiftUI, Flutter, or Jetpack Compose from design tokens and aesthetic intent. Ensures platform-specific rules and verifies token references.
Designs structured specs for iOS animations covering transitions, micro-interactions, gesture-driven motion, and loading states. Useful for planning screen transitions, navigation, onboarding, or motion before coding.
Guides iOS app development per Apple's Human Interface Guidelines, covering interface design, accessibility (VoiceOver, Dynamic Type), dark mode, touch targets, animations, haptics, and permissions.
Share bugs, ideas, or general feedback.
Detect intent from the user's message and route to the appropriate mode:
| Intent Keywords | Mode | What Happens |
|---|---|---|
build, create, make, design, component | Build | Apply HIG rules while creating UI |
review, check, scan, audit, compliance | Review | Run HIG scanner on source files |
animate, motion, spring, gesture, transition | Animate | Implement animations with HIG physics |
video + file path | Analyze | Extract motion spec from reference video |
tokens, theme, design system | Tokens | Generate HIG design tokens |
| No clear intent | Interactive | Ask what the user wants |
When building UI, load and apply these rules from design/hig/rules/:
design-system.md (typography, colors, spacing, corners)animation.md + craft.md (spring physics)patterns.md (sheets, tabs, transitions)Non-negotiable requirements:
borderCurve: 'continuous' on all rounded elementsuseReducedMotion with any animationexpo-haptics on key interactionsuseColorSchemewithSpring, never withTiming with linear easingSpring presets (use from design/hig/index.ts):
smooth: default for most transitionssnappy: button presses, togglesbouncy: playful elements, celebrationsgentle: background, ambient motionRun the HIG scanner from design/scanner/:
/erne-hig review ./src/screens/
/erne-hig review ./src/components/Button.tsx
Output: violations grouped by severity (critical → low), HIG score (0-100), grade (A-F), and fix suggestions.
Integrate with /erne-quality-gate — scanner runs automatically alongside code-reviewer and performance-profiler.
Load craft.md + animation.md rules. Key patterns:
FadeIn.duration(300).springify() — never abrupt appear/disappearwithDecay for momentum, snap points with withSpringuseAnimatedScrollHandler + interpolate with Extrapolation.CLAMPProcess reference video through design/video/:
/erne-hig video ./reference.mp4
Auto-detects project stack, generates Reanimated/Gesture Handler code matching the video's motion patterns.
Generate typed design tokens from design/tokens/:
/erne-hig tokens
Creates theme/hig-tokens.ts with colors, typography, spacing, shadows — ready for useColorScheme and StyleSheet.create.