Cada limite interno é gerado uma vez e reutilizado pelas duas peças vizinhas em direções opostas. Clips SVG preservam a foto original dentro dessas peças curvas; uma camada de interação local rastreia o movimento, a distância de encaixe e a conclusão. Fotos próprias são montadas e jogadas localmente sem chamadas de geração. O PopNow pode criar uma imagem de quebra-cabeça ausente após uma citação exata e aprovação; peças extras aumentam o trabalho de renderização e interação local.
- Usa o PopNow para
- Imagens
- Requer
- Python 3
A geração é opcional quando você tem material de entrada adequado.
v1.0.0 · Atualizada em 25 de out. de 2026 · 11.2 MB · Use em trabalhos pessoais e para clientes; não revenda nem compartilhe o pacote.
O que você recebe
Quebra-cabeça HTML local jogável
PNG de foto resolvida e caminhos de clipe SVG editáveis
Geometria da peça, fotografia copiada e brief portátil
Ideal para
- Quebra-cabeças de fotos pessoais e lembranças divertidas
- Ilustrações interativas com um estado concluído verificável
Não é para
- Tolerâncias de corte prontas para laser
- Colagem sem restrições de posicionamento
Como funciona
Inclui uma ferramenta de renderização local
Escolha a entrada
Escolha uma foto detalhada e defina a grade do quebra-cabeça.
Renderizar e inspecionar
Construa a geometria da peça compartilhada e abra o HTML local.
Ajustar e exportar
Jogue, inspecione a imagem concluída ou exporte os caminhos de clipe editáveis.
Como funciona o fluxo
Como Playground de quebra-cabeça de fotos funciona
Cada limite interno é gerado uma vez e reutilizado pelas duas peças vizinhas em direções opostas. Clips SVG preservam a foto original dentro dessas peças curvas; uma camada de interação local rastreia o movimento, a distância de encaixe e a conclusão.
O que vem na skill
O que você pode alterar
- rows: 2–8 e columns: 2–10
- tab_depth: 0.10–0.23 da dimensão da peça menor
- snap_distance: 8–40 unidades SVG
- fotografia de origem e seed de embaralhamento
O que revisar antes da entrega
- A contagem de peças é igual a linhas × colunas e cada identificador é único.
- Cada peça é um caminho fechado construído a partir de bordas compartilhadas.
- O brief salvo reproduz o PNG e o SVG; substituição insegura é rejeitada.
Ver arquivos do pacote
Estes são alguns dos arquivos de trabalho desta edição e suas funções reais. O download completo também contém instruções e os avisos de licença aplicáveis.
O algoritmo de domínio e as verificações de invariância.
scripts/recipe.pyParâmetros de exemplo executáveis e editáveis.
examples/brief.jsonControle significados, interpretação de prova e limites.
references/design-notes.md
Por que usar esta skill
Começar com este pacote
O pacote fornece geometria de borda de encaixe, recorte da imagem de origem e estado real do quebra-cabeça. Vai além de desenhar uma sobreposição de quebra-cabeça ou deixar adesivos não relacionados se mover livremente.
O que o PopNow acrescenta
Use o PopNow para criar o material que falta (Imagens) neste fluxo de trabalho. Mantenha o material adequado que você já possui e leve os novos recursos para as etapas de edição e montagem descritas aqui.
Comparar as opções
Um prompt, sua própria skill ou este fluxo de trabalho?
Começar com um prompt
Seu agente pode criar a partir de um pedido simples. Ainda é preciso definir o briefing, as regras visuais, os recursos, o formato de saída e o processo de revisão para esse projeto.
Escrever sua própria skill
Você escolhe e mantém as instruções reutilizáveis, os padrões, a estrutura de arquivos e as verificações. Isso é útil quando seu processo precisa de outras regras ou integrações.
Um fluxo de trabalho criado para o PopNow
Este fluxo de trabalho foi desenvolvido para o PopNow. Seus arquivos-fonte, as dependências incluídas e os avisos aplicáveis fazem parte do pacote. As capacidades descritas abaixo correspondem a esta edição.
Guia revisado em 25 de out. de 2026
Quanto isso vai custar?
Fotos próprias são montadas e jogadas localmente sem chamadas de geração. O PopNow pode criar uma imagem de quebra-cabeça ausente após uma citação exata e aprovação; peças extras aumentam o trabalho de renderização e interação local.
A geração é opcional quando você tem material de entrada adequado. Skill gratuita. Novas mídias têm o preço informado antes da geração.
O pacote da skill
Instalação gratuita dentro da cota de downloads da sua conta. A licença do pacote cobre seus próprios projetos e os de seus clientes; a redistribuição não é permitida.
Recursos existentes e trabalho local
Reutilizar recursos adequados, editar arquivos e fazer a montagem local não aciona um modelo de geração do PopNow. Seu computador e o ambiente de execução necessário continuam realizando esse trabalho.
Novas imagens, vídeos ou sons com IA
O preço é calculado conforme o modelo, as entradas, a quantidade, a duração e a resolução reais. Alternativas, revisões ou melhorias opcionais podem acrescentar solicitações de geração.
Seu agente e a hospedagem
Assinaturas, computadores hospedados, implantação e outras taxas de provedores pertencem ao respectivo serviço. A instalação desta skill não inclui esses serviços.
Confira primeiro o custo da sua versão
Seu assistente pode primeiro consultar os modelos disponíveis e obter o preço da solicitação exata. Você escolhe os tratamentos opcionais e aprova o gasto antes da geração.
Peça ao seu assistente
Use o skill do PopNow “Playground de quebra-cabeça de fotos” no meu projeto. Liste os materiais que podem ser reutilizados, faça o orçamento apenas das mídias que faltam, mostre o total orçado e indique as etapas que ainda não foram orçadas. Separe as melhorias opcionais e aguarde minha aprovação antes de iniciar qualquer operação paga.
Como funciona a cobrança do PopNow
Conexões que usam uma chave de API do PopNow, incluindo conexões MCP com chave de API, consomem o saldo separado da API em USD. Uma conexão do ChatGPT ou Claude autorizada por OAuth usa créditos do site. Esses saldos são separados; o orçamento exibido pela sua conexão é a base para sua aprovação.
Aplicam-se as cotas de download e as condições atuais da conta. Um pacote gratuito não significa geração gratuita ilimitada.
Como usar
Você diz
Use a skill da PopNow “Playground de quebra-cabeça de fotos” (jigsaw-photo-playground) para isto: Escolha uma foto detalhada e defina a grade do quebra-cabeça. Use o exemplo empacotado como ponto de partida e retorne a obra de arte real com suas entradas editáveis.
Depois tente
Reconstrua uma versão visivelmente diferente usando colunas: 5 → 6; seed: 17 → 11.
Explique o resultado usando seus arquivos de prova e o livro de algoritmo reais.
O que ter em mãos
- Uma fotografia que você possui ou pode usar
- Linhas, colunas e dificuldade desejados
- Python 3.10+, Pillow e NumPy; um navegador para jogar
Skills parecidas
Ver todas →
WebModelo de site de marca de bebidas
+25Site alegre de marca de bebidas ou snacks, com loja, montador de caixa, mapa de revendedores e checkout de demonstração, num arquivo.
WebMundo de papel para explorar
+25Passeie por uma paisagem de papel em camadas, encontre três lembranças e monte um pequeno diário.
WebTemplate de site de loja de tênis
+25Uma loja completa de calçados ou roupas, com catálogo, páginas de produto, sacola e checkout de demonstração em um arquivo HTML.
WebArte de zoom fractal
+25Explore um fractal computado, escolha um close-up e exporte a visão exata como obra de arte e um brief reutilizável.
WebSite de portfólio estilo scrapbook
+25Um currículo online de várias páginas feito de objetos de papel, com cases e um currículo para imprimir.
WebÓrbita de linha de Fourier
+25Reconstrua um desenho fechado com círculos de Fourier rotativos e exporte o detalhe harmônico escolhido.
WebLaboratório de Design de Dobras Pop-Up
+25Abra uma articulação de papel simétrica, ajuste sua geometria de fixação e exporte uma prova de vincos medidas.
WebMicrosite de disco de vinil
+25Apresente um álbum como uma capa tátil com dois lados para ouvir, encarte e um disco que gira.
WebSite de produto de hardware
+25Nomes de modelo enormes e finos sobre fotos prateadas, cartões de especificação e linha em escala.
WebModelo de site de agência de viagens
+25Um site com foco em fotos para passeios, guias ou pousadas, com busca de viagens, pedidos de reserva e um quiz para escolher a viagem.
WebSite para designer freelancer
+25Site de estúdio de uma pessoa, com pacotes de preço fixo, páginas de plano, estudos de caso e formulário de briefing.
WebModelo de site glassmorphism
+25Pílulas de vidro fosco sobre película quase preta, título serifado enorme e captura de e-mail.
WebEstúdio de Estresse Fotoelástico
+25Componha arte luminosa de franjas de tensão com cargas e ângulos de polarizador editáveis em um estúdio offline portátil.
WebLaboratório de Espécime de Tipo Variável
+25Inspecione uma fonte variável real, ajuste seus eixos compatíveis e exporte espécimes de texto vivo com verificação de glifos.
WebEscultura ortogonal de palavras
+25Interseccionar duas palavras extrudadas em um único sólido que se lê de forma diferente de pontos de vista perpendiculares.
WebCriador de avatar 3D
+25Monte um personagem 3D fofo de pelúcia no navegador e salve como PNG transparente ou página 3D.
WebSite de currículo acadêmico
+25Organiza pesquisa, ensino e serviços com filtros de publicações e exportação BibTeX.
WebCalendário heatmap
+25Um ano de atividade diária em uma grade de calendário sombreada, com sequências, totais e navegação por teclado.
WebSite de produtos agrícolas
+25Filtra equipamentos por cultura e região, compara especificações e prepara consultas técnicas.
WebLanding page de SaaS com IA
+25Papel areia, trilhos finos e um quadro kanban ao vivo em que um assistente planeja tarefas.
WebSeção hero animada
+25Um hero de landing page com uma palavra do título que gira suavemente, dois botões e um quadro largo de imagem.
WebPortfólio de fliperama
+25Mostre projetos como cartuchos em uma pequena sala de fliperama, com navegação por teclado e toque.
WebPortfólio de arquitetura
+25Filtre projetos, altere unidades de área e imprima uma seleção.
WebSite de produtos de áudio
+25Compare especificações e ouça seus arquivos em um teste A/B real e local.
WebAnalisador de espectro de áudio
+25Analisa gravações locais com espectro real, frequência dominante e nível do sinal.
WebModelo de site de estudos de caso
+25Relacione evidências e indicadores, confira mudanças e indique dados ausentes.
WebPainel de fluxo de caixa
+25Concilia saldo inicial, entradas e saídas com o saldo calculado após cada transação.
WebHistória com rolagem cinematográfica
+25Conte uma história fotográfica em quatro atos, com imagens amplas, movimento suave e opção de tela panorâmica.
WebSite de marketing para CMS
+25Edite artigos JSON, valide os campos, visualize e exporte conteúdo válido.
WebPágina de palestrante
+25Encontre palestras por tema e duração e exporte a apresentação e a lista técnica.
WebConstelação de memórias
+25Conecte seis memórias fotográficas como estrelas e explore livremente ou na ordem da história.
WebModelo de site para construtoras
+25Calcule quantidades e preços unitários, separe a contingência e exporte o orçamento.
WebModelo de site de consultoria
+25Compare formatos por objetivo, prazo e tamanho da equipe e exporte um briefing.
WebPainel de conversão
+25Calcula conversões e perdas por etapa de uma mesma coorte, com tabela para conferência.
WebSite de agência com hero em shader
+25Hero de shader laranja ao vivo atrás de uma frase fixada, navegação em pílula e uma grade de cases.
WebPortal de integração de clientes
+25Orienta etapas dependentes com responsáveis, progresso ponderado e lista exportável.
WebLanding page SaaS escura
+25Um site de marketing escuro e cheio de movimento para um produto de software, entregue em um único arquivo HTML.
WebMostruário de design system
+25Edita cores, calcula contrastes reais e exporta tokens consistentes em CSS e JSON.
WebSite de portfólio de designer
+25Seis cartões inclinados em volta de um título sobre cinza calmo, um retrato em vermelho e cases editoriais.
WebDiário de desenvolvimento
+25Cria um diário técnico pesquisável com código legível e feed RSS exportável.
WebSite de portfólio para desenvolvedor
+25Um site pessoal escuro para engenheiros, com cases, artigos, palestras, currículo e formulário de contato.
WebPágina de apresentação de ebook
+25Leia capítulos originais, ajuste o tamanho do texto e salve o progresso localmente.
WebTabela de orçamento editável
+25Recalcula plano, gasto real e saldo ao editar quantidades e preços unitários.
WebSite editorial de SaaS
+25Hero dividido em azul-marinho, título serifado ao lado de uma foto documental e um destaque azul-cobalto.
WebGráfico de participação
+25Compara inscrições, check-ins e capacidade com taxas ponderadas e ausências explícitas.
WebModelo de site para eventos
+25Filtre sessões, identifique conflitos de horário e exporte uma agenda pessoal.
WebComparador de experimentos
+25Compara conversões, amostras e intervalos de Wilson sem anunciar um vencedor.
WebPortal de relatórios financeiros
+25Busque por ano e tipo, compare indicadores e exporte dados.
WebProtótipo de busca de voos
+25Filtra voos locais por rota, data e passageiros e compara total, duração e escalas.
WebDiagrama de arquitetura interativo
+25Um diagrama de sistema offline e clicável, feito a partir de um modelo JSON verificado, com a evidência por trás de cada caixa.
WebPequeno museu interativo
+25Explore três salas, observe os objetos de perto e monte seu próprio ingresso de visita.
WebSite de design de interiores
+25Crie um briefing exportável com medidas, orçamento e prioridades do ambiente.
WebSite para joalherias
+25Confira materiais, tamanhos e variantes disponíveis, e exporte uma lista de consultas.
WebExplorador de grafo de conhecimento
+25Transforme anotações de projeto em um grafo offline e pesquisável, em que cada afirmação leva à linha de origem.
WebModelo de dashboard de KPIs
+25Quatro cartões de KPI com variação, um gráfico de linha, detalhamento e barras de meta em papel quente.
WebLanding page a partir de mockups com IA
+25Veja três páginas completas antes, escolha uma, e o seu agente a constrói como código limpo e responsivo.
WebLista de espera com indicações
+25Teste códigos estáveis e uma fila local em uma demonstração claramente identificada.
WebModelo de site para escritórios jurídicos
+25Crie uma lista imprimível para preparar a consulta conforme o serviço e a jurisdição.
WebTemplate de site de revista
+25Um site de revista com qualidade de impresso, com artigos, temas, uma pequena loja e assinaturas, em um arquivo HTML.
WebCalculadora de preços de assinatura
+25Calcule custos exatos por pessoas, período e extras e compare planos.
WebSite de campanha sem fins lucrativos
+25Mostre a meta e as hipóteses de custo e filtre atividades voluntárias por duração.
WebPágina de apresentação de curso online
+25Confira pré-requisitos, explore o programa e calcule um plano semanal de estudos.
WebPainel de operações
+25Organiza tarefas por prioridade, responsável e prazo com transições de estado explícitas.
WebHero com animação de partículas
+25Texto em papel quente ao lado de uma esfera girando de pontos em tinta e azul-petróleo, que muda a cada ideia.
WebSite de marca pessoal
+25Um retrato esfumado sobre papel quente, sob um colchete fino, com afirmações claras e fortes de cada lado.
WebModelo de site de loja de pets
+25Uma loja de pets que funciona: catálogo, variações, sacola, planejador de reposição e checkout de demonstração, num arquivo HTML.
WebEditor de sequência fotográfica
+25Organize uma história em fotos, escolha cortes e momentos narrativos e exporte ou restaure a sequência exata.
WebAteliê de adesivos fotográficos
+25Mova fotos com mouse ou teclado, gire, desfaça alterações e salve a colagem como PNG.
WebPortfólio de fotografia
+25Organiza séries com visualizador por teclado e folha de contato para impressão.
WebModelo de site para podcast
+25Um site de podcast com hero que toca, arquivo de episódios, páginas de convidados e um player que continua tocando.
WebSeção de preços desenhada à mão
+25Uma tabela de preços em estilo de caderno, com cartões de tinta levemente inclinados, chave anual e modo escuro, num arquivo offline.
WebDiretório de integrações de produto
+25Busque por função e autenticação e crie uma lista de configuração.
WebPágina de lançamento de produto cinematográfica
+25Página quase preta com luz de cinema: título em serifa, cena noturna em letterbox e formulário de reserva.
WebModelo de site imobiliário
+25Filtre imóveis por orçamento e quartos e imprima uma comparação.
WebSite de artigo científico
+25Uma página de projeto para o seu artigo, com uma Figura 1 interativa, resultados, limitações e citação em um clique.
WebPainel de composição da receita
+25Compara valores e participações por categoria, conciliando os totais de cada período.
WebRelatório de receita
+25Mostra receita, variação e média móvel, destacando os dias sem registros.
WebTemplate de painel administrativo
+25Um painel de back-office funcional com gráficos, tabelas, kanban e calendário, em um único arquivo HTML offline.
WebTemplate de landing page SaaS
+25Um site de marketing claro e tranquilo para um produto de software, com console de produto funcional, preços e cadastro.
WebTabela de registros pesquisável
+25Transforma CSV em tabela com busca, ordenação numérica, paginação e exportação segura.
WebPainel de status de serviços
+25Diferencia saúde, incidentes e verificações antigas em um retrato documentado do serviço.
WebModelo de site de clube esportivo
+25Um site de clube, academia ou estúdio com grade de horários, páginas de treinadores, planos, mapa de quadras e agendamento num arquivo.
WebSeção de parede de depoimentos
+25Uma parede de citações de clientes em alvenaria ou em deriva lenta, que só publica citações autorizadas.
WebSite de roteiro de viagem
+25Organiza atividades, verifica conflitos e intervalos de deslocamento e soma custos conhecidos.
WebPortfólio de casos UX
+25Explica decisões e restrições com evidências, separando resultados observados de propostas.
WebLanding page de automação de fluxos
+25Página grafite com título pequeno e um grafo de nós ao vivo que roda, tenta de novo e mostra logs.
WebPortfólio para escritores
+25Busque textos por publicação e tema, salve uma lista de leitura e exporte uma biografia.
WebHero interativo com grade
+25Uma grade escura de fios finos que se curva em direção ao cursor e lança um anel luminoso a cada clique.
Perguntas
As peças realmente se encaixam?
Peças vizinhas reutilizam a mesma fronteira curva ao contrário, então os caminhos digitais correspondem. Arraste uma peça perto do seu alvo para encaixar; a interface rastreia quantas peças foram colocadas.
Posso jogar sem arrastar?
Sim. A tecla Tab seleciona uma peça, as teclas de seta a movem e Enter tenta encaixá-la. A interface também fornece botões de Embaralhar, Encaixar selecionado e Mostrar imagem concluída.
Quais custos dependem deste fluxo de trabalho?
Fotos próprias são montadas e jogadas localmente sem chamadas de geração. O PopNow pode criar uma imagem de quebra-cabeça ausente após uma citação exata e aprovação; peças extras aumentam o trabalho de renderização e interação local.
O que já está incluído no pacote de Playground de quebra-cabeça de fotos?
O algoritmo de domínio e as verificações de invariância. Parâmetros de exemplo executáveis e editáveis. Controle significados, interpretação de prova e limites.
Quais partes de Playground de quebra-cabeça de fotos podem gerar cobranças?
Fotos próprias são montadas e jogadas localmente sem chamadas de geração. O PopNow pode criar uma imagem de quebra-cabeça ausente após uma citação exata e aprovação; peças extras aumentam o trabalho de renderização e interação local. Conexões que usam uma chave de API do PopNow, incluindo conexões MCP com chave de API, consomem o saldo separado da API em USD. Uma conexão do ChatGPT ou Claude autorizada por OAuth usa créditos do site. Esses saldos são separados; o orçamento exibido pela sua conexão é a base para sua aprovação.
Como Playground de quebra-cabeça de fotos difere de escrever um prompt ou minha própria skill?
O pacote fornece geometria de borda de encaixe, recorte da imagem de origem e estado real do quebra-cabeça. Vai além de desenhar uma sobreposição de quebra-cabeça ou deixar adesivos não relacionados se mover livremente.