workflowstacks
ai-agent

iphone

Recreate the Apple iPhone 15 Pro website, combining GSAP animations and Three.js 3D effects. From custom animations to animated 3D models, this tutorial covers it all.
1,656 stars+2★ this week317 forksJavaScriptUpdated 7/12/2024100% free · open source
What it does

Provides a ready‑to‑run codebase that reproduces the Apple iPhone 15 Pro product page with GSAP animations and Three.js 3D visual effects.

When to use it
  • •You need a high‑impact product landing page that showcases 3D product models with smooth scroll‑triggered animations.
  • •Your startup wants to demo a hardware device and needs a web‑based interactive showcase without building everything from scratch.
  • •You want a learning reference for combining GSAP timelines with Three.js scenes in a modern React/Vite setup.
Ready-to-paste prompt
npm run dev -- --port 3001   # start the dev server on a custom port to avoid conflicts
Heads up: The project requires Node >= 16 and a modern browser; Three.js will fail to load locally if you open index.html directly – always run it through the Vite dev server or a static server.
Saves to your device
Use with Claude
New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install
Claude Code
mkdir -p ~/.claude/skills/iphone && curl -fsSL https://workflowstacks.com/api/skills/iphone/claude-skill -o ~/.claude/skills/iphone/SKILL.md
Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)
claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How iphone works
Codeflow
Free to inspect

Iphone is a small JavaScript project (~1.1k lines across 21 code files). Setup is light: install Node.js, run one command. Last commit 28 months ago, no license file, no tests found.

Size
Small codebase
~1.1k lines · 21 code files · 9 min skim
Setup
Light setup
Install Node.js, run one command.
Runs on
Node.js
No API keys detected
JavaScript 93%CSS 6%HTML 1%
Where to start reading
  1. 1
    README.md
    Start here — what it does and how to install it
  2. 2
    package.json
    Dependencies and the commands it exposes
  3. 3
    src/App.jsx
    Inside src/ — the main logic begins here
What's in each folder
src/Core code — the actual logic18 files
public/Images & static assets28 files
READMENo tests foundThin docsNo CINo licenseLast update 28 mo ago
Quick Actions
Details
Creator
adrianhajdin
Language
JavaScript
Category
ai-agent
Published
3/15/2024

Are you the creator of this tool? and earn 85% of every sale.

Show it off in your README:

Featured on WorkflowStacks
[![Featured on WorkflowStacks](https://workflowstacks.com/api/badge/iphone.svg)](https://workflowstacks.com/skills/iphone?utm_source=github&utm_medium=badge)
🔥 Hot this week, in your inbox
Skills like this, every Monday.

The five fastest-growing open-source AI skills, ranked by GitHub star growth. One email a week, unsubscribe anytime.

Related skills

More ai-agent tools founders pair with this one.

ai-agent★ 303,229
superpowers
An agentic skills framework & software development methodology that works.
ai-agent★ 277,154
Track GitHub Stars with 996.ICU
Get a popular GitHub star counter for your startup, backed by 276k+ GitHub stars, ideal for founders.
ai-agent★ 253,101
Linux – 251k+ GitHub stars for building custom kernel solutions
Get the complete Linux kernel source in C, perfect for founders needing deep system control or tailored OS components.
ai-agent★ 32,760
floating-ui: Precise UI positioning for sleek dropdowns and tooltips
Leverage floating-ui’s TypeScript library to flawlessly position menus, popovers, and tooltips—ideal for founders building polished web interfaces. 33k+ GitHub stars.
ai-agent★ 55,961
CLIProxyAPI: Free AI Models
Access free Gemini, GPT, Grok, Claude models through API, for startup founders, backed by 45k+ GitHub stars
ai-agent★ 38,176
CopilotKit: Build Agent‑Powered UI Faster with 38k+ GitHub Stars
Empowers founders to create AI‑agent interfaces across React, Angular, mobile, Slack and more—ideal for teams building generative UI and next‑gen assistants.