AnimFont Locker
Pin custom fonts and typographic assets to IPFS for permanent reuse in animated titles.
IPFS via Pinata· decentralized storage
Section · Onchain
full primer →The primitive.
Every typography asset vault artefact is pinned to IPFS through Pinata; filmmakers get a permanent CID and a public gateway preview instead of a fragile cloud URL.
Why this primitivePinata JWT ensures immutable hosting of font files and JSON usage data.
Kernel
a Pinata JWT upload that pins images / JSON / manifests to IPFS and returns a permanent CID
Drives the UI as
a 'pinned to IPFS' chip with the CID and an ipfs.io gateway preview
Required keys.
OPTIMISM_SEPOLIA_RPC_URL
Alchemy Optimism Sepolia HTTPS endpoint (or https://sepolia.optimism.io).
open ↗ETHERSCAN_API_KEY
Single Etherscan v2 key — covers Optimism Etherscan (chainId 11155420) with no extra key.
open ↗Add these in your Lovable project under Settings → Secrets before pasting the prompt below.
Appendix · Mega-prompt
The build prompt.
budget · 1 message
Paste into a fresh Lovable project. Make sure all five secrets above are set first. read the build strategy →
Build "AnimFont Locker" in ONE Lovable message. Single-page demo.
CONCEPT
Pin custom fonts and typographic assets to IPFS for permanent reuse in animated titles.
Discipline: Filmmaking & Animation (typography asset vault).
Onchain primitive: IPFS via Pinata. Why this primitive: Pinata JWT ensures immutable hosting of font files and JSON usage data.
5-CREDIT BUDGET (HARD LIMIT):
- ONE single-page app. No router, no Lovable Cloud, no database, no auth flows beyond Privy drop-in.
- ONE Solidity contract, <=80 lines, deployed to Sepolia, verified on Etherscan.
- Privy is always the auth + sponsored-tx layer (Google login, embedded wallet).
- Pinata/IPFS only if the idea genuinely needs to store a file or metadata.
- At most ONE AI call per user action (use Lovable AI Gateway with LOVABLE_API_KEY if AI is part of the idea).
- Skip tests, skip CI, skip docs pages. Ship the demo, nothing else.
STACK
- React + Vite single page (the index route).
- Privy embedded wallet wraps `<App />` in src/main.tsx:
<PrivyProvider appId={import.meta.env.VITE_PRIVY_APP_ID}
config={{ loginMethods:['google'], embeddedWallets:{createOnLogin:'users-without-wallets'},
defaultChain:{ id: 11155111, name:'Sepolia' } }}>
- All txs via Privy `useSendTransaction` with `{ sponsor: true }` (zero-gas for the user).
- src/lib/pinata.ts uploads via `fetch('https://api.pinata.cloud/pinning/pinFileToIPFS', { method:'POST', headers:{ Authorization: `Bearer ${import.meta.env.VITE_PINATA_JWT}` }, body: fd })`.
- Hardhat in /contracts (kept outside the Vite bundle). Install
`@nomicfoundation/hardhat-toolbox` AND `@nomicfoundation/hardhat-verify@latest`
(>=3.x — older versions still hit Etherscan v1 and fail with
"You are using a deprecated V1 endpoint, switch to Etherscan API V2").
- hardhat.config.cjs MUST use the Etherscan v2 single-key shape (NOT the per-network map):
require("@nomicfoundation/hardhat-toolbox");
require("@nomicfoundation/hardhat-verify");
module.exports = {
solidity: { version: "0.8.24", settings: { optimizer: { enabled: true, runs: 200 } } },
networks: { sepolia: {
url: process.env.SEPOLIA_RPC_URL, // Alchemy HTTPS endpoint, REQUIRED
accounts: [process.env.METAMASK_PRIVATE_KEY.startsWith("0x")
? process.env.METAMASK_PRIVATE_KEY : "0x" + process.env.METAMASK_PRIVATE_KEY],
chainId: 11155111,
} },
etherscan: { apiKey: process.env.ETHERSCAN_API_KEY }, // single string, NOT { sepolia: ... }
sourcify: { enabled: false }, // silences the v2.x prompt
};
- Deploy: `npx hardhat run scripts/deploy.cjs --network sepolia`.
- Verify (run RIGHT AFTER deploy, no constructor args for these contracts):
`npx hardhat verify --network sepolia <address>`
On success Etherscan returns "Successfully verified contract … on the block explorer"
and the source becomes readable at
`https://sepolia.etherscan.io/address/<address>#code`.
- Frontend reads: create a viem public client with the Alchemy URL too —
`createPublicClient({ chain: sepolia, transport: http(import.meta.env.VITE_SEPOLIA_RPC_URL) })`.
Expose SEPOLIA_RPC_URL to the client by also setting VITE_SEPOLIA_RPC_URL to the same value.
- Write the deployed address to `src/data/contract.json` so the UI links to
`https://sepolia.etherscan.io/address/<address>`.
CONTRACT (contracts/AnimFontLocker.sol):
```solidity
// SPDX-License-Identifier: MIT
pragma solidity ^0.8.24;
/// @title CIDLogAnimFontLocker
/// @notice Pin custom fonts and typographic assets to IPFS for permanent reuse in animated titles.
/// @notice Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14
contract CIDLogAnimFontLocker {
event Logged(address indexed author, string cid, uint256 at);
/// @notice Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14
function log(string calldata cid) external {
emit Logged(msg.sender, cid, block.timestamp);
}
}
```
USER FLOW
1. Land on page -> 'Sign in with Google' (Privy) -> embedded wallet auto-provisioned.
2. On submit, pin the typography asset vault artefact to Pinata, then call `log(cid)` on the contract via Privy sponsored tx. Render the CID, IPFS gateway preview, and Etherscan tx link.
3. Footer renders: "Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14"
REQUIRED SECRETS (Lovable -> Project Settings -> Secrets):
- METAMASK_PRIVATE_KEY Sepolia deployer key. Fund it: https://cloud.google.com/application/web3/faucet/ethereum/sepolia
- SEPOLIA_RPC_URL Alchemy Sepolia HTTPS endpoint (https://eth-sepolia.g.alchemy.com/v2/<key>). Create a free app at https://dashboard.alchemy.com/ -> copy the HTTPS URL. Public RPCs throttle/fail under hackathon load — Alchemy is required.
- ETHERSCAN_API_KEY For `npx hardhat verify`. Get: https://etherscan.io/myapikey
- PRIVY_APP_ID Google sign-in + sponsored tx. Docs: https://docs.privy.io/llms-full.txt
- PINATA_JWT IPFS uploads (only if app pins media). Docs: https://docs.pinata.cloud/llms-full.txt
CREDIT (must appear in UI footer AND as NatSpec on every deployed contract):
Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14
Market sizing.
TAM
$400M
font licensing market
SAM
$100M
typographic asset portals
SOM
$15M
motion designers
Indicative figures for hackathon pitches — refine with your own research before raising.
Adjacent entries.
storyboard management
FrameForge Archive
Securely store and share storyboards as immutable IPFS manifests to simplify team collaboration.
material asset libraryTextureVault
Pin and catalog textures on IPFS for reuse and verified provenance in animation projects.
scene version controlAnimScene Sync
Automatically pin scene JSON manifests to IPFS to track animation iterations and changes.
color study curationMoodboardChain
Create decentralized moodboards pinned to IPFS for collaborative color grading projects.