Lezione gratuita dal corso UI Design
Ok, abbiamo visto.
Quindi che cosa fa qui Gemma che abbiamo detto è un sottoprodotto di Fig, ma molto simile per chi ha già avuto modo di testare altri tool.
Ammiro e però molto, molto utile perché ci viene incontro figli Gemma a tutta quella fase preparatoria per la nostra fase di design.
Appunto, dove possiamo mettere insieme chi fa content, chi fa marketing? Che gli sviluppatori che insieme a noi magari definiscono il flusso.
Adesso però entriamo proprio nel vivo del tool di film per iniziare a disegnare.
Apriamo l'interfaccia di Fig.
Ma io in questo contesto la sto aprendo sulla mia applicazione ed ex top e l'interfaccia è così fatta.
Abbiamo a sinistra tutta una serie di shock per arrivare rapidamente a lavorare su dei team di lavoro con cui stiamo lavorando.
Quindi in questa colonna di sinistra Posse vedere tutti i progetti su cui stiamo lavorando fondamentalmente come se fossero delle cartelle di aggregazione e a destra abbiamo le informazioni che ci consentono di lavorare su file su cui abbiamo gia' lavorato e su file nuovi.
Quindi in alto vedete queste tre call to action new design file new figen fai importa un file da ovviamente piattaforme esterne.
La seconda riga è tutta dedicata a template, soprattutto esclusivamente di Big Jim.
Tutta la parte sotto, invece, è un accesso rapido a documenti recenti che avete gia' creato.
Come vedete, è tutto basato sul cloud.
Questo vuol dire che io non devo più fare il backup dei miei file.
Ogni volta che scrivo su un nuovo file, viene salvato in automatico sul cloud del server di Fig.
Ma questo ci emancipa anche un po' come designer.
Da evitare tutte quelle nomenclature che per anni abbiamo usato.
Fai il Def uno, due, tre No, fino all'infinito.
E soprattutto c' è un'unica, diciamo risorsa della verità.
Non possiamo chiamare Un'unica Source of Truth, dove tutti trovano il file lo stato finale della sua lavorazione.
Ok, ma qualcuno potrebbe dire sì, ma se volessi tenermi delle versioni precedenti delle prove Beh, ci sono tanti altri escamotage per farlo.
È all'interno di Fig, ma non in ultimo.
E poi lo vediamo adesso, cioè anche proprio la possibilità di guardare la storia è del file.
Proprio la cronologia fino a trenta giorni nella versione diciamo Fry e fino a un anno nelle versioni più avanzate.
Quindi non dobbiamo più preoccuparci di salvare i nostri file.
Un motivo per cui io sono diventata anche una Fig ma addicted l'idea che se anche diciamo malauguratamente domani mi dovessero rubare il computer, dovessi trovarmi a lavorare sul computer di qualcun altro, io avrei tutto il mio lavoro già pronto a disposizione.
Andiamo a creare un nuovo file su Fig.
Ma per capire come è fatta la sua interfaccia Ok, qui in atto nei tab vediamo tutti i nostri progetti che sono aperti.
Quelli in viola sono quelli di Big Jim.
Quelli in blu sono quelli di Fig.
Ma possiamo nominare il file.
Vi consiglio di farlo questo subito, andando a cliccare sulla voce qui in alto C'e' scritto entitled.
Gli diamo un nome prova interfaccia.
Come vedete c'è sempre.
Il Pat prima mi dice che questo file si trova nella sezione draft.
Come vi dicevo prima, qualsiasi file salvato Il draft è un file che diciamo non è all'interno di nessun team di lavoro.
È un file diciamo libero nella vostra gestione Fig, ma é finché lavorate in versione draft, potete lavorare senza aver nessun costo aggiuntivo.
Potete con un tasto destro.
Pinna Nahr é questo Tav tra i preferiti, in modo che rimanga magari sempre il primo sapete, tante finestre, magari succede che lavorate contemporaneamente.
È con più file e potete da questa voce di menu a tendina vedere una serie di opzioni interessanti.
La prima è quella che vi dicevo prima in questo caso non abbiamo niente, ma posso andare sui show versioni story e vedere la storia di tutto quello che ho fatto.
Quindi magari potrei andare indietro di dieci salvataggi e vedere com'era il file nell'ultimo.
Insomma, dei dieci salvataggi fa o in una data specifica che vado a riprendere.
Ok, questa è una cosa super importante possa esportare il file.
Posso duplicare Lori, nominarlo, come abbiamo già detto, cancellarlo o aggiungerlo tra i preferiti in alto.
Questa invece questa parte qui è la parte appunto fondamentale dei Thule.
Come vedete non sono tantissimi, ma sono tutti, come dire, studiati a puntino per farci fare quello che ci serve nella presa delle interfacce.
Il primo che vedete qui è il cursore per spostare gli oggetti, che però quando vado ad aprirlo nasconde un altro sotto cursore, che è quello che ci consente di scalare gli oggetti.
Attenzione che qui su Fig, quando noi ingrandiamo qualcosa non la stiamo scalando.
Stiamo solo cambiando come dire le dimensioni nell'asse delle ascisse delle ordinate, ma non lo stiamo realmente ingrandendo, né per traccia né per tipografia.
Se vogliamo fare questo, poi lo vediamo.
Utilizziamo il tool skyline l'opzione fra me e slice fra me vediamo adesso in un secondo momento che è proprio il cuore di tutta la progettazione all'interno di Fig.
Ma dobbiamo un po' emanciparci dal concetto di tavole di disegno preimpostate che troviamo su per esempio su Photoshop illustrator.
Su altri tool di design sul film si lavorerà per fame, quindi per macro contenitori e avranno funzioni diverse.
Lo vediamo successivamente.
Il terzo tool troviamo è quello che ci consente di creare shape delle forme.
Ovviamente, trattandosi di un programma prettamente strettamente Vittoriale, abbiamo la nostra penna che ci consente di creare curve di bézier.
Se qualcuno insomma, ha un po' di conoscenza di disegno vettoriale, saprà che per fare appunto le disegnare forme curve si utilizza questa penna che ci consente di qua la vediamo al volo giusto per fugare i dubbi ci consente di fare queste curve grazie all'utilizzo delle maniglie che si chiamano appunto curve di bézier.
Poi abbiamo il terzo tool che è quello del testo che ci consente di scrivere testo la manina che ci consente di spostarci.
Ma possiamo farlo anche tramite la barra spaziatrice all'interno del tool.
E poi questo che è secondo me una fece veramente molto importante quando si inizia a lavorare in gruppo che è quella di lasciare commenti contestuali all'interno dell'interfaccia Questa è la parte alta.
Oltre a questo, abbiamo questi tre icone che vediamo rapidamente, ma poi approfondiamo.
Questo ci consente di evitare l' oggetto se vettoriale.
Questo ci consente di trasformarlo in un simbolo.
Lo vediamo anche questo successivamente questo di mascherarlo qui a destra abbiamo le opzioni per vedere chi sta lavorando sul file anche qua.
In questo caso sono da sola.
Ma se ci fosse qualcun altro, vedrai la sua faccina qui e cliccando sulla sua faccia potrei seguire che cosa sta facendo all'interno della mia interfaccia.
Anzi, proviamo a farlo.
Adesso prova a entrare con con il mio stesso account mi ritroverò duplicata.
Ok, quindi vedete che sono duplicata, ma in realtà fate conto che che non sia io e posso diciamo tacco fare sulla faccia della persona che voglio seguire e vedere che cosa sta disegnando.
Nell'interfaccia proprio modalità umarell è vera e propria e qui invece la voce share si concentra ci consente appunto di stabilire con chi condividere questo file se con chiunque, oppure solo con le persone invitate a questo file e poi decidere quali sono.
Come dire i diritti e i privilegi delle persone che accedono a questo file possono vedere il file o possono evitarlo.
Questo poi, ovviamente, lo possiamo decidere di volta in volta a seconda del progetto.
Ovviamente, quando selezioniamo la voce solo le persone invitate a questo file, dobbiamo compilare qui gli indirizzi e-mail delle persone che vogliamo invitare a prendere parte al nostro documento.
Nella paletta invece di sinistra troviamo un'altra parte fondamentale di Fig.
Ma che sono le pagine? Ok, basta tappare.
Vedete, si espandono e subito sotto un altro leder che ci sia un altro diciamo pannello che ci sta facendo vedere i livelli uno dice Ma pagine di chi? Se non vedo ancora niente, dovete immaginare che su Phil.
Ma questa è una parte fondamentale.
Le pagine sono dei grandi spazi di lavoro, ok? Ogni pagina uno spazio di lavoro.
Non stiamo parlando.
Pagina di un documento che ha una dimensione fissa all'interno di una pagina possono esserci in tavole, ok? E posso creare anche in pagine all'interno del mio documento.
Qual è la finalità? La finalità è cercare di razionalizzare meglio il design all'interno della nostra interfaccia.
Per esempio vedete in questo documento qui io ho diviso le pagine in Wolfram é out.
Posso creare appunto tante aree di lavoro per specificare mettere cose diverse in ogni sezione.
Magari si sta lavorando a un sito responsible.
Potrei ipotizzare che in ogni pagina c'e' un'area di lavoro metto un break point è quello che in gergo viene chiamato Insomma, una risoluzione diversa.
Magari faccio una pagina per tutte le pagine mobile.
Una pagina per tutte le sezioni di Expo, una pagina per tutte le sezioni tablet.
Ovviamente questa divisione è appannaggio vostro.
Ognuno può scegliere quella che più gli si confà.
L'idea però comunque di cercare di razionare questi documenti, di razionalizzare questi documenti che sono comunque pieni di tanta roba in questo modo qui.
Quindi, mi raccomando, ricordatevi che potete creare tante pagine semplicemente recando più che giusto per farvi vedere.
In ognuna potrei mettere tante cose adesso vi faccio vedere.
Ok, questa potrebbe essere la pagina che contiene tanti gli Houthi Un'altra pagina che contiene altri elementi, è diversa dalla tre ovviamente nella due trovo altri contenitori.
Insomma, il concetto è che ogni pagina può contenere infinita quantità di roba.
Chiaramente meglio fare più pagine che mettere troppa carne al fuoco in un'unica in un'unica pagina.
Altra cosa che ci manca da vedere di questa introduzione del poter dell'interfaccia di Fig.
Ma sono gli asset gli asset adesso non sono ancora attivi.
Sono tutti quegli elementi riutilizzabili che metto all'interno di un'interfaccia quando inizio a progettarla a destra ultima poi la vediamo piano piano per ogni esigenza è quella che viene detta la palette delle proprietà di design qualsiasi oggetto devo evitare che ho messo in pagina e devo cambiargli le proprietà, che si tratti di traccia, dimensione, colore quello che ci interessa lo troviamo nella parte di destra.
Ok, quindi abbiamo questa parte qui dedicata alle editing degli oggetti che mettiamo qui e ovviamente è contestuale, cioè cambia, perché se vado a mettere un testo chiaramente qui a destra, non ho gli stessi campi di prima.
Quando evitavo una sciarpa, una forma chiaramente qui le modifiche sono legate strettamente alla parte tipografica.
Ci sono anche queste altre due aspetti nella parete di destra, che però approfondiamo in un secondo momento quando siamo pronti.
Insomma, abbiamo lavorato un po' di più il file.
Questa è la macro introduzione per iniziare a capire come funziona Fig, ma importantissimo adesso io vedete, non sto salvando perché trovandomi sul cloud in automatico ogni tot lui sta salvando il mio documento, quindi non ho bisogno di fare nulla.
Se adesso si spegnesse la luce, anche si staccasse internet.
Io sono sicura che comunque c' è stato un salvataggio veramente fino a pochissimi secondi fa.
E questa è una diciamo delle magie, di questo nulla.
Learnn è la piattaforma online che ti aiuta a 360 gradi a crescere nel digitale. Sviluppa competenze con oltre 220 corsi, condividi i tuoi risultati, fai networking con otre 120.000 professionisti/e e oltre 300 aziende.
Vogliamo cambiare l’Italia, una persona alla volta.
Per farlo ci proponiamo di democratizzare l’apprendimento e accelerare la crescita di persone, idee e aziende attraverso strumenti tecnologici a supporto di qualsiasi professionista.
Learnn prevede un piano totalmente gratuito (Free) che ti permette di iniziare qualsiasi corso che abbiamo su Learnn.
Per chi volesse finire i corsi, ottenere certificazioni e connettersi con professionisti e aziende, Learnn Pro permette di avere accesso illimitato a tutto questo. Il corso di Learnn Pro è 9.99 euro / mese e puoi disdire quando vuoi.
Per i team di aziende abbiamo anche un Piano Team con oltre 300 clienti aziendali.
Potrai seguire i contenuti da computer, tablet e smartphone.
Scarica l’App iOS/Android Learnn e segui i contenuti in modalità video, audio e testo.
Learnn ha un piano gratuito che ti permette di accedere all 40% di ogni corso in maniera gratuita e solo con la tua email.
Learnn offre sia un piano gratuito con accesso limitato ai contenuti, sia un piano PRO del costo di soli 9.99 euro al mese con cui potrai avere accesso a tutti i nostri contenuti senza limiti o sorprese.
Una volta completata l’iscrizione sarà possibile gestire i propri dati e disdire in qualsiasi momento e in completa autonomia.
No, non offriamo certificazioni, facciamo di meglio.
Man mano che completi corsi potrai verificare le tue competenze e condividerle sul tuo profilo LinkedIn o CV.
Inoltre abbiamo sviluppato una feature chiamata Profile attraverso il quale otterrai un link personale per mostrare in tempo reale tutti i contenuti da te completati e molto altro.
Immagine personale, username, badge, link esterni e molto altro.
Crea una vera e propria sales page dove il prodotto in vendita sono le tue competenze.
Se avessi altre domande puoi usare la live chat qui di fianco.
Per partnership compila questo form
La nostra vision è rendere l'Italia famosa nel mondo per l'esecuzione.
La missione di Learnn
è accelerare la crescita di ogni individuo rendendo accessibili conoscenza, opportunità e tecnologia per avere un impatto positivo sul mondo e sugli altri.
Tutto incluso (come Netflix), IVA inclusa, nessuna sorpresa o addebito indesiderato.
Disdici quando vuoi, in 1 click.
Scegli di migliorare ogni giorno per 12 mesi senza interruzioni scegliendo il piano annuale.
In un unico pagamento annuale
Disdici quando vuoi, in 1 click.
Con l’abbonamento otterrai:
Consuma i +200 corsi e webinar di Learnn da webapp o app iOS e Android, in formato video, audio o testo.
Con l'abbonamento a Learnn hai accesso a tutto (proprio tutto) ciò che contiene la piattaforma.
Ogni mese registriamo nuovi corsi su tutto cio di cui potresti avere bisogno nel mondo digitale.
Con l'app Learnn trasformi ogni momento di vuoto in un'occasione di apprendimento.
Scarica tutto il materiale che ti serve e utilizza i moduli riassuntivi per fissare i concetti.
Ogni settimana nuove offerte di lavoro da parte di tantissime aziende che operano nel mondo digitale.