CassettoDrawer
Un drawer scorre dal bordo dello schermo. Una parte della pagina dietro di esso resta visibile.
Trova la parola giusta.
Dai forma all’idea.
Descrivi l’interfaccia o il flusso che immagini ma non sai come chiamare. Vibulary trova il termine giusto, mostra un esempio visivo e lo trasforma in una richiesta chiara da realizzare.
Usa le tue parole. Guardiamo cos'è, cosa fa e quando ne hai bisogno.Non sai come chiedere? Prova
MCP · Connect to your AI559guide10argomenti10lingue128demo dal vivo
Guarda. Dai un nome.Prova l’interfaccia
Drawer.
Un pannello che entra dal lato.
Da una sensazione a un’idea concreta.Atlas
Impara le parole di cui hai bisogno per costruire un'idea.
Mostriamo da dove proviene ciascun termine. Standard, guide ufficiali e parole comuni del settore hanno etichette diverse.
PulsanteButton
Un pulsante è un controllo che premi per far succedere qualcosa su questa schermata.
Finestra ModaleModal Dialog
Un dialog modale è una finestra focalizzata. Blocca lo schermo attuale finché qualcuno non la chiude o la finisce.
Foglio inferioreBottom Sheet
Un bottom sheet è un pannello facile da usare col tocco. Salisce dal basso e può fermarsi a tratti prestabiliti.
Tavolozza dei comandiCommand Palette
Una command palette è un pannello di ricerca facile da usare con la tastiera. Apre azioni, pagine e elementi recenti.
GlassmorphismGlassmorphism
Il Glassmorphism è uno stile visivo con superfici stratificate trasparenti. Utilizza sfocatura, bordi luminosi e un piccolo senso di profondità.
Animazione a mollaSpring Animation
L'animazione a molla segue un modello fisico. La rigidità, l'ammortizzazione, la massa e la velocità iniziale controllano come si muove.
Token di designDesign Token
Un Design Token dà un nome a una singola scelta di design. Alcuni esempi sono un colore, uno spazio, un carattere o la velocità di un'animazione.
AccessibilitàAccessibility
L'accessibilità aiuta le persone con abilità diverse a capire e usare un prodotto.
Obiettivo del prodottoProduct Goal
Un Product Goal dichiara il risultato utile che un prodotto dovrebbe creare per gli utenti o per l'azienda.
Generazione aumentata dal recuperoRetrieval-Augmented Generation
La generazione aumentata dal recupero, o RAG, trova prove esterne in tempo reale. Fornisce tali prove a un modello prima di scrivere.
API ed EndpointAPI & Endpoint
Un'API è un insieme di regole per far comunicare due software. Un endpoint è un indirizzo e un'operazione in quell'API.
CSS GridCSS Grid
CSS Grid è un sistema di layout per righe e colonne insieme. Può impostare aree fisse o modificarle quando lo spazio cambia.
Validazione del moduloForm Validation
La validazione del modulo utilizza regole e messaggi per trovare, prevenire e spiegare risposte mancanti o errate.
Notifica toastToast
Un toast è un breve messaggio di stato. Non blocca la pagina e di solito sparirà da solo.
Git, Repository, Branch & Commit — Pacchetto di ApprendimentoGit, Repository, Branch & Commit — Learning Bundle
Questo pacchetto di apprendimento collega quattro concetti di Git. Git è il sistema di controllo versione. Un repository conserva i suoi oggetti e riferimenti. Un branch nomina una linea di lavoro. Un commit registra lo stato di un progetto con metadata. Il pacchetto non è un termine Git.
Movimento ridottoReduced Motion
Il Movimento ridotto è un'impostazione di accessibilità e modalità di progettazione. Rimuove o semplifica i movimenti non necessari.
Dichiarazione del problemaProblem Statement
Un Problem Statement dice chi ha un problema, quando succede e perché è importante risolverlo.
Scegli il modello che si adatta al lavoro.
Due schemi possono sembrare simili ma svolgere lavori diversi. Queste brevi regole ti aiutano a scegliere.
↯↗
Pulsante · Link
Il pulsante cambia qualcosa qui. Il link ti porta da un'altra parte.
□▯▱
Finestra Modale · Cassetto · Foglio inferiore
Usa un dialogo per una decisione, un cassetto per lavori secondari e un bottom sheet per poche azioni su uno schermo piccolo.
▤◌
Skeleton · Spinner
Uno scheletro mostra la forma di un contenuto in fase di caricamento. Uno spinner mostra solo che l'app è occupata.
☑◉⊙
Checkbox · Switch · Radio Group
Le caselle di controllo possono selezionare molti elementi. Un interruttore cambia una impostazione immediatamente. I pulsanti radio selezionano solo un elemento.
Puoi nominare il pattern UI?
Leggi la situazione, poi scegli il termine più chiaro. Nessuna domanda trabocchetto.
Punteggio 0 / 2
Situazione · 1/2
Quando premi “Salva bozza”, il sito salva le tue modifiche e ti dice se ha funzionato.
Trasforma le parole dell'interfaccia in una richiesta di costruzione chiara.
Scrivi ciò di cui hai bisogno. Poi scegli cosa fa l'interfaccia utente, come appare e come si muove. Lo trasformiamo in una richiesta che puoi copiare.
Dì chi ha bisogno di questo, cosa sta succedendo e cosa dovrebbe succedere dopo.
VIBULARY / RICHIESTA● ● ●
Dì chi ha bisogno di questo, cosa sta succedendo e cosa dovrebbe succedere dopo.Dì chi ha bisogno di questo, cosa sta succedendo e cosa dovrebbe succedere dopo.
V.✦
Parole chiare, esempi utili.
Ogni guida inizia con un significato semplice e un esempio chiaro. I nomi tecnici compaiono solo quando ti aiutano a costruirlo.