I recenti sviluppi nell’intelligenza artificiale stanno rivoluzionando anche il campo del design UI. L’integrazione di strumenti di IA nell’ambito del design dell’interfaccia utente o User Interface (UI) offre un’enorme quantità di opzioni e potenzialità creative.
Con i giusti input, potrai sfruttare appieno questa tecnologia per migliorare le fasi iniziali del tuo design process, aumentare l’efficienza e creare dei concept unici e straordinari in pochissimo tempo.
Midjourney, è lo strumento di generazione artistica basato sull’intelligenza artificiale che metteremo in pratica per questo caso d’uso.
Ci occuperemo di:
- Interfaccia Utente
- Stili
- Palette colori
- Elementi specifici
Interfaccia Utente
Iniziamo il progetto con il tipo di interfaccia che vogliamo visualizzare e quindi assicuriamoci di avere a mente il nostro obiettibo. Le parole chiave sono, in base al caso: Sito web, Landing Page, App Smartphone, Tablet, Smartwatch, Schermo PC e Dashboard.
Esempio 1 – Stiamo lavorando al concept di un videogame ambientato in fondo al mare e chiediamo al MidJourney di immaginare la landing page del progetto. Useremo il seguente prompt che specifica che si tratta di una UI design e che vogliano visuallizare la landing page. Se non conosci i parametri –ar 4:3 e –v 5, puoi ignorarli per il momento, non sono fondamentali)
/imagine UI design di videogioco ambientato in fondo al mare, landing page –ar 4:3 –v 5
Midjourney parla l’italiano, tuttavia interpreta meglio l’inglese e quindi crea, in media, contenuti più attinenti quando usato in inglese. Ecco lo stesso prompt tradotto in inglese
/imagine UI design of underwater set videogame, landing page –ar 4:3 –v 5
questo è uno dei risultati ottenuti:
Stili
Ricordiamo che più è specifica la descrizione nel prompt, tanto più pertinente sarà l’output rispetto alla nostra idea. Quindi è fondamentale comunicare a Midjourney lo stile che stiamo cercando tramite l’uso di parole chiave come Minimalista, Moderno, Vintage, Lussuoso, Pulito, Elegante ect.
Esempio 2 – Stiamo lavorando sul branding o la sponsorizzazione di una marmellata tramite landing page e vogliamo che questa comunichi qualità:
/imagine UI Design di una marmellata biologica con barattolo pregiato Landing page, Moderna, Di classe, Lussuosa — ar 4:3 — v 5
Palette colori
l colore è una risorsa fondamentale per disegnare una UI. Può essere utilizzato per mostrare l’identità dell’attività, impostare le aspettative del cliente e comunicare un messaggio tutto in una volta!
Esempio 3 – Stiamo lavorando un app per smartphone per un azienda che vende oggetti di lusso
/imagine UI Design per una app smartphone di vendita gioielli, Di classe, Lussuosa, colori nero e oro — ar 4:3 — v 5
Elementi specifici
Ora che la tua UI inizia a predenre forma, aggiungi gli elementi grafici specifici del caso usando parole chiave come: grafici a barre, grafico a torta, puntatore del mouse, icona del menù ect.
Esempio 4 – Stiamo lavorando al sito web di una banca e vogliamo mostrare il resoconto sottoforma di grafico a torta.
UI Design per il sito web di una banca, pie chart con numeri, funzionalità, colori verde e bianco — ar 4:3 — v 5
In questo prompt abbiamo mescolato parole in italiano e inglese (ovvero pie chart per i grafici) in quanto l’uso della parola torta confondeva Midjourney.
Il risultato è molto interessante e, oltre a prestarsi come componente web, potrebbe ispirare un infografica per lo stesso progetto.