Mockup de Interface de Ferramenta de Diff JSON em Modo Escuro
Gera um mockup de interface de desktop em modo escuro polido para uma ferramenta de comparação de código e diff de API JSON.
Instrução
Objetivo: Criar um mockup de interface de aplicativo desktop em modo escuro para uma ferramenta de diff JSON chamada Tilted Diffs, exibindo uma comparação de resposta de API intitulada API Response — Checkout v2.
Canvas: Captura de tela de desktop widescreen 16:10, aproximadamente 1152×768, com uma janela de aplicativo no estilo macOS flutuando sobre um fundo gradiente azulado escuro. Use sombras sutis, cantos arredondados, bordas finas e uma estética polida de ferramenta de desenvolvedor.
Layout: O aplicativo possui 4 regiões principais: 1 barra lateral esquerda, 1 barra de ferramentas superior abrangendo a área do editor, 3 painéis de editor de código verticais. O primeiro painel do editor está selecionado e contornado com um brilho de foco azul brilhante. O painel central mostra destaques de diff em linha coloridos. O painel mais à direita é estreito e parcialmente visível, como uma aba de arquivo adicional ou uma terceira coluna de comparação.
Barra lateral esquerda: Mostre os botões de semáforo do macOS no canto superior esquerdo: 3 círculos, vermelho, amarelo, verde. Abaixo do nome do aplicativo, inclua 1 campo de busca com o texto de espaço reservado “Search diffs…” e uma dica de teclado. Abaixo dele, mostre exatamente 8 itens da lista de diffs salvos com pequenos ícones de documento e carimbos de data/hora: 1) “API Response — Checkout v2” com “Today, 10:24 AM”, destacado em azul como o item selecionado; 2) “User Profile — Public API” com “Yesterday, 4:18 PM”; 3) “Orders Endpoint — v1 vs v2” com “May 20, 2025, 9:14 AM”; 4) “Product Catalog — EU Region” com “May 19, 2025, 2:47 PM”; 5) “Auth Response — SSO” com “May 18, 2025, 11:03 AM”; 6) “Billing Summary — Q2” com “May 17, 2025, 3:22 PM”; 7) “Webhook Payload — Stripe” com “May 16, 2025, 10:11 AM”; 8) “Search Results — Relevance” com “May 15, 2025, 5:35 PM”. Na parte inferior, inclua exatamente 1 botão azul proeminente “+ New Diff” e 1 pequeno ícone de engrenagem.
Barra de ferramentas superior: À esquerda, exiba o título “API Response — Checkout v2” com um pequeno ícone de lápis de edição. Centralize um controle segmentado com exatamente 2 abas: “Editors” selecionado em azul e “Diff” inativo. À direita, inclua exatamente 4 controles de atalho compactos rotulados como “⌘T add column”, “⌘D toggle diff”, “⌘← / ⌘→ move focus” e um pequeno espaçamento entre os grupos.
Painéis do editor: Use uma fonte de código monoespaçada, números de linha, destaque de sintaxe JSON, painéis azul-marinho escuro e bordas arredondadas finas. O cabeçalho do painel esquerdo é “source.json” com um ícone de documento e um menu de três pontos. O cabeçalho do painel central é “target.json” com um ícone de documento e um menu de três pontos. O cabeçalho do painel estreito à direita é “more.json” e deve mostrar apenas a parte esquerda do código, sugerindo overflow. Cada painel de editor completo possui uma barra de status inferior com “Ln 1, Col 1”, “Spaces: 2”, “UTF-8”, “LF” e “JSON”.
Conteúdo do código: Mostre JSON para uma resposta de checkout de pedido. Use requestId “req_8f3a9b42”, orderId “ord_123456”, moeda USD, itens para Wireless Headphones e Travel Case, e informações de envio. A versão de origem à esquerda deve incluir o timestamp “2025-05-21T10:24:31Z”, versão “v1”, status “pending”, totalAmount 129.99, Wireless Headphones unitPrice 99.99 com discount null, Travel Case quantity 1, unitPrice 30.00, discount null, método de envio “standard”, estimatedDays 5 e endereço “123 Market St”. A versão de destino central deve mostrar marcadores de diff em uma calha esquerda e destaques de linha coloridos: linhas removidas em vermelho, linhas adicionadas em verde, linhas alteradas em amarelo. Deve incluir o timestamp alterado de “2025-05-20T15:11:09Z” para “2025-05-21T10:24:31Z”, versão alterada para v2, status alterado de pending para confirmed, totalAmount alterado para 139.99, Wireless Headphones unitPrice alterado para 109.99 e discount adicionado como 10.00, Travel Case quantity alterado para 2 e método de envio alterado para express com estimatedDays 2. Mostre aproximadamente 32 linhas numeradas em cada editor completo.
Estilo visual: Interface de ferramenta de desenvolvedor SaaS premium, renderização nítida tipo vetor, tema escuro, cor de destaque azul cobalto, texto cinza suave, captura de tela de interface realista, porém limpa, sem pessoas, sem marca d'água, sem elementos de navegador fora da janela do aplicativo. Mantenha todo o texto legível e alinhado a uma grade.
Como usar este prompt
- 1
Copie o prompt completo acima.
- 2
Abra uma plataforma compatível com o GPT Image 2, como a YouMind, e cole o prompt.
- 3
Troque o tema, o estilo ou os detalhes conforme a sua ideia e gere.
Este é um prompt de IA gratuito da biblioteca de prompts da YouMind. Explore outros milhares de prompts de imagem, todos gratuitos para copiar e adaptar.
Explorar mais prompts de imagemMais de GPT Image 2
Pôster de Viagem Minimalista de Cidade
@Taaruk
Papel de parede de player de música anime em tons de menta
@あまり🖋️AI &フリー素材配布
Pôster de Smartwatch Edição Limitada Cyberpunk
@あまり🖋️AI &フリー素材配布
Colagem de Retrato Minimalista de Cinco Quadros
@Cherry 2.O
Ilustração de Moda com Acessórios
@Zephyra Leigh
Retrato de Moda Inspirado em Threads Cinematográficos
@Aijaz
Todas as categorias de Imagem
01
Casos de uso
Mais recursos de prompts
Biblioteca de IA
Procura de prompts com IA
Deixa a IA pesquisar em dezenas de milhares de prompts. Filtra por modelo, intervalo de datas e palavras-chave e ordena por interação: visualizações, favoritos, partilhas e mais.
Ferramentas de visão
Imagem para prompt
Transforme qualquer foto num prompt de imagem IA detalhado. O conversor gratuito de imagem para prompt analisa composição, estilo e iluminação para recriar qualquer visual em segundos.
Outros recursos de prompts
Por modelo
Ferramentas de IA
Criado para criadores. Grátis para sempre.
YouMind é o copiloto criativo de IA usado por criadores em todo o mundo. Cada prompt aqui é curado para ajudar a criar melhor e mais depressa.