Trainiq Ui Motion

Animation Patterns

• Shared Elements: Use SharedTransitionLayout (Compose 1.7+) for transitions between HomeScreen and WorkoutScreen.
• Shimmer Effects: Implement custom shimmers for all loading states. Do not use generic circular progress indicators for main content.
• Predictive Back: Ensure all navigation flows support Android's predictive back gesture.

Micro-interactions

• Haptics:
  • HapticFeedbackType.LongPress for editing sets.
  • HapticFeedbackType.TextHandleMove for scroll snapping in timers.
• AnimatedVisibility: Use expandVertically + fadeIn for adding new sets to a workout.

Verification Checklist

• Does the app look consistent in both Light and Dark modes?
• Is the "Looming" effect (subtle scale animation) applied to the primary CTA buttons?
• Do animations run at a smooth 60/120 FPS on target devices?