An NFT collector bought a 3D animated art piece, but viewing it in a 2D browser is dull. We solve this by embedding an AR preview NFT function in a mobile app that lets users "hang" the NFT on their wall or place the 3D sculpture on a table. The user sees the art in real space — adding value to the NFT as a physical collectible. Our team has 7+ years of mobile development experience and has delivered over 50 projects in web3 and NFT.
Why AR Preview Increases NFT Value
The AR preview NFT feature turns a digital asset into an interactive exhibit. Owners can show off the art to friends, take photos for social media, and gain a new interactive experience. This boosts NFT liquidity and attracts buyers looking for a unique display method.
Types of NFT Content and AR Render
| NFT Type | Format | AR Render | Notes |
|---|---|---|---|
| 2D | JPEG/PNG/GIF | SCNPlane with material, texture from IPFS | Vertical placement, GIF animation frame-by-frame via CGImageSource |
| 3D | glTF/GLB | GLTFSceneKit (iOS) / SceneView (Android) | Convert to USDZ, support PBR materials |
| Video | MP4/WebM | AVPlayerItem as texture | Loop, optional sound |
2D NFT
Simplest case: create a virtual frame (SCNPlane with material), load texture from IPFS or HTTP URI from token metadata. Place on a vertical surface via ARPlaneDetection.vertical. Animated GIF — decode frame-by-frame via CGImageSourceCreateWithData, update texture on a timer.
3D NFT
More projects are releasing 3D sculptures. On iOS, load via GLTFSceneKit or convert to USDZ on the fly using ModelIO (MDLAsset → export USDZ). On Android, SceneView (Filament-based) from Sceneform 2.0 natively supports glTF.
Video NFT
SCNMaterialProperty accepts AVPlayerItem as texture content — the NFT video plays directly on the AR surface in real time. Loop, sound optional.
How to Load Content from NFT Metadata
The ERC-721/ERC-1155 metadata standard includes image and optionally animation_url. For an AR preview NFT, the steps are:
- Query tokenURI via JSON-RPC (eth_call) using tokenId and contractAddress, or via Alchemy/Moralis/OpenSea API.
- Fetch the JSON metadata containing
image,animation_url,properties. - If the URI starts with
ipfs://, convert via a public gateway (e.g., gateway.pinata.cloud) or your own IPFS node. - Download the media file, cache locally.
IPFS loading can be slow on public gateways. We recommend aggressive caching: on first view, write to URLCache with a large diskCapacity (500 MB+), which reduces load times by up to 3x compared to relying solely on public gateways.
Placement for Art Objects
Wall hanging (2D art)
Scan vertical surfaces via ARPlaneDetection.vertical. Issue: ARKit detects vertical planes slower than horizontal, especially on smooth walls. We add a manual placement mode: drag to position, pinch for scale, rotation gesture for angle.
3D sculpture on a surface
ARPlaneDetection.horizontal + raycast from screen center → place object on detected plane. Use ARRaycastQuery instead of outdated hitTest. Snap to plane when moving: track ARPlaneAnchor updates, lock object's Y coordinate to plane.
Photo for social media. A key feature for NFT audience. Capture ARView via ARView.snapshot(saveToPhotoLibrary:) (RealityKit) or SCNView.snapshot() (SceneKit). Add UI overlay with NFT name and collection before saving — via UIGraphicsImageRenderer.
Rights and Watermark
Some NFT projects restrict commercial use. In an AR context, it's important not to infringe IP rights when creating derivative content: screenshots with the app logo are not considered derivative works, but it's best to consult a lawyer for specific projects. We include compliance checks with App Store Review Guidelines (Section 4.2/5.1) in our scope.
What's Included in the Work
What's Included
- Analysis of NFT metadata and integration with your smart contract
- Implementation of AR viewing with 2D/3D/video content support
- Setup of caching and IPFS gateway handling
- Integration of the "Take Photo for Social Media" button with watermark
- Compliance check with App Store Review Guidelines (Section 4.2/5.1)
- API and configuration documentation
Platform Comparison: iOS vs Android
| Parameter | iOS (ARKit) | Android (ARCore) |
|---|---|---|
| Plane detection | ARPlaneDetection.vertical + horizontal | PlaneFindingMode.Horizontal + Vertical |
| glTF loading | GLTFSceneKit / ModelIO | SceneView (Filament) |
| Snap | snapshot() (SCNView/ARView) | takeScreenshot() on SurfaceView |
Timeline: AR preview for 2D/3D NFT in an existing Web3 app — 3–5 weeks. Full AR gallery experience with custom frames, 3D sculptures, and sharing — 6–10 weeks. Cost is calculated individually, but a basic 2D NFT AR preview starts at $5,000. Thanks to ready components the integration costs 30–40% less than greenfield development. We offer a satisfaction guarantee on our AR integration services. Get a consultation for your project — contact us for an estimate. Leave a request, and we will prepare a proposal for you.