Pack d'interfaccia

Cursori Slate

12 cursori del mouse (realistico) per interfacce in modalità scuro — ardesia neutra, accento oro caldo. SVG e PNG trasparente a 1x/2x/4x.

  • ui
  • svg
  • png trasparente
  • cursore
  • puntatore
  • mirino
  • mouse
  • realistico
  • realistico
  • interfaccia scura
Foglio con 12 cursori del mouse (realistico) della famiglia Slate, disposti su una scacchiera di trasparenza con le misure in pixel scritte sotto
anteprima 1600×739la trasparenza è mostrata a scacchiera

Su questo pack

Cursori Slate è un set di 12 cursori del mouse disegnati nello stile realistico, dove una sfumatura speculare a cinque passaggi percorre una faccia di metallo spazzolato con rivetti agli angoli. Contiene una freccia e una freccia con anello di attesa, una mano che indica e un cursore di spostamento, un mirino e un aggancio bersaglio, cursori di attacco, dialogo e bottino, cursori di attesa, blocco e testo, e un cursore di ridimensionamento.

Un gioco che disegna la propria interfaccia e poi ci lascia sopra il cursore del sistema operativo ha un buco in mezzo allo schermo, ed è proprio la parte che il giocatore guarda di continuo. Il cursore è anche l’unico sprite senza controllo sul proprio sfondo: attraversa cielo, pietra, fuoco e inventario nello stesso secondo.

La texture del pennello è un motivo di linee da 3px e non rumore vero: il rumore triplica il peso del PNG per una texture che nessuno vede a 1x. L'ombra è a strati invece che sfocata, così regge a 4x.

Dentro quello stile, questa è la lettura Slate: un'interfaccia in modalità scuro su una palette ardesia neutra con accenti oro caldo, costruita attorno a una cornice a bordo singolo, pulsanti ad angoli retti da 128x40, 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 cursore porta un contorno preso dall’estremo opposto della palette rispetto al corpo, ed è ciò che lo tiene leggibile su uno sfondo di cui il kit non sa nulla: un cursore scuro su una caverna scura sparisce, e nessuno stile lo rimedia. Il punto attivo è indicato nel titolo di ogni sprite invece di essere lasciato a indovinare: la freccia clicca a 0,0 e il mirino al centro, e un punto attivo spostato di tre pixel è un gioco in cui il giocatore manca ciò che ha mirato.

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 Slate, il che significa che questo kit e il kit di pannelli Slate si allineano senza che nessuno dei due venga ridimensionato. Si adatta bene a interfacce realistico e di simulazione.

Download

Link diretto · senza registrazione · senza pagina d'attesa
Scarica ZIP51 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 readmeZIP51 kB Ottieni →
Cursore freccia, punto attivo 0,0, SVG modificabileSVG409 B Ottieni →

Come si usa

  1. Prendi il punto attivo dal titolo dello sprite quando registri il cursore: freccia e mano cliccano vicino alla punta, mirino e bersaglio al centro.
  2. Usa il PNG da 32 px per un cursore hardware e resta su scale intere; il cursore hardware è composto dal sistema operativo e una scala frazionaria è dove il contorno si ammorbidisce.
  3. Passa ai cursori di attacco, dialogo e bottino dal tuo raycast di interazione invece di tingere un solo cursore, perché ciò che il giocatore legge a colpo d’occhio è la sagoma e non il colore.
  4. Il cursore di blocco è per un’azione rifiutata, non per un controllo disattivato: un pulsante disattivato lo dice già con il suo sprite, e usarli entrambi lo dice due volte.

Licenza

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

Riga di credito da copiare
"Cursori Slate" by Oğuzhan Girgin, licensed under CC BY 4.0 — https://www.colorosse.com/assets/2d/ui/slate-cursors