Separa l'interfaccia di gioco in livelli modificabili
Trasforma gli screenshot di gioco in pannelli UI, elementi HUD, icone e asset di interfaccia separati. Affina i singoli componenti con la separazione dei livelli basata sull'IA.
Carica uno screenshot dell'interfaccia di gioco
Usa uno screenshot pulito o un mockup UI. La prima elaborazione separa i componenti principali dell'interfaccia dalla scena.
1
Clicca o trascina l'immagine per caricarla
Upload your image
JPG, PNG, WebP up to 10MB · Drag & drop anywhere
Cambia immagine
Layer Hotspots17 Layers
Hover or click box to inspect layer
Separated Layer Cutouts17 Layers
Protected Assets
2
Impostazioni
Progettato per le interfacce di gioco
La prima elaborazione separa per componente funzionale: barre, pannelli, pulsanti di menu, minimappa, personaggio e scena. Una striscia densa come una barra delle abilità può poi essere ulteriormente separata, solo quando lo desideri.
HUD e barre di statoMinimappa e menuBarre delle abilità e hotbarPannelli chat e dialogo
Costo per elaborazione60 crediti
Carica un'immagine per continuare
Gestione privata dei file
I file caricati sono associati al tuo account e distribuiti tramite URL firmati. Puoi eliminare manualmente i processi completati.
Output PNG trasparente
La funzione Livelli dettagliati restituisce ogni elemento rilevato come un livello indipendente su sfondo trasparente.
Per risultati migliori, usa:
- Uno screenshot completo, non ritagliato
- Alta risoluzione, senza compressione eccessiva
- Poca sovrapposizione tra UI ed effetti
- Un'immagine statica, non con effetto mosso
- HUD, barre e pannelli come livelli separati
- Personaggio e scena mantenuti separati
- Dividi un pannello scelto nei suoi pulsanti
- Sposta, nascondi ed esporta nell'editor di livelli
Risultati reali
Da uno screenshot a componenti UI separati
Due elaborazioni reali sullo stesso screenshot di gioco. La prima separa l'interfaccia dalla scena. La seconda prende uno di quei livelli, la barra delle abilità, e lo separa ulteriormente.
Passo 1: separa lo screenshot
Il personaggio e lo sfondo della scena vengono separati dall'interfaccia, e ogni barra, pannello, pulsante di menu e icona è un livello a sé stante.
Passo 2 (opzionale): separa ulteriormente un livello
La barra delle abilità era un unico livello dopo il passo 1. Elaborata da sola, si è divisa in dieci pulsanti, due statue e la base della barra.
Cosa aspettarsi
Ogni livello viene ridisegnato dal modello, quindi riassemblare i pezzi produce qualcosa di simile al tuo screenshot, non una copia esatta. Dimensioni e posizioni possono differire leggermente, in modo più evidente su strisce dense come la barra delle abilità, e un livello può essere leggermente più grande del pezzo originale. Controlla testi piccoli, numeri e icone sottili prima di utilizzare un livello.
Come funziona
Due passaggi, il secondo lo decidi tu
1
Carica lo screenshot
La prima elaborazione separa i componenti principali dell'interfaccia e il personaggio dalla scena.
2
Rivedi i livelli
Seleziona i livelli nell'editor, spostali o nascondili, e confrontali con il tuo screenshot.
3
Scegli un livello per approfondire
Scegli un livello come una barra delle abilità. Il costo in crediti viene mostrato prima di iniziare.
4
Usa i pezzi
I pezzi sostituiscono quel livello nell'editor. Ripristina il livello originale o annulla in qualsiasi momento, quindi esporta.
Per gli sviluppatori di giochi
Estrai parti dell'interfaccia da uno screenshot piatto
Uno screenshot o un frame concettuale contiene l'intera interfaccia in un'unica immagine. Separandola ottieni barre, pannelli e icone come livelli trasparenti che puoi riposizionare, ridisegnare o ricostruire nella tua pipeline UI.
Lo strumento separa l'artwork. Non ricostruisce l'interfaccia come oggetti del motore di gioco.
- Prototipa layout da un frame di riferimento
- Estrai parti dell'HUD per un redesign
- Ricostruisci un mockup UI da uno screenshot esistente
- Raccogli icone e frame per uno studio di stile
Per i designer UI
Lavora sui componenti invece che su un'unica immagine
Una volta che barre, pannelli e pulsanti sono livelli separati, puoi riordinarli, nascondere quelli che non ti servono ed esportare il risultato.
I livelli mantengono la loro posizione sulla tela, così puoi spostare un pezzo senza toccare il resto.
- Barre della salute e del mana
- Minimappa e il suo frame
- Pulsanti di menu e missioni
- Pannelli chat e dialogo
- Contatori, orologi e icone standalone
Per i creatori di asset
Raccogli pezzi riutilizzabili
Icone, pulsanti e ornamenti diventano livelli PNG trasparenti separati. Utilizza solo artwork di cui hai i diritti d'uso.
- Icone di abilità e capacità
- Cornici e statue ornamentali
- Icone di valuta e stato
- Pezzi angolari decorativi
Perché due passaggi
Una singola elaborazione ha un limite di livelli
Ogni elaborazione restituisce uno sfondo e fino a 16 livelli separati. Una schermata di gioco completa ha più parti di così, quindi la prima elaborazione raggruppa le strisce dense invece di dividere ogni pulsante.
Il secondo passaggio elabora un livello scelto da solo, in modo che il modello dedichi tutti i suoi livelli a quel componente.
Prima elaborazione
Componenti, non frammenti
La prima elaborazione cerca componenti funzionali piuttosto che grandi regioni visive: una barra con la sua etichetta rimane unita, e un pulsante di menu rimane con la sua icona.
Lo sfondo della scena viene mantenuto come un unico livello, e un personaggio che si trova nella scena viene separato da essa.
- Barre di stato e barra XP
- Barre del boss e del bersaglio
- Minimappa e pulsanti di menu
- Finestre di chat e dialogo
- Il personaggio e la scena
Rimane unito
Alcune strisce vengono generate come un unico livello
Righe di pulsanti simili, come una barra delle abilità, vengono spesso restituite come un unico livello nella prima elaborazione. Questo è lo scopo del secondo passaggio.
Anche in questo caso, una striscia molto densa non è garantita per separarsi in ogni singola parte.
Limiti
Cosa non fa questo strumento
Non restituisce ritagli pixel-identici del tuo screenshot e non garantisce che ogni elemento dell'interfaccia diventi un proprio livello.
Non crea file di motore di gioco come prefabs di Unity, widget di Unreal o scene di Godot, e non riconosce per te le funzioni dei pulsanti o il testo.
- Testi e numeri piccoli dovrebbero essere controllati a vista
- Linee sottili e bagliori possono risultare leggermente diversi
- Elementi sovrapposti potrebbero rimanere in un unico livello
Preparazione
Ottieni una separazione più pulita
Usa l'intero frame alla massima risoluzione disponibile. Evita di catturare durante effetti di motion blur, screen shake o effetti particellari pesanti.
Se hai bisogno solo di un pannello, ritaglialo prima, oppure esegui la prima elaborazione e poi separa ulteriormente quel livello.
- Frame completo, non ritagliato
- Alta risoluzione
- Un momento statico
- Interfaccia non coperta da effetti
Utilizzo dei livelli
Modifica, riordina ed esporta
Nell'editor di livelli puoi spostare, ridimensionare, nascondere, bloccare e riordinare i livelli, applicare maschere e regolazioni, ed esportare la composizione come immagine.
I download ZIP e PSD contengono i livelli separati. Un livello che hai ulteriormente separato viene esportato come suoi pezzi. L'esportazione PSD richiede un piano a pagamento.
Crediti
Vedi il costo prima di iniziare
Ogni elaborazione utilizza crediti e mostra prima il suo costo. Separare ulteriormente un livello è un'elaborazione separata e opzionale: nulla viene addebitato finché non lo confermi.
Se un'elaborazione fallisce, i crediti vengono rimborsati automaticamente.
FAQ Interfaccia di gioco in livelli
Cosa fa Interfaccia di gioco in livelli?
Separa uno screenshot di gioco in livelli trasparenti: barre di stato, pannelli, pulsanti di menu, la minimappa, icone, il personaggio e lo sfondo della scena. Puoi quindi spostarli, nasconderli ed esportarli nell'editor di livelli.
Ogni pulsante diventerà un proprio livello?
Non nella prima elaborazione. Ogni elaborazione restituisce uno sfondo e fino a 16 livelli separati, quindi le righe di pulsanti simili di solito rimangono unite. Puoi separare ulteriormente quel livello in un secondo passaggio, ma anche in quel caso una striscia molto densa non è garantita per dividersi completamente.
Come ottengo i singoli pulsanti delle abilità?
Esegui la prima elaborazione, seleziona il livello della barra delle abilità nell'editor e scegli 'Separa ulteriormente questo livello'. Nel nostro test reale la barra delle abilità si è divisa in dieci pulsanti, due statue e la base della barra.
Pago due volte?
Solo se lo scegli tu. La prima elaborazione è un'unica esecuzione. Separare ulteriormente un livello è un'elaborazione separata e opzionale che mostra il suo costo in crediti prima di iniziare. Le elaborazioni fallite vengono rimborsate automaticamente.
I livelli sono ritagli esatti del mio screenshot?
No. Ogni livello viene ridisegnato dal modello. Riuniti, i pezzi sono simili al tuo screenshot ma non identici, e dimensioni o posizioni possono differire leggermente.
Il testo nella mia interfaccia viene preservato?
Testo e numeri vengono solitamente mantenuti, ma testi piccoli o sottili possono cambiare. Controlla ogni livello che contiene testo o numeri prima di utilizzarlo.
Posso usare il risultato in Unity, Unreal o Godot?
Ottieni livelli PNG trasparenti e una composizione esportabile. Lo strumento non crea prefabs di Unity, widget di Unreal o altri file di progetto di motori di gioco, quindi importi le immagini nella tua configurazione UI.
Quanti livelli può restituire una singola elaborazione?
Uno sfondo più fino a 16 livelli separati per elaborazione.
Cosa succede alla scena e al personaggio?
Lo sfondo della scena viene mantenuto come proprio livello. Un personaggio che si trova nella scena viene separato da essa, e lo sfondo viene ricostruito dietro di esso.
Posso ripristinare il livello originale dopo averlo ulteriormente separato?
Sì. Il livello originale viene mantenuto, nascosto, mentre i suoi pezzi vengono mostrati. 'Ripristina livello originale' lo riporta indietro, e anche 'annulla' funziona.
Quali screenshot funzionano meglio?
Un frame completo e statico ad alta risoluzione, senza motion blur o effetti pesanti sull'interfaccia. Spazi chiari tra gli elementi aiutano.
Quali formati di esportazione sono disponibili?
Puoi scaricare i livelli come ZIP, esportare la composizione come PNG o scaricare un PSD con un piano a pagamento. Un livello ulteriormente separato viene esportato come suoi pezzi.
Posso usare screenshot di qualsiasi gioco?
Utilizza solo artwork di cui hai i diritti d'uso. Screenshot di giochi che non possiedi, o artwork coperti dalla licenza di qualcun altro, potrebbero non essere tuoi da modificare o condividere.
Posso modificare i pezzi separati con l'IA?
I pezzi possono essere spostati, mascherati, regolati e scaricati nell'editor. Le modifiche AI, l'upscaling e la rimozione dello sfondo vengono eseguiti sui livelli originali.
Trasforma il tuo screenshot di gioco in livelli UI separati
Carica uno screenshot, rivedi i componenti separati e approfondisci solo sui livelli che lo richiedono.
Separa l'interfaccia di giocoVedi il costo in crediti prima di ogni elaborazione.