Texture

Byte Texture senza cuciture

20 texture di superficie ripetibili (pixel art) per interfacce in modalità chiaro — osso freddo, accento petrolio di segnale. SVG e PNG trasparente a 1x/2x/4x.

  • ui
  • svg
  • png trasparente
  • texture
  • senza cuciture
  • piastrellatura
  • materiale
  • pixel
  • pixel art
  • pixel art
  • interfaccia chiara
  • puzzle
  • gestionale
Foglio con 20 texture di superficie ripetibili (pixel art) della famiglia Byte, disposti su una scacchiera di trasparenza con le misure in pixel scritte sotto
anteprima 1600×3907la trasparenza è mostrata a scacchiera

Su questo pack

Byte Texture senza cuciture è un set di 20 texture di superficie ripetibili disegnati nello stile pixel art, dove ogni angolo è una scala di pixel interi e nulla è antialiasato. Contiene superfici di mattoni, pietra e piastrella, legno, tessuto e metallo, terra, erba e intonaco e una mappa di altezza abbinata per ogni superficie.

Queste sono superfici disegnate in vettoriale, non scansioni PBR fotografiche, e vale la pena dirlo chiaro: non passeranno per un materiale fotorealistico sotto una camera fisica. Servono per il lavoro stilizzato, gli sfondi 2D, i riempimenti d'interfaccia e tutto ciò che deve restare leggibile quando viene scalato o ricolorato — casi in cui una scansione fotografica è comunque lo strumento sbagliato.

Il contorno avanza a scatti di 4px e l'ombreggiatura è un dithering di Bayer invece di una sfumatura, quindi il set sopravvive a una scalatura per fattore intero — l'unico modo in cui il pixel art può essere scalato senza ridursi in poltiglia.

Dentro quello stile, questa è la lettura Byte: un'interfaccia in modalità chiaro su una palette osso freddo con accenti petrolio di segnale, costruita attorno a una cornice a bordo singolo, pulsanti a pillola completamente arrotondati da 112x36, barre a fasce divise in 10 segmenti e icone con contorno su una griglia da 24px. Sono quelle misure a spiegare perché due famiglie possono condividere uno stile artistico senza essere intercambiabili: lo stile decide come si traccia un bordo, i numeri decidono a cosa serve l'interfaccia.

Ogni motivo che attraversa un bordo è ridisegnato sul bordo opposto, che è tutta la difficoltà di una texture ripetibile e la cosa che è facile sbagliare senza accorgersene. Ogni superficie arriva con una mappa di altezza in scala di grigi, così uno shader può ricavarne una mappa delle normali all'intensità che la scena richiede, invece di cuocerne una a un'intensità che non va bene a niente.

Ogni sprite arriva come SVG modificabile e come PNG trasparente a 1x, 2x e 4x, così puoi buttare i PNG dritti in un motore oppure aprire il vettoriale e cambiare un colore. Disegnato con le stesse misure del resto della famiglia Byte, il che significa che questo kit e il kit di pannelli Byte si allineano senza che nessuno dei due venga ridimensionato. Si adatta bene a giochi in pixel art.

Download

Link diretto · senza registrazione · senza pagina d'attesa
Scarica ZIP308 kB

Set completo — sorgenti SVG, esportazioni PNG a 1x/2x/4x, licenza e readme

File inclusi in questo pack
FileFormatoPesoDownload
Set completo — sorgenti SVG, esportazioni PNG a 1x/2x/4x, licenza e readmeZIP308 kB Ottieni →
Muro di mattoni, mattonella senza cuciture, pixel art, SVG modificabileSVG56 kB Ottieni →

Come si usa

  1. Imposta il materiale perché si ripeta su entrambi gli assi alla dimensione sorgente; la mattonella è disegnata quadrata, quindi ciò che introduce una cucitura è una scala non uniforme, non il disegno.
  2. Passa il file -height in un nodo normal-from-height invece di usarlo direttamente come mappa delle normali — è un'elevazione in scala di grigi, non una normale RGB.
  3. Se ti serve una variante, ricolora con una tinta invece di modificare l'SVG; i toni sono scelti per sopravvivere a uno spostamento di tonalità senza che malta e grana spariscano.

Licenza

Creative Commons Attribuzione 4.0 — Gratis per uso commerciale. Attribuzione obbligatoria. Termini completi · Cosa significa in pratica

Riga di credito da copiare
"Byte Texture senza cuciture" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/3d/textures/byte-textures