
Each internal boundary is generated once and reused by the two neighboring pieces in opposite directions. SVG clips preserve the original photo inside those curved pieces; a local interaction layer tracks movement, snap distance and completion. Owned photos are assembled and played locally without generation calls. PopNow can create a missing puzzle picture after an exact quote and approval; extra pieces increase local rendering and interaction work.
- Uses PopNow for
- Images
- Needs
- Python 3
Generation is optional when you have suitable input material.
v1.0.0 · Updated Oct 25, 2026 · 11.2 MB · Use it for personal and client work; please don't resell or share the package.
What you get
Playable local HTML puzzle
Solved-photo PNG and editable SVG clip paths
Piece geometry, copied photograph and portable brief
Good for
- Personal photo puzzles and playful keepsakes
- Interactive illustrations with a verifiable completed state
Not for
- Laser-ready cutting tolerances
- Unconstrained collage placement
How it works
Includes a local renderer
Choose the input
Choose a detailed photo and set the puzzle grid.
Render and inspect
Build the shared piece geometry and open the local HTML.
Adjust and export
Play, inspect the completed image or export the editable clipping paths.
How the workflow runs
How Jigsaw photo playground works
Each internal boundary is generated once and reused by the two neighboring pieces in opposite directions. SVG clips preserve the original photo inside those curved pieces; a local interaction layer tracks movement, snap distance and completion.
What's inside the skill
What you can change
- rows: 2–8 and columns: 2–10
- tab_depth: 0.10–0.23 of the smaller piece dimension
- snap_distance: 8–40 SVG units
- source photograph and shuffle seed
What to review before delivery
- The piece count equals rows × columns and every identifier is unique.
- Every piece is a closed path built from shared edges.
- The saved brief reproduces the PNG and SVG; unsafe replacement is rejected.
See the package files
These are selected working files from this edition, with their actual role. The complete download also contains instructions and applicable license notices.
The domain algorithm and invariant checks.
scripts/recipe.pyRunnable, editable example parameters.
examples/brief.jsonControl meanings, proof interpretation and limits.
references/design-notes.md
Why use this skill
Start with this package
The package supplies fitting edge geometry, source-image clipping and actual puzzle state. It goes beyond drawing a puzzle overlay or letting unrelated stickers move freely.
What PopNow adds
Use PopNow for the missing Images in this workflow. Keep adequate material you already own, then bring new assets back into the editing and assembly steps described here.
Compare the options
A prompt, your own skill, or this workflow?
Start with a prompt
Your agent can create from a plain request. The brief, visual rules, asset choices, output format and review process still need to be established for that project.
Write your own skill
You choose and maintain the reusable instructions, defaults, file structure and checks. This is useful when your process needs different rules or integrations.
A workflow created for PopNow
This workflow was built for PopNow. Its source files, included dependencies and applicable notices are part of the package; the scope described below belongs to this edition.
Guide reviewed Oct 25, 2026
What will this cost?
Owned photos are assembled and played locally without generation calls. PopNow can create a missing puzzle picture after an exact quote and approval; extra pieces increase local rendering and interaction work.
Generation is optional when you have suitable input material. Free skill. New media is quoted before it runs.
The skill package
Free to install under your account's download allowance. The package license covers your own and client work; redistribution is excluded.
Existing assets and local work
Reusing suitable assets, editing files and running local assembly do not call a PopNow generation model. Your computer and any required runtime still do the work.
New AI images, clips or sound
Quoted for the actual model, inputs, count, duration and resolution. Extra alternatives, revisions or optional enhancement passes can add generation requests.
Your agent and hosting
Any subscription, hosted computer, deployment or other provider fee belongs to that service. Installing this skill does not include those services.
Check the cost of your version first
Your assistant can inspect the available models and quote the exact request first. You choose which optional passes to include and approve spending before generation.
Ask your assistant
Use the PopNow skill "Jigsaw photo playground" for my project. List the inputs you can reuse, quote only the missing media, show the quoted total and flag any unpriced steps. Separate optional enhancements, and wait for my approval before starting anything paid.
How PopNow billing works
Connections using a PopNow API key, including API-key MCP connections, spend from the separate API balance in USD. A ChatGPT or Claude connection authorized through OAuth spends website credits. These balances are separate; the quote shown by your connection is the approval basis.
Download allowances and current account conditions apply. A free package does not mean unlimited free generation.
How to use it
You say
Use the PopNow skill "Jigsaw photo playground" (jigsaw-photo-playground) for this: Choose a detailed photo and set the puzzle grid. Use the packaged example as a starting point and return the actual artwork with its editable inputs.
Then try
Rebuild a visibly different version using columns: 5 → 6; seed: 17 → 11.
Explain the result using its actual proof files and algorithm ledger.
What to have ready
- A photograph you own or may use
- Desired rows, columns and difficulty
- Python 3.10+, Pillow and NumPy; a browser for play
Similar skills
View all →
WebBeverage Brand Website Template
+25A sunny drinks or snack brand site with shop, case builder, stockist map and demo checkout in one file.
WebScrollable Paper World
+25Walk through a layered paper landscape, discover three keepsakes and build a small pocket journal.
WebSneaker Store Website Template
+25A complete footwear or apparel shop with catalog, product pages, bag and demo checkout in one HTML file.
WebFractal zoom art
+25Explore a computed fractal, choose a close-up and export the exact view as artwork and a reusable brief.
WebScrapbook Portfolio Website
+25A multi-page online CV made of paper objects, with case studies and a printable resume.
WebFourier line orbit
+25Reconstruct a closed drawing with rotating Fourier circles and export the chosen harmonic detail.
WebPop-Up Fold Design Lab
+25Open a symmetric paper linkage, adjust its attachment geometry and export a measured crease proof.
WebVinyl Record Microsite
+25Turn an album into a tactile record sleeve with two playable sides, liner notes and a spinning disc.
WebHardware Product Website
+25Huge hairline model names on silver studio shots, frosted spec cards, a to-scale lineup and a hardware bento.
WebTravel Agency Website Template
+25A photo-led site for tours, guides or lodges with trip search, booking requests and a trip-finder quiz.
WebFreelance Designer Website
+25A bold one-person studio site that sells fixed-price packages, with plan pages, case studies and a brief form.
WebGlassmorphism Website Template
+25Frosted glass pills on a near-black film, a huge serif headline with one italic word and an email capture.
WebPhotoelastic Stress Studio
+25Compose luminous stress-fringe artwork with editable loads and polarizer angles in a portable offline studio.
WebVariable Type Specimen Lab
+25Inspect a real variable font, adjust its supported axes and export live-text specimens with glyph checks.
WebOrthogonal word sculpture
+25Intersect two extruded words into one solid that reads differently from perpendicular viewpoints.
Web3D Avatar Maker
+25Build a cute soft-toy 3D character in your browser and save it as a transparent PNG or a 3D page.
WebAcademic CV Website
+25Publish research, teaching and service in a structured academic CV with citation export.
WebCalendar Heatmap
+25A year of daily activity as a shaded calendar grid, with streaks, totals and keyboard access.
WebAgriculture Product Website
+25Compare field equipment by compatible crops, operating limits and supplied specifications.
WebAI SaaS Landing Page
+25Warm sand paper, hairline rails and hatched gutters around a live kanban board where an assistant plans tasks.
WebAnimated Hero Section
+25A landing-page hero with a gently rotating headline word, two buttons and a wide image frame.
WebArcade Personal Website
+25Present creative projects as playable-looking cartridges in a tiny room with keyboard and touch navigation.
WebArchitecture Portfolio Website
+25An architecture portfolio with project filters, metric and imperial areas, detailed briefs and a printable project shortlist.
WebAudio Product Website
+25Present audio hardware with honest specifications, side-by-side comparison and a real local A/B listening test.
WebAudio Spectrum Visualizer
+25Inspect a local recording with a real frequency spectrum, peak readout and playback controls.
WebCase Study Website Template
+25An evidence-led case study page with baseline and outcome comparisons, missing-source warnings and a claim audit export.
WebCashflow Dashboard
+25Reconcile opening cash, signed transactions and closing balance with a traceable running ledger.
WebCinematic Scroll Story
+25Tell a four-act photo story with full-frame scenes, gentle scroll motion and a letterbox view.
WebCMS Marketing Website
+25A CMS product page with an editable content schema, exact field errors, JSON preview and a valid-content export.
WebConference Speaker Page
+25A speaker page with topic and duration filters, approved host introductions, AV requirements and a downloadable event brief.
WebConstellation Memory Map
+25Connect six photo memories as stars, then explore them freely or follow a chronological tour.
WebConstruction Website Template
+25A construction company page with an editable scope estimator, integer-cent totals, a separate contingency and CSV export.
WebConsulting Website Template
+25A consulting website with an engagement-fit finder, explicit tradeoffs and a downloadable scope brief based on stated constraints.
WebConversion Funnel Dashboard
+25Find where a journey loses people, with cohort checks, step conversion and an accessible data table.
WebShader Hero Agency Website
+25A live orange-heat shader hero behind a bottom-pinned statement, pill nav and a staggered case-study grid.
WebCustomer Onboarding Portal
+25Guide a customer through dependent setup steps with owner visibility, saved exports and honest progress.
WebDark SaaS Landing Page
+25A dark, motion-rich marketing site for a software product, delivered as one self-contained HTML file.
WebDesign System Showcase
+25Explore editable color tokens, measure contrast and export a consistent CSS and JSON token set.
WebDesigner Portfolio Website
+25Six tilted cards hover round a fading headline on calm grey, one red portrait card, editorial case studies.
WebDeveloper Journal Site
+25Turn structured posts into a searchable technical journal with readable code and a portable RSS feed.
WebDeveloper Portfolio Website
+25A dark personal site for engineers with case studies, writing, talks, a résumé and a contact form.
WebEbook Landing Page
+25An ebook page with real original chapter excerpts, local reading progress, text-size controls and an accessible sample download.
WebEditable Budget Grid
+25Edit quantities and unit costs, track actual spending and export a reconciled budget.
WebEditorial SaaS Website
+25Navy split hero, a five-line serif headline beside a documentary still, slanted bands and one cobalt accent.
WebEvent Attendance Chart
+25Compare registrations, check-ins and capacity, with weighted attendance and explicit no-show counts.
WebEvent Website Template
+25An event site with track filters, a personal agenda, overlapping-session warnings and a real UTC calendar download.
WebExperiment Comparison Chart
+25Compare conversion variants with sample sizes, percentage-point lift and honest uncertainty intervals.
WebFinancial Report Portal
+25A financial report directory with year and type filters, source-linked metric comparisons and explicit missing-data handling.
WebFlight Search Prototype
+25Search a local flight inventory by route, date and seats, then compare price, duration and stops.
WebInteractive Architecture Diagram
+25An offline, clickable system diagram built from a checked JSON model, with the evidence behind each box.
WebInteractive Museum Walk
+25Explore three small exhibition rooms, inspect the objects and collect a personal visitor ticket.
WebInterior Design Website Template
+25Turn a room’s dimensions, budget and priorities into an editable interior project brief with a clear allocation and export.
WebJewelry Store Website Template
+25A jewelry catalog with material and size choices, availability checks, a comparison tray and an honest inquiry-list export.
WebKnowledge Graph Explorer
+25Turn project notes into an offline, searchable graph where every claim links back to its source line.
WebKPI Dashboard Template
+25Four KPI tiles with change chips over a glowing line chart, a breakdown table and target bars on warm paper.
WebLanding Page from AI Mockups
+25See three full-page designs first, pick one, and your agent builds it as clean, responsive code.
WebLaunch Waitlist Referral Demo
+25A clearly labeled local waitlist simulation with stable referral codes, duplicate checks, referral counts and queue export.
WebLaw Firm Website Template
+25A restrained law firm website with a service and jurisdiction finder plus a printable consultation preparation checklist.
WebMagazine Website Template
+25A print-quality magazine site with articles, topics, a small shop and subscriptions, as one HTML file.
WebMembership Pricing Calculator
+25A membership pricing page with exact member, billing-period and add-on totals, transparent annual comparisons and quote export.
WebNonprofit Campaign Website
+25A nonprofit campaign page with transparent goal arithmetic, cost assumptions, volunteer filters and a shareable planning summary.
WebOnline Course Landing Page
+25A course website with prerequisite self-checks, a realistic weekly study plan, module previews and progress saved on the device.
WebOperations Dashboard Kit
+25Triage work by priority, owner and overdue status, with clear state transitions and an exportable queue.
WebParticle Animation Hero
+25Copy on warm paper beside a turning sphere of ink and teal dots that reshapes per idea and scatters on scroll.
WebPersonal Brand Website
+25A portrait feathered into warm paper under a thin bracket, with light-and-bold statements on either side.
WebPet Store Website Template
+25A working pet supply shop with catalog, variants, bag, refill planner and demo checkout in one HTML file.
WebPhoto Sequence Editor
+25Reorder a photo story, choose crops and beat labels, then export and restore the exact sequence.
WebPhoto Sticker Playground
+25Arrange photo stickers with drag or keyboard controls, rotate them, undo changes and save a PNG collage.
WebPhotography Portfolio Website
+25Build a local photo portfolio with collection filters, keyboard lightbox and a printable contact sheet.
WebPodcast Website Template
+25A podcast site with a playable hero, episode archive, guest pages and a player that keeps playing.
WebHand-Drawn Pricing Section
+25A notebook-style pricing table with tilted ink cards, a yearly switch and dark mode, in one offline file.
WebProduct Integration Directory
+25A searchable integration catalog with capability and authentication filters, honest setup requirements and exportable checklists.
WebCinematic Product Launch Page
+25Film-lit near-black page: serif title card over drifting light, letterboxed night scene, reservation form.
WebReal Estate Website Template
+25A property website with budget and bedroom filters, side-by-side listing comparison and a printable shortlist of verified facts.
WebResearch Paper Website
+25A project page for your paper with an interactive Figure 1, results, limitations and one-click citation.
WebRevenue Mix Dashboard
+25Explain product or channel revenue with reconciled period totals and amount-to-share comparison.
WebRevenue Trend Report
+25Compare recorded revenue periods without hiding missing dates or inventing a forecast.
WebAdmin Dashboard Template
+25A working back-office console with charts, tables, kanban and calendar, built as one offline HTML file.
WebSaaS Landing Page Template
+25A calm, light marketing site for a software product with a working product console, pricing and sign-up.
WebSearchable Records Table
+25Turn a flat CSV into a searchable, sortable table with pagination and safe filtered export.
WebService Status Dashboard
+25Publish an honest service snapshot with stale checks, component health and incident history.
WebSports Club Website Template
+25A club, gym or studio site with timetable, coach pages, memberships, court plan and booking in one file.
WebTestimonial Wall Section
+25A masonry or slowly drifting wall of customer quotes that only ships quotes people agreed to.
WebTravel Itinerary Website
+25Build a printable trip plan with timed activities, travel buffers, conflict checks and a clear budget.
WebUX Case Study Portfolio
+25Present design decisions with traceable evidence, clear ownership and honest outcome labels.
WebWorkflow Automation Landing Page
+25Graphite page, small left-aligned headline, and a live node graph below that runs, retries and streams logs.
WebWriter Portfolio Website
+25Turn published work into a searchable writer portfolio with a reading queue, article previews and a downloadable media bio.
WebInteractive Grid Hero
+25A dark grid of fine strands that bends toward the cursor and rolls a glowing ring out from every click.
Questions
Do the pieces really fit together?
Neighboring pieces reuse the same curved boundary in reverse, so the digital paths match. Drag a piece near its target to snap; the interface tracks how many pieces are placed.
Can I play without dragging?
Yes. Tab selects a piece, arrow keys move it and Enter tries to snap it. The interface also provides Shuffle, Snap selected and Show completed image buttons.
What costs depend on this workflow?
Owned photos are assembled and played locally without generation calls. PopNow can create a missing puzzle picture after an exact quote and approval; extra pieces increase local rendering and interaction work.
What is already packaged in Jigsaw photo playground?
The domain algorithm and invariant checks. Runnable, editable example parameters. Control meanings, proof interpretation and limits.
Which parts of Jigsaw photo playground can add a charge?
Owned photos are assembled and played locally without generation calls. PopNow can create a missing puzzle picture after an exact quote and approval; extra pieces increase local rendering and interaction work. Connections using a PopNow API key, including API-key MCP connections, spend from the separate API balance in USD. A ChatGPT or Claude connection authorized through OAuth spends website credits. These balances are separate; the quote shown by your connection is the approval basis.
How does Jigsaw photo playground differ from writing a prompt or my own skill?
The package supplies fitting edge geometry, source-image clipping and actual puzzle state. It goes beyond drawing a puzzle overlay or letting unrelated stickers move freely.

