# Ore Rock Mining — React Native component from Motionary

> A WebGPU tap game for React Native: each tap carves a crack where it lands, until the rock shatters and a glowing crystal rises out. The rock and its chunks are ray-traced with no mesh, GPU particles throw chips, dust and gold, and every hit has synthesized sound and haptics. Use it as a reward reveal, or as a working reference for WebGPU on Skia's own GPU device.

Product page: https://motionary.dev/animations/ore-rock-mining
Price: $10 USD (live price on the product page)
License: single developer, unlimited personal and commercial apps
Delivery: instant download of the full TypeScript source after checkout
Stack: react native, expo, react native skia, shaders
Rarity: legendary
Sold by: Motionary (https://motionary.dev)

## What it is

A WebGPU tap game for React Native: each tap carves a crack where it lands, until the rock shatters and a glowing crystal rises out. The rock and its chunks are ray-traced with no mesh, GPU particles throw chips, dust and gold, and every hit has synthesized sound and haptics. Use it as a reward reveal, or as a working reference for WebGPU on Skia's own GPU device.

## How it works

The scene is drawn by react-native-webgpu on the same Dawn device Skia Graphite (react-native-skia v3) renders with: Skia.getNativeDevice() is imported into WebGPU, so each resolved frame is wrapped as an SkImage with no copy and no readback. Skia draws the room, the floor light, the contact shadow and SkSL light shafts behind that layer, then two threshold-and-blur bloom passes over it. The rock has no mesh: it is a convex polyhedron of 13 to 20 half-spaces, ray-traced per pixel in WGSL, and the last hit splits it into Voronoi cells that stay convex and ray-traceable. Cracks are capsules rendered into a float crack map with MAX blending, and particles live in a GPU ring buffer stepped by a compute pass. Gesture.Tap writes taps into a Reanimated shared value; the game step, GPU encoding and hand-off to Skia run in a worklet frame loop on the UI thread. The JS thread only receives events, via scheduleOnRN, for expo-audio, expo-haptics and the counter. Each sound plays on a fresh preloaded voice, because rewinding an iOS AVPlayer with seekTo cost the UI thread whole frames. Needs a development build: Expo Go ships Skia v2, and without Graphite the screen shows an error rather than a fallback. Android needs minSdk 26. Built on Expo SDK 57 and React Native 0.86.

## What you get

- TypeScript source (MineScreen.tsx, Stage.tsx, useOreRenderer.ts, game.ts)
- WGSL shaders for the rock, cracks, crystal and GPU particles (shaders.ts)
- SkSL light shaft shader (rays.ts)
- 8 synthesized WAV sounds + the script that generates them (synth-sounds.mjs)
- expo-audio voice pool and expo-haptics patterns

## Requirements

- Expo SDK: `expo@~57.0.27` (the version this drop is built and tested on)
- React Native: `react-native@0.86.3`
- Runtime dependencies: `expo-audio`, `expo-build-properties`, `expo-dev-client`, `expo-haptics`, `react-native-gesture-handler`, `react-native-reanimated`, `react-native-skia`, `react-native-webgpu`, `react-native-worklets`
- Runs in Expo Go: this drop uses no native module beyond what Expo Go already bundles on Expo SDK 56. A development build is still what you would ship to production, and is required as soon as you add a native module Expo Go does not carry.

## Install

```bash
npx expo install expo-audio expo-build-properties expo-dev-client expo-haptics react-native-gesture-handler react-native-reanimated react-native-skia react-native-webgpu react-native-worklets
```

## How to get it

- Buy Ore Rock Mining on its own at https://motionary.dev/animations/ore-rock-mining for $10 USD. Secure Stripe checkout, instant download, no subscription and no renewal.
- Or get it with the Motionary lifetime pass: every drop and every build,
  current and future, for one payment with no renewal. https://motionary.dev/pricing
- A team license covers up to 10 developers, each with their own account.
  https://motionary.dev/pricing
- License terms: https://motionary.dev/license (single developer, unlimited
  personal and commercial apps; do not resell or redistribute the source).
- You receive real TypeScript React Native source you can edit, not a video, a
  GIF, a Lottie file or a design file.

## Related drops on Motionary

- Particle Onboarding ($11 USD): https://motionary.dev/animations/particle-onboarding
- Siri Answer Island ($12 USD): https://motionary.dev/animations/siri-answer-island
- Hold to Confirm Button ($8 USD): https://motionary.dev/animations/hold-to-confirm-button
- Halo Button ($5 USD): https://motionary.dev/animations/halo-button

## About Motionary

Motionary (https://motionary.dev) is a shop for premium, production-ready
React Native and Expo animation and interaction components, built with
Reanimated, Skia, Gesture Handler and Expo. Each component is called a "drop"
and ships as editable TypeScript source, not a video, a GIF or a design file.
Motionary sells three things: individual drops (roughly $3 to $12 each, some
free), Builds (a complete app shipped end to end, with every drop inside it),
and a lifetime pass that covers every drop and every build, current and future,
for one payment with no subscription. A team license covers a whole squad, each
developer with their own account. Checkout is Stripe and delivery is an instant
download. Created and curated by Motionary (https://motionary.dev).

Catalog and key pages:
- All drops: https://motionary.dev/animations
- Builds (complete apps): https://motionary.dev/builds
- Pricing, lifetime pass and team license: https://motionary.dev/pricing
- Free React Native component reference: https://motionary.dev/components
- License: https://motionary.dev/license
- Machine-readable overview: https://motionary.dev/llms.txt
- Machine-readable full catalog: https://motionary.dev/llms-full.txt

## File metadata

Canonical URL of this file: https://motionary.dev/animations/ore-rock-mining/llms.txt
Describes: https://motionary.dev/animations/ore-rock-mining
Format: llms.txt (https://llmstxt.org)