Scarica Introduzione alla Programmazione: Variabili, Tipi di Dati, Operatori e Controllo e più Schemi e mappe concettuali in PDF di Informatica Industriale solo su Docsity!
01 - PROGRAMMAZIONE
VARIABILE = posizione di memoria in chi si puó memorizzare un valore che puó essere modificato nel tempo, possono essere d’INGRESSO, d’USCITA o INTERNE. Bisogna dichiararle e assegnarle o inizializzarle (es intage=20) , di solito iniziano con la lettera minuscola, si usa la maiuscola se si uniscono due parole (camelCase) e A ≠ a, non puó essere una parola riservata STATO DI UN PROGRAMMA = definito dai valori di tutte le sue variabili e dall’istruzione che verrà seguita dopo COMPUTAZIONE = processo di esecuzione di un programma, si puó correggere tramite Debugger e i valori delle variabili possono essere controllati tramite stampa in console TIPI DI DATI : quali valori una variabile puó contenere e quali operazioni possiamo fare •PRIMITIVI : -numeri interi (BYTE = numeri piccoli interi, INT = numeri interi, LONG = numeri interi grandi) -numeri reali (FLOAT = un numero dopo la virgola, DOUBLE = due o più numeri dopo la virgola) -valori logici (boolean = vero o falso)
- caratteri (chart = singoli caratteri)
- colori (color) •RIFERIMENTO : array, stringhe e altri oggetti. Non sono primitivi perché fanno riferimento a strutture di dati o istanze di classi OPERATORI LOGICI : si usano con i valori booleani ⁃ &&, and, l’espressione è true se entrambe sono true ⁃ ||, or, l’espressione è true se almeno una è true ⁃ !, not, cambia true in false e viceversa Una valutazione pigra di esp. logiche è quando il processo di ferma appena il risultato è chiaro. CONFRONTO TRA VALORI NUMERICI Si usano gli operatori relazionali
(maggiore di), < (minore di), == (uguale a), != (diverso da) ◦ >= (maggiore o uguale a), <= (minore o uguale a), Il risultato del confronto è un valore logico (booleano) ◦ true oppure false
- Attenzione: gli operatori = e == hanno significati molto diversi! ◦ x = 3 assegnazione del valore 3 alla variabile x ◦ x == 3 restituisce il valore logico true se x contiene il valore 3, false altrimenti CONVERSIONE DI VALORI NUMERIC I (dei numeri interi o reali) -Promozione automatica : quando assegni un valore numerico a un tipo di dimensioni superiore Es: INT -> LONG -Cast / forzatura : quando si passa da un tipo più grande a più piccolo, indicare con il tipo desiderato tra parentesi Es: FLOAT -> INT, c’è una perdita di informazioni Char : Il tipo char comprende i primi 2^16 = 65536 caratteri Unicode Es: char c = 'N'; o codice Unicode: char c = '\u004E'
non è usato così frequentemente quanto le stringhe : sequenze di caratteri definite dal tipo string, es: String s = "Hello, world!" Una possibile operazione su stringhe è la CONCATENAZIONE usando l’operazione +, es.Strings1="Iu";Strings2="av";Strings3=s1+s2;->s3contiene"Iuav", non funziona con variabili di tipo char: sono trattate come numeri interi color : usato per rappresentare colori RGB ( triple di numeri o codice esadecimale), puó essere prelevato dalla finestra di visualizzazione es: colorc3=get(10,20), RGBA supporta anche la trasparenza DECISIONI E ITERAZIONI Tutti i linguaggi hanno costrutti che permettono di prendere decisioni IF : se … allora, si divide in condizione e corpo (istruzione composta) include un confronto o un’espressione logica include una o più istruzioni, il corpo viene eseguito se e solo se la condizione risulta true
- second() restituisce il valore dei secondi dell’orologio del computer al momento dell’esecuzione Se il corpo richiede piú istruzioni bisogna inserire le istruzioni all’interno di un BLOCCO DI ISTRUZIONI tra parentesi graffe DECISIONI ALTERNATIVE : utilizzare IF (condizione + corpo) + ELSE (corpo) Else viene eseguito se la condizione risulta false, viene eseguito il <corpo-else> i due corpi vengono eseguiti in maniera mutuamente esclusiva cioè mai contemporaneamente Problema: ripetere istruzioni : usare un costrutto di ciclo COSTRUTTO DI CICLO: ripetere una serie di istruzioni per un numero specifico di volte o finché una determinata condizione rimane vera, soprattutto quando non sappiamo a priori quante volte dobbiamo eseguire un certo blocco di codice ciclo WHILE : (condizione + corpo) continua ad eseguire un blocco di istruzioni finchè una condizione specifica rimane VERA. La condizione viene valutata prima di ogni iterazione del ciclo, se rimane TRUE, il corpo del ciclo viene eseguito. Se è FALSE il ciclo termina, l’AGGIORNAMENTO viene fatto dopo che si conclude( a differenza di for) Usato quando NON SAPPIAMO prima quante volte dovrà essere ripetuto un ciclo perchè la condizione dipende dai valori che cambiano durante l’esecuzione del ciclo. A differenza di for separa condizione e aggiornamento, quest ultimo incrementa solo dopo ogni operazione. Se ci sono errori logici che impediscono la terminazione di un ciclo avviene un ciclo infinito e ci sarà un arresto forzato. ciclo FOR : modo piú conciso per scrivere cicli che hanno una variabile di controllo che viene inizializzata, controllara e aggiornata ad ogni iterazione. for (; ; ) ; usato quando SAPPIAMO QUANTE VOLTE il ciclo for deve essere eseguito, inizializzazione, condizione e aggiornamento tutti nella dichiarazione
Spesso sono raggruppati in blocchi (setup, draw) I BLOCCHI hanno una specifica funzione e ognuno di essi risolve uno specifico problema, il loro utilizzo rende il codice MODULARE Es: creazione del comando STAR() -> modularitá METODI (blocchi di istruzioni) : Un metodo è un sottoprogramma che svolge una specifica funzione, ha un nome prestabilito che deve essere dichiarato: ⁃ permette di riutilizzare il codice in più punti ⁃ permette di scrivere programmi compatti, modulari e leggibili Quando un metodo viene eseguito, si dice che viene CHIAMATO ⁃ può includere o meno parametri ⁃ può restituire o meno valori ⁃ METODO PREDEFINITO: incluso in processing, non va dichiarato: es. rect(), background(), random(), second(), noLoop(), si puó chiamare in qualsiasi punto di uno sketch ⁃ METODO CALLBACK: nome prestabilito dal linguaggio, va dichiarato dall’utente, riempiendo di istruzioni il rispettivo blocco, es. setup(), draw(), non va chiamato: viene eseguito dal sistema in modo autonomo ⁃ METODO UTENTE: che crea l’utente ,va dichiarato e poi chiamato, es. star() Dichiarazione: ⁃ il nome del metodo (meglio se in camelCase) ⁃ l’elenco (eventualmente vuoto) dei suoi parametri di ingresso, tra parentesi ⁃ il suo codice interno (corpo del metodo) ⁃ il tipo di dati del valore restituito in uscita (o nessun valore) Nella prima riga, detta intestazione, specificare tipo di dati, nome e parametei Chiamata: stai dicendo al programma di eseguire le istruzioni prima definite ⁃ nome del metodo ⁃ l’elenco dei suoi argomenti di ingresso, se previsti (PASSAGGIO DEI PARAMETRI) ⁃ l’utilizzo dell’eventuale valore restituito in uscita METODO INVOCATO E INVOCANTE: quando usi un metodo all’interno di un altro metodo, come second() all’interno di setup(), il secondo (second) è il metodo INVOCATO, il primo (setup) è INVOCANTE I metodi si possono chiamare solo se siamo in modalità attiva (abbiamo chiamato setup) Possiamo chiamare quante volte vogliamo un metodo - con argomenti diversi - utilizzando diversi valori di uscita Il metodo contiene una nuova istruzione RETURN, determina il valore restituito al metodo invocante, il tipo di dati deve essere uguale a quello dichiarato Se si vuole che un metodo restituisca un valore
- si deve definire il tipo di dati nell’intestazione (es. int)
- il corpo del metodo deve includere l’istruzione return Se non si vuole che un metodo restituisca un valore si deve dichiarare il tipo di dati “vuoto” void nell’intestazione (METODI CALLBACK)
quindi i metodi che non restituiscono alcun valore (void) , detti anche PROCEDURE ⁃ tipico dei metodi di disegno: impostazioni, tratti, forme... es.fill(),rotate(),line() i metodi che restituiscono un valore, detti anche FUNZIONI, es. second() restituisce un valore di tipo int, es. random() restituisce un valore di tipo float Nel metodo star troviamo altri metodi : beingshape, vertex, endshape METODO RICORSIVO = metodo che richiama se stesso all’interno del suo corpo, crea una specie di ciclo. Utlizzano algoritmi ricorsivi, si suddivide il problema in sotto problemi simili ma più semplici. es cerchi ricorsivi Un metodo ricorsivo può essere utilizzato per calcolare il fattoriale (prodotto dei primi n numeri interi positivi) n! Si potrebbe fare anche con un ciclo for ma è meglio scegliere il metodo ricorsivo.
- il metodo invocante viene sospeso
- il metodo invocato viene eseguito fino alla sua terminazione
- il metodo invocante viene ripreso dal punto in cui era stato sospeso Requisiti fondamentali di un algoritmo ricorsivo ⁃ casi base: soluzione diretta al problema per una o più istanze “semplici” ⁃ passo ricorsivo: soluzione al problema come combinazione delle soluzioni di uno o più sottoproblemi più semplici in mancanza di uno dei due, la ricorsione continuerebbe all’infinito, ogni sotto problema deve avvicinarsi al caso base Anche i numeri di FIBONACCI possono essere calcolati con un metodo ricorsivo ma è inefficiente perchè va a calcolare più volte lo stesso numero (ricorsione doppia). È possibile migliorare l’efficienza trasformandolo da ricorsivo a iterativo (sempre possibile) DISEGNO DI FRATTALI : Un frattale è un oggetto geometrico che si ripete nella sua forma allo stesso modo su scale diverse, questa proprietà rende naturale l’uso della ricorsione per disegnarlo. Il metodo può disegnare una parte e poi si puó richiamare per disegnare le parti piú piccole OGGETTI E CLASSI Finora abbiamo visto quasi esclusivamente tipi di dati primitivi (int, float, boolean, color) tranne String e Array che sono entrambi tipi di dati di riferimento perchè vengono assegnati a variabili e passati a metodi per riferimento Una variabile di un tipo di riferimento dichiarata ma non inizializzata non contiene alcun riferimento, bensì il valore nullo Dati string : ⁃ immutabile: se modificato (es. concatenazione), non viene sostituito da una nuova versione ma memorizzato in un diverso indirizzo ⁃ possiede diversi metodi per la manipolazione (es: length(), equals() verifica se è uguale ad un’altra) Dati array :
È buona norma salvare il codice che definisce una CLASSE in uno sketch a sé stante, per essere utilizzato poi da piú sketch. In processing possiamo creare TAB (schede) differenti per organizzare meglio il codice. Una volta definita una NUOVA CLASSE possiamo definirla come un nuovo tipo di DATI DI RIFERIMENTO (es circle), possiamo dunque dichiarare variabili di tipo circle o array di valori di tipo circle 02.ELABORAZIONE GRAFICA E DIGITALE SKETCH STATICI : il risultato dell’elaborazione grafica è un singolo frame, visualizzato al termine dell’esecuzione dello sketch SKETCH DINAMICI : creano interazioni che cambiano nel tempo, bisogna visualizzare una frequenza di frame. Bisogna riorganizzare il codice in due blocchi: ⁃ setup() istruzioni di preparazione al disegno (size, background, stroke), eseguito una sola volta all’avvio dello sketch, Il comando size() va sempre all’interno di setup() ⁃ draw() contiene le operazioni di disegno, viene eseguito ripetutamente finché l’utente non termina l’esecuzione L’esecuzione ripetuta di draw() è detta RENDERING CONTINUO: al termine di ogni iterazione viene visualizzato un diverso frame La FINESTRA DI VISUALIZZAZIONE viene aggiornata al termine di ogni singola esecuzione di draw(), utilizzando un processo chiamato double-buffering, x: evitare il flicker (tremolio) dovuto a un refresh frequente Se volessimo disegnare un frame diverso ad ogni esecuzione, spostare il comando background(); all’inizio di draw() STRUMENTI PER LE ANIMAZIONI Variabili di sistema : variabili predefinite da Processing, non bisogna assegnare il loro nome ad altre variabili, la maggior parte è accessibile solo in sola lettura tranne alcune. width e height: dimensioni finestra di visualizzazione, se size() non viene inserito il valore predefinito = mouseX, mouseY: Posizione del puntatore del mouse frameCount: numero di frame elaborati dall’inizio dell’esecuzione frameRate: numero di frame elaborati al secondo (fps), valore predefinito si aggira intorno ai 60 fps, per modificarla, si usa l’omonimo comando frameRate() noLoop() disattiva il rendering continuo se eseguito nel blocco setup(), viene generato un singolo frame se eseguito nel blocco draw(), viene generato un ultimo frame Casualità = per generare un numero casuale si usa il comando random() (random(min_value, max_value)), se specifichiamo un solo valore, l’intervallo è tra 0 e quel valore (escluso). Il comando restituisce sempre un valore di tipo float per ottenere un numero intero, si può applicare un cast
TRASFORMAZIONI AFFINI : trasformazioni lineari dello spazio euclideo, l’ordine delle trasformazioni è importante
- translate(): trasla in orizzontale e/o verticale di un certo numero di pixel
- rotate(): ruota in senso orario i un certo numero in radianti
- scale(): ingrandisce (o rimpicciolisce) di un certo fattore
- pushMatrix(): salva il sistema di coordinate corrente
- popMatrix(): ripristina il sistema di coordinate salvato precedentemente
- colorMode(mode, max): cambia la modalità (mode) utilizzata per la gestione dei colori (es. HSB), specifica il massimo del valore (max) assunto da ogni canale ELABORAZIONE DI IMMAGINI E VIDEO , attraverso diversi metodi
- distorsione (warping) : modifica della posizione dei pixel in un immagine (es. scalatura non uniforme, riflessione, proiezione)
- filtraggio : modifica del colore dei pixel (es. conversione in scala di grigi, correzione della luminosità)
- trasformazioni colore: elaborazioni in stile “fotografico” che alterano il colore di ogni singolo pixel (es. inversione, posterizzazione, sogliatura)
- filtri convoluzionali: modificano il colore del pixel in base all’operazione matematica di convoluzione sui colori dei pixel vicini (es. sfocatura (blur), aumento della nitidezza (sharpen), rilievo (emboss) oggetto PImag : le immagini caricate (GIF, JPEG, TGA e PNG) sono conservate in oggetti denominati PImage
- dichiarare una variabile globale, di tipo PImage: es. PImage img;
- all’interno di setup() assegnare alla variabile un file immagine contenuto nella cartella data dello sketch, tramite il comando loadImage() con argomento una stringa con il nome del file (l’immagine deve già trovarsi in data dello sketch)
- visualizzare l’immagine tramite il metodo image() in draw oggetto PImage possiede tre proprietà
- width e height: larghezza e altezza in pixel dell’immagine
- pixels: array di valori di tipo color contenente i singoli pixel, riga per riga Per elaborare un’immagine conservata in un oggetto PImage
- si chiama un suo metodo (es. filter()) sulla variabile che punta ad essa
- si modificano i pixel uno ad uno con i metodi get() e set() Altri metodi propri di PImage resize(), save(), mask() maschera al canale alfa, blend() combinazione di immagini Filtri convoluzionali : modificano il valore del pixel in base a un’operazione sui pixel vicini basandosi sull’utilizzo di un KERNEL = matrice contenente i coefficienti della convoluzione ( 3x3, 5x5, 7x7,…) se la somma dei coefficienti è pari a 1, l’immagine risultante avrà luminosità paragonabile a quella originaria, scurita (<1) o schiarita (>1) Come funziona la convoluzione?
-si aggiungono due forme 3D primitive: cubo: box(s), con s lunghezza del lato, sfera: sphere(s), con s lunghezza del raggio Le trasformazioni affini aggiungono una terza dimensione (Z), usare sempre pushMatrix() e popMatrix() per evitare che le trasformazioni si accumulino lluminazione: Il colore di una forma 3D è influenzato da
- il suo colore di riempimento (fill())
- direzionalità e colore della sorgente luce, sempre configurate in draws Tipi di sorgenti luce
- ambientale: la forma è illuminata in ogni direzione
- puntiforme: sorgente localizzata, emissione omnidirezionale
- direzionale: sorgente distante, emissione lungo una singola direzione
- illuminazione di default, comando lights() Proprietà del materiale:
- emissività: capacità di emettere luce propria, comando emissive(r,g,b)
- lucentezza della superfici:, comando shininess(s) con s livello di lucentezza
- specularità: capacità di creare riflessioni speculari, comando specular(r,g,b) Per poter notare differenze di lucentezza e specularità occorre impostare il colore speculare della luce usando lightSpecular(r,g,b) prima di selezionare il tipo di sorgente di luce Rendering immediato: metodo di default dove le forme 3d vengono create, disegnate e scartate ad ogni frame. Questo processo può diventare inefficiente x scene complesse perchè ogni forma deve essere ridisegnata da 0 in ogni fase il numero totale di vertici è uno dei principali fattori di rallentamento della computer grafica Rendering mantenuto: ottimizza la performance, invece di ricreare ogni forma in ogni frame, creare le forme una sola volta, salvarle in memoria, e limitarci a disegnarle frame per frame
- in setup() salvare ogni forma 3D in un separato oggetto PShape tramite il metodo createShape()
- in draw() ◦ aggiornare la scena ad ogni frame con il metodo shape() Possiede metodi: setFill(), setStroke() translate(), rotateX/Y/Z(), scale() Possiamo anche raggruppare più forme in un singolo oggetto PShape per avere una performance grafica superiore Texture mapping: Per “rivestire” una forma con una texture in formato immagine usa il metodo setTexture() di PShape, con l’immagine (oggetto PImage) come argomento
- per forme elementari, come sfere e cubi, l’adattamento è automatico
- per forme più complesse, specificare le coordinate della texture, ovvero indicare quale pixel dell’immagine va mappato e su quale vertice della forma Caricamento di modelli 3D
Un oggetto PShape può anche contenere una geometria 3D importata
- tramite il metodo loadShape(), che supporta il formato .obj
- se al formato .obj è associato un file ausiliario .mtl (material) vengono importate automaticamente le impostazioni del materiale e l’eventuale texture Per adattare la geometria alla finestra di visualizzazione
- NORMALIZZAZIONE, adattamento alla finestra di visualizzazione, usando i metodi getWidth(), getHeight()e/o getDepth()dell’oggetto PShape
- ROTAZIONE di 180° rispetto all’asse x (in grafica 3D, per convenzione asse y punta verso l’alto)
- CENTRARE la geometria rispetto alle coordinate dello schermo ELABORAZIONE E SINTESI AUDIO Il suono è un fenomeno fisico che si manifesta come variazioni di pressione nell’aria e raggiungono la membrana timpanica, che entra in vibrazione e causa una sensazione percettiva prodotta a livello celebrale Caratteristiche fondamentali di un’onda
- ampiezza A: variazione massima della grandezza che oscilla
- lunghezza d’onda λ: distanza tra due punti massimi (o minimi)
- velocità di propagazione c : (dipende dal mezzo) caria = 343.2 m/s
- frequenza f (in Hertz) f = c/λ Suono puro : suono composto da una sola onda sinusoidale è detto puro Suono complesso : suono composto da molteplici onde
- ognuna con una certa ampiezza e frequenza, yn(t) = An sin 2π fn t Rumore bianco : somma di tutte le frequenze con uguale ampiezza Le componenti possono essere visualizzate in uno spettrogramma Digitalizzazione del suono : perché un computer possa rappresentarli, significa discretizzare
- campionamento: dominio temporale del segnale. Iil segnale sonoro viene suddiviso in una serie di campioni presi a intervalli regolari di tempo. La frequenza con cui questi campioni vengono raccolti si chiama FREQUENZA DI CAMPIONAMENTO in Hertz (Hz), deve essere almeno il doppio della più alta frequenza udibile per evitare i fenomeni di aliasing
- quantizzazione: misurazione della pressione sonora in numeri. Si divide la gamma delle ampiezze in regioni e si associa a ciascuna un valore numerico (sequenza di bit) tipicamente 16 o 24 bit oggetto SoundFile (WAV, MP3, AIFF) installare ed importare la libreria Sound, inserire import processing.sound.*; come prima riga dello sketch, dichiarare e inizializzare la variabile, riprodurre tramite il metodo play o loop Un oggetto SoundFile non possiede proprietà, ma oltre a play() e loop() possiede diversi metodi: stop() , pause() isPlaying() , amp(val) modifica il volume di riproduzione, pan(val) sposta il suono tra i canali sx (val =- 1.0) e dx (val = 1.0), rate() imposta la velocità di riproduzione
- la più bassa è la frequenza fondamentale (f0)
- le altre sono dette parziali e possono seguire una serie
- armonica (es. strumenti a fiato/corda)
- inarmonica (es. strumenti percussivi) Frequenze e ampiezze delle parziali determinano il timbro di un suono In Processing possiamo creare suoni armonici (o inarmonici) attraverso
- sintesi ADDITIVA = combinando più segnali periodici dall’opportuno inviluppo
- sintesi SOTTRATTIVA = filtrando lo spettro di un rumore bianco, elaborando la frequenza con i filtri Rumore bianco dall’inviluppo molto breve -> impulso 03.INTERAZIONE UTENTE - ELABORATORE HCI (human-computer interaction) = ricerca multidisciplinare (informatica, design, interaction design, sociologia.. ) che studia l’interazione, diretta o indiretta, tra utente e computer o tecnologie interattive l’interazione avviene attraverso una o più interfacce che traducono i concetti dell’utente in quelli del computer
- l’interazione diretta: presuppone un dialogo con feedback, es. click di tasto -> apertura di una finestra
- l’interazione indiretta: avviene osservando eventi non intenzionali, es. Correzione automatica di una parola, profilazione di un utente su una pagina web Fattori chiave della HCI: utente (capacità e abilità), computer (tecnologie disponibili), funzionalità (scopo da raggiungere), spazio (fisico o digitale), tempo (di azione e di risposta), usabilità (efficacia, efficienza, soddisfazione) Fasi dell’interazione tra utente e computer
- INPUT: (raccolta di informazioni)
- lato utente : percezione (visiva, uditiva, tattile,…)
- lato computer. sensori (tastiera, webcam,…)
- PROCESSING: (elaborazione di informazioni)
- lato utente : cognizione (memoria, ragionamento,…)
- lato computer : elaborazione (memoria, algoritmi,…)
- OUTPUT: (comunicazione di informazioni)
- lato utente: azione (click, comando vocale,…)
- lato computer: attuatori (schermo, vibrazione,…) Utente e computer possono essere visti come agenti simmetrici, entrambi con sensi (input) e attuatori (output) MODELLI DI INTERAZIONE Modello di Norman (1988): centrato sull’utente, articolato in due fasi
- esecuzione, l’utente stabilisce l’obiettivo, formula l’intenzione, specifica l’azione da compiere, esegue l’azione
- valutazione, l’utente percepisce lo stato del sistema, interpreta lo stato del sistema, valuta lo stato del sistema rispetto all’obiettivo
Modello di Abowd & Beale (1991): utente e sistema hanno due linguaggi diversi (task vs core) L’interfaccia comunica e traduce tra i due linguaggi, + interazione Modello simmetrico, interazione in 4 fasi
- articolazione: l’utente formula un obiettivo tramite una sequenza di azioni
- performance: il sistema elabora delle azioni e cambia il suo stato interno
- presentazione: comunicazione del nuovo stato interno del sistema attraverso output visivo, sonoro ecc
- osservazione: interpretazione della presentazione in linguaggio task Errori di interazione:
- un design poco soddisfacente dell’interfaccia
- la distanza tra linguaggi task e core
- fattori umani bisogna compensare con un design solido, che minimizzi la probabilità di azioni inappropriate e massimizzi la capacità di mitigarle INTERAZIONE IN AMBIENTI DESKTOP Esistono diversi stili di interfaccia utente, tra cui
- a riga di comando: comandi in forma testuale
- finestre di dialogo e form: questionari
- punta e clicca: uso del mouse
- linguaggio naturale: motore di ricerca, chatbot
- wimp : Windows, Icons, Menus, Pointer
- gestuali: applicazioni di disegno, controller per giochi
- tangibili: manipolazione di oggetti (es. pulsanti o tecnologie RFID, NFC) Le interfacce tradizionali (computer desktop) prevedono interazione via
- tastiera e mouse: input fornito per via tattile
- schermo e altoparlanti: output visivo e uditivo ● Interfaccia a riga di comando : realizzata tramite un programma detto interprete dei comandi che attende l’inserimento di un comando visualizzando un PROMPT (es. “>”) e lo esegue o segnala un errore. I comandi dipendono dal SO e possono includere diverse opzioni: flessibilità L’Interazione è complessa, bisogna conoscere i comandi e comandi non sono segnalati ● interazione WIMP (Windows, Icons, Menus, Pointer). Tipica delle interfacce grafiche (Graphical User Interface, GUI) Accesso al SO tramite dispositivo di puntamento su schermo, sono dette anche ambienti desktop (scrivania)
- W-finestre: riquadri per la visualizzazione di applicazioni, dati, icone
- I-icone: rappresentazioni in miniatura di applicazioni, file, cartelle
- M-menu: pop-up, a tendina, a cascata
- P-puntatore: Interazione semplice e intuitiva Esempi di interazione: chiusura di una finestra, doppio click su icona, cut/copy & paste, drag & drop Oggetti interattivi addizionali (widgets): pulsanti (button, radio button, checkbox), controlli a scorrimento (slider, scrollbar), barra degli strumenti (toolbar), finestre speciali (finestre di dialogo, palette)
Touchscreen, poco spazio e limitata risoluzione spaziale, l’utente pone poca attenzione durante l’uso (alta probabilità di errore)
- ridurre il design dell’interfaccia all’essenziale
- utilizzare design verticali con scorrimento (scrolling)
- inserire elementi interattivi di dimensioni sufficientemente grandi
- limitare le possibilità di errore: minimizzando lo sforzo di input dell’utente e ottimizzando il layout visivo thumb zone = area più facilmente raggiungibile con il pollice oltre al touchscreen, l’interazione avviene tramite
- sensori: video, audio, movimento (accelerometro), posizione (gps), ambientali (temperatura)
- attuatori: schermo, torcia, autoparlanti, motore di vibrazione Dispositivi wearable: indossabili, oltre alle funzioni già descritte
- monitorare parametri FISIOLOGICI: frequenza cardiaca (HR), attività elettrodermica (EDA) tramite sensori PPG
- abilitare una INTERAZIONE IMMERSIVA: visiva (realtà virtuale) o uditiva (cuffie) Processing for Android: Libreria Processing + modalità di programmazione, richiede l’Android Software Development Kit (SDK) per funzionare, permette di eseguire sketch (sottoforma di app) su dispositivi Android (smartphone, tablet, smartwatch, …) o su un emulatore (versione software di un dispositivo fisico) Adattare l’output allo schermo:
- dimensione = lunghezza della diagonale dello schermo (in pollici)
- risoluzione = numero di pixel (orizzontale x verticale)
- PPI (pixel per inch) = misura della densità dei pixel, data dal rapporto tra il numero di pixel sulla diagonale e la lunghezza della diagonale stessa Se vogliamo elementi grafici della stessa grandezza su più dispositivi dobbiamo considerare la variabile displayDensity, contenente un valore proporzionale alla PPI dello schermo corrente AMBIENTI MOBILE: INTERAZIONE TOUCH : interazione diretta via touchscreen
- point and click per digitare e selezionare elementi
- gestuale per interazioni più articolate Alcuni gesti necessitano di tecnologie multi-touch Interazione single-touch : analoga all’interazione via mouse in ambiente desktop
- non esiste uno stato di movimento senza pressione (hovering)
- non abbiamo nè i pulsanti nè una rotella per differenziare le azioni
- l’azione di click diventa ridondante Interazione multi-touch : rilevano e tracciano più punti di contatto simultaneamente
- movimenti di più punti di contatto (tipicamente fino a 10)
- la pressione applicata allo schermo in ogni suo punto servono coordinate x e y del punto di contatto e la dimensione dell’area di contatto Metodi callback per gestire pressione, movimento e rilascio di un punto: touchStarted(), touchMoved(), touchEnded() AMBIENTI MOBILE: INTERAZIONE CON I SENSORI es. accelerometro e giroscopio
Sensori di movimento : assumono un sistema di coordinate statico rispetto al dispositivo, assi x, y -> schermo, asse z -> spessore Accelerometro : misura l’accelerazione del dispositivo lungo ognuno dei tre assi (in m/s^2) accelerazione rilevata = cambio di velocità + gravità, es, livella, contapassi, fitness, … Giroscopio: misura la velocità di rotazione attorno ognuno dei tre assi (in rad/s) senso antiorario = valori positivi; senso orario = valori negativi, es. movimento nei giochi, immagini a 360°, … Sensori di posizione Magnetometro: misura il campo magnetico del dispositivo lungo ognuno dei tre assi (in μT), es. navigatore, bussola Sensore di prossimità: misura la distanza dal sensore alla superficie visibile più vicina, es.spegnimento schermo, volume automatico durante una chiamata Ricevitore GPS: (Global Positioning System) rileva la posizione geografica dello smartphone es. in app navigatore, trova il mio dispositivo, … Sensori ambientali Sensore di luce: misura l’illuminazione corrente (in lux), luminosità schermo Sensore di temperatura: misura la temperatura ambientale (in °C), non del dispositivo Barometro: misura la pressione atmosferica (in hPa), per stimare l’ altitudine Igrometro: misura l’umidità relativa dell’aria (in %) Sensori: la libreria Ketai: libreria che semplifica l’interazione con i sensori android. I dati provenienti dai sensori sono gestiti da appositi METODI ASCOLTATORI, metodi callback chiamati ogni volta che il sensore produce un nuovo valore. Per verificare la disponibilità di un sensore nel dispositivo isAvailable() AVD e sensori virtuali : se un sensore non è disponibile, lo si può simulare con l’emulatore, due sezioni : - Device pose per i sensori di movimento (con slider e interfaccia 3D)
- Additional sensors per i sensori di posizione e ambientali (con slider) Sensori compositi: basati sull’elaborazione dei dati grezzi provenienti da uno o più sensori di base, es. contapassi Con metodi ascoltatori e metodi x la disponibilità. Caso particolare: sensore di orientamento (rispetto al nord magnetico) accelerometro + magnetometro Geolocalizzazione: resa possibile da più tecnologie: GPS: precisione ≃5 m, consuma energia + punti di accesso Wi-Fi: precisione ≃40 m + torri cellulari: precisione variabile Vi si accede tramite l’oggetto KetaiLocation dopo aver selezionato i permessi Simulazione di percorso in AVD: x testare un percorso grazie ad un file gpx
Determinato da tre VETTORI: right, up e forward, aggiornati automaticamente ad ogni frame per tenere conto della rotazione della testa il vettore forward corrisponde alla linea di vista (line of sight) Per verificare se si stia guardando un oggetto: metodo intersectsBox(d,0,0), verifica se un oggetto interseca la linea vista Movimento dell’osservatore Diverse opzioni per l’esplorazione dinamica della scena:
- abilitare / disabilitare il movimento tramite pressione / rilascio del pulsante o tramite specifiche rotazioni della testa
- vincolare del tutto il movimento dell’osservatore (automatic movement)
- vincolare il libero movimento (es. al piano xz)
- lasciare all’osservatore totale libertà di movimento (free-range movement) Implementare il movimento dell’osservatore:
- applicare le opportune trasformazioni affini per posizionare l’osservatore all’interno della scena
- utilizzare traslazioni e/o rotazioni opposte al movimento dell’osservatore per traslare/ruotare la scena rispetto ad esso
- infine, disegnare la scena REALTÀ ESTESA Realtà mista (mixed reality, MR) = mix tra REALTà VIRTUALE e REALTA’ REALE MR + VR = realtà estesa (extended reality, XR) La MR include:
- AR, realtà aumentata (augmented reality), il virtuale aumenta il reale
- AV, virtualità aumentata (augmented virtuality), il reale aumenta il virtuale Realtà aumentata (AR) : es. pokemongo, filtri snapchat Sovrappone contenuti generati dal computer sul mondo reale, sfrutta principalmente l’informazione proveniente dall’ambiente, non rimpiazzandolo ma integrandolo
- l’osservazione dell’ambiente avviene direttamente tramite il canale visivo oppure tramite i sensori (es. fotocamere)
- richiede algoritmi di computer vision e, in generale, di intelligenza artificiale Interfacce audio:
- CUFFIE APERTE: (open-back), che lasciano passare i suoni ambientali
- CUFFIE HEARTHROUGT: che registrano i suoni e li mixano con suoni virtuali Interfacce video:
- dispositivi OLOGRAFICI e smartglass,
- display mobile
- proiettori digitali
AR in Processing for Android: utilizzabile esclusivamente per sovrapporre contenuti 3D sul mondo reale, visto dalla prospettiva della fotocamera del dispositivo, attualmente in grado di riconoscere soltanto superfici piane
04. INTELLIGENZA ARTIFICIALE Studia la possibilità di costruire computer che siano in grado di riprodurre il funzionamento di alcune capacità della mente umana.
- programmi che svolgono funzioni tipicamente umane (es. giocare a dama, riconoscere il soggetto di una foto)
- tecnologie che riescano efficacemente ad imparare, percepire, interagire Boom d’interesse:
- la disponibilità e l’accesso libero a grandi quantità di dati (big data)
- progressi del Machine learning (ML, il computer impara grazie ad algoritmi) e soprattutto del Deep Learning (DL, impara utilizzando strutture ispirate al funzionamento del cervello) weak AI = sistema o un programma che si limita a risolvere uno specifico problema strong AI o AGI (intelligenza generale artificiale) = sistema in grado di eseguire qualsiasi compito intellettuale che un essere umano può fare, comprendendo e apprendendo da esperienze diverse in modo autonomo (robot) CAPACITA’ DELL’AI Visione artificiale (Computer Vision ) = è la capacità di interpretare dati visivi
- riconoscere e/o localizzare oggetti o persone
- comprendere il contenuto semantico di immagini o video es. segmentazione di immagini, generazione di didascalie, riconoscimento emozioni Ascolto artificiale (machine listening) = capacità di interpretare dati audio
- riconoscere e/o localizzare sorgenti o eventi sonori
- comprendere il contenuto semantico di segnali audio es. conversione del parlato in testo, riconoscimento del parlatore Elaborazione del linguaggio (natural language processing (NLP)) = capacità di interpretare e comprendere contenuti semantici in un certo linguaggio e interagirci es. traduzione automatica, correzione errori, chatbot Robot intelligenti = settore indipendente dell’informatica e dell’ingegneria, anche senza AI, apprendono e controllo grazie a sensori con l’AI Previsione (forecasting) = capacità di stimare il corso degli eventi tramite l’analisi approfondita di pattern complessi in serie temporali di dati, es. previsione del prezzo di un bene di consumo Scoperta (knowledge discovery) = capacità di individuare pattern, relazioni logiche, similarità in grandi quantità di dati
